feat: add customizations for DrawerPageDemo.

This commit is contained in:
Zhang Dian
2026-04-24 18:24:57 +08:00
parent 89d6808214
commit 6fc6e3000f
2 changed files with 68 additions and 77 deletions

View File

@@ -10,45 +10,84 @@
<DockPanel>
<ScrollViewer DockPanel.Dock="Right" Width="260">
<StackPanel Margin="12" Spacing="8">
<TextBlock Text="Configuration" FontWeight="SemiBold" FontSize="16"
Foreground="{DynamicResource SemiColorText0}" />
<TextBlock
Theme="{DynamicResource TitleTextBlock}"
Classes="H4"
Text="Configuration" />
<Button Content="Toggle Drawer"
HorizontalAlignment="Stretch"
Click="OnToggleDrawer" />
<Separator />
<CheckBox Name="ToggleDrawerCheck"
Content="Toggle Drawer" />
<CheckBox Name="GestureCheck"
Content="Gesture Enabled"
IsChecked="True"
IsCheckedChanged="OnGestureChanged" />
<ComboBox SelectionChanged="OnLayoutChanged" >
<ComboBoxItem Content="CompactOverlay" />
<ComboBoxItem Content="CompactInline" />
<ComboBoxItem Content="Split" />
<ComboBoxItem Content="Overlay" />
IsChecked="True" />
<TextBlock Text="Behavior" FontSize="12" />
<ComboBox
Name="BehaviorComboBox"
HorizontalAlignment="Stretch"
SelectedIndex="0">
<DrawerBehavior>Auto</DrawerBehavior>
<DrawerBehavior>Flyout</DrawerBehavior>
<DrawerBehavior>Locked</DrawerBehavior>
<DrawerBehavior>Disabled</DrawerBehavior>
</ComboBox>
<Separator />
<TextBlock Text="Layout" FontSize="12" />
<ComboBox
Name="LayoutComboBox"
HorizontalAlignment="Stretch"
SelectedIndex="0">
<DrawerLayoutBehavior>Overlay</DrawerLayoutBehavior>
<DrawerLayoutBehavior>Split</DrawerLayoutBehavior>
<DrawerLayoutBehavior>CompactOverlay</DrawerLayoutBehavior>
<DrawerLayoutBehavior>CompactInline</DrawerLayoutBehavior>
</ComboBox>
<TextBlock Text="Status" FontWeight="SemiBold" FontSize="14" />
<TextBlock Name="StatusText"
Text="Drawer: Closed"
Opacity="0.7"
TextWrapping="Wrap" />
<TextBlock Text="Layout" FontSize="12" />
<ComboBox
Name="PlacementComboBox"
HorizontalAlignment="Stretch"
SelectedIndex="0">
<DrawerPlacement>Left</DrawerPlacement>
<DrawerPlacement>Right</DrawerPlacement>
<DrawerPlacement>Top</DrawerPlacement>
<DrawerPlacement>Bottom</DrawerPlacement>
</ComboBox>
<TextBlock Text="Compact Drawer Length" FontSize="12" />
<StackPanel Orientation="Horizontal" Spacing="8">
<Slider Name="CompactDrawerLengthSlider"
Minimum="0" Maximum="250" Value="80"
TickFrequency="1"
IsSnapToTickEnabled="True"
Width="150" />
<TextBlock Text="{Binding #CompactDrawerLengthSlider.Value}" />
</StackPanel>
<TextBlock Text="Drawer Length" FontSize="12" />
<StackPanel Orientation="Horizontal" Spacing="8">
<Slider Name="DrawerLengthSlider"
Minimum="150" Maximum="400" Value="260"
TickFrequency="1"
IsSnapToTickEnabled="True"
Width="150" />
<TextBlock Text="{Binding #DrawerLengthSlider.Value}" />
</StackPanel>
</StackPanel>
</ScrollViewer>
<Border DockPanel.Dock="Right" Width="1" Background="{DynamicResource SemiColorBackground0}" />
<DrawerPage Name="DemoDrawer"
Margin="12"
Header="First Look"
DrawerLayoutBehavior="Overlay"
CompactDrawerLength="80"
DrawerLength="250">
IsOpen="{Binding #ToggleDrawerCheck.IsChecked}"
IsGestureEnabled="{Binding #GestureCheck.IsChecked}"
DrawerBehavior="{Binding #BehaviorComboBox.SelectedItem}"
DrawerLayoutBehavior="{Binding #LayoutComboBox.SelectedItem}"
DrawerPlacement="{Binding #PlacementComboBox.SelectedItem}"
CompactDrawerLength="{Binding #CompactDrawerLengthSlider.Value}"
DrawerLength="{Binding #DrawerLengthSlider.Value}">
<DrawerPage.DrawerHeader>
<TextBlock Text="Menu" Margin="16" FontSize="18" FontWeight="SemiBold" Foreground="{DynamicResource SemiColorPrimary}" />
</DrawerPage.DrawerHeader>
@@ -74,4 +113,4 @@
</DrawerPage.Content>
</DrawerPage>
</DockPanel>
</UserControl>
</UserControl>

View File

@@ -1,8 +1,6 @@
using System;
using System.Linq;
using System.Linq;
using Avalonia.Controls;
using Avalonia.Input.GestureRecognizers;
using Avalonia.Interactivity;
using Avalonia.Layout;
namespace Semi.Avalonia.Demo.Pages;
@@ -15,32 +13,6 @@ public partial class DrawerPageDemo : UserControl
EnableMouseSwipeGesture(DemoDrawer);
}
protected override void OnLoaded(RoutedEventArgs e)
{
base.OnLoaded(e);
DemoDrawer.Opened += OnDrawerStatusChanged;
DemoDrawer.Closed += OnDrawerStatusChanged;
}
protected override void OnUnloaded(RoutedEventArgs e)
{
base.OnUnloaded(e);
DemoDrawer.Opened -= OnDrawerStatusChanged;
DemoDrawer.Closed -= OnDrawerStatusChanged;
}
private void OnDrawerStatusChanged(object? sender, EventArgs e) => UpdateStatus();
private void OnToggleDrawer(object? sender, RoutedEventArgs e)
{
DemoDrawer.IsOpen = !DemoDrawer.IsOpen;
}
private void OnGestureChanged(object? sender, RoutedEventArgs e)
{
DemoDrawer.IsGestureEnabled = GestureCheck.IsChecked == true;
}
private void OnMenuSelectionChanged(object? sender, SelectionChangedEventArgs e)
{
if (DrawerMenu.SelectedItem is ListBoxItem item)
@@ -50,10 +22,7 @@ public partial class DrawerPageDemo : UserControl
Header = item.Content?.ToString(),
Content = new TextBlock
{
Text = $"{item.Content} page content",
FontSize = 16,
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center,
Text = $"{item.Content} page content", FontSize = 16, HorizontalAlignment = HorizontalAlignment.Center, VerticalAlignment = VerticalAlignment.Center,
},
HorizontalContentAlignment = HorizontalAlignment.Stretch,
VerticalContentAlignment = VerticalAlignment.Stretch
@@ -62,11 +31,6 @@ public partial class DrawerPageDemo : UserControl
}
}
private void UpdateStatus()
{
StatusText.Text = $"Drawer: {(DemoDrawer.IsOpen ? "Open" : "Closed")}";
}
private static void EnableMouseSwipeGesture(Control control)
{
var recognizer = control.GestureRecognizers
@@ -75,16 +39,4 @@ public partial class DrawerPageDemo : UserControl
recognizer?.IsMouseEnabled = true;
}
private void OnLayoutChanged(object? sender, SelectionChangedEventArgs e)
{
DemoDrawer.DrawerLayoutBehavior = (sender as ComboBox)?.SelectedIndex switch
{
0 => DrawerLayoutBehavior.CompactOverlay,
1 => DrawerLayoutBehavior.CompactInline,
2 => DrawerLayoutBehavior.Split,
3 => DrawerLayoutBehavior.Overlay,
_ => DrawerLayoutBehavior.CompactOverlay
};
}
}
}