fix CommandBar issues (#763)

* feat: extract shared theme from AppBarButton & AppBarToggleButton.

* feat: enhance CommandBar with dynamic overflow and adjustable width.

* fix: fix Width in IsCompact mode.
This commit is contained in:
Zhang Dian
2026-03-12 15:56:39 +08:00
committed by GitHub
parent d865f2aeb4
commit dd5f5182fa
3 changed files with 168 additions and 222 deletions

View File

@@ -12,8 +12,8 @@
<StackPanel Spacing="16">
<HeaderedContentControl Theme="{StaticResource GroupBox}">
<HeaderedContentControl.Header>
<StackPanel>
<TextBlock Text="CommandBar — Label Position" />
<StackPanel HorizontalAlignment="Left">
<TextBlock Text="CommandBar — Dynamic Overflow" />
<ComboBox
Name="lc"
ItemsSource="{DynamicResource LabelPositionList}"
@@ -26,9 +26,14 @@
</collections:AvaloniaList>
</ComboBox.Resources>
</ComboBox>
<ToggleSwitch Name="idfe" IsChecked="True" />
<Slider Name="ws" Width="500" Minimum="0" Maximum="1000" Value="200" />
</StackPanel>
</HeaderedContentControl.Header>
<CommandBar DefaultLabelPosition="{Binding #lc.SelectedValue}">
<CommandBar
IsDynamicOverflowEnabled="{Binding #idfe.IsChecked}"
Width="{Binding #ws.Value}"
DefaultLabelPosition="{Binding #lc.SelectedValue}">
<AppBarButton Label="New" Icon="{DynamicResource SemiIconPlus}" />
<AppBarButton Label="Save" Icon="{DynamicResource SemiIconSave}" />
<AppBarSeparator />
@@ -59,25 +64,6 @@
</CommandBar>
</HeaderedContentControl>
<HeaderedContentControl Theme="{StaticResource GroupBox}">
<HeaderedContentControl.Header>
<StackPanel HorizontalAlignment="Left">
<TextBlock Text="CommandBar — Dynamic Overflow" />
<ToggleSwitch Name="idfe" IsChecked="True" />
<Slider Name="ws" Width="500" Minimum="0" Maximum="500" Value="100" />
</StackPanel>
</HeaderedContentControl.Header>
<CommandBar
IsDynamicOverflowEnabled="{Binding #idfe.IsChecked}"
Width="{Binding #ws.Value}">
<AppBarButton Label="New" Icon="{DynamicResource SemiIconPlus}" />
<AppBarButton Label="Save" Icon="{DynamicResource SemiIconSave}" />
<AppBarButton Label="Share" Icon="{DynamicResource SemiIconShare}" />
<AppBarButton Label="Export" Icon="{DynamicResource SemiIconExport}" />
<AppBarButton Label="Delete" Icon="{DynamicResource SemiIconDelete}" />
</CommandBar>
</HeaderedContentControl>
</StackPanel>
</ScrollViewer>
</UserControl>