tsai
/
Avalonia
mirror of https://github.com/AvaloniaUI/Avalonia.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

fluent 2 - fix commandbar style

pull/21771/head
Emmanuel Hansen 3 weeks ago
parent
6a7ed6a8ea
commit
b19f073b27
3 changed files with 570 additions and 251 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 9
      samples/ControlCatalog/Pages/CommandBar/CommandBarFirstLookPage.xaml
  2. 118
      src/Avalonia.Themes.Fluent2/Accents/FluentControlResources.xaml
  3. 694
      src/Avalonia.Themes.Fluent2/Controls/CommandBar.xaml

9
samples/ControlCatalog/Pages/CommandBar/CommandBarFirstLookPage.xaml
View File

@ -19,25 +19,25 @@
Foreground="{DynamicResource SystemControlHighlightAccentBrush}" /> Foreground="{DynamicResource SystemControlHighlightAccentBrush}" />
<TextBlock Text="Primary Commands" FontWeight="SemiBold" /> <TextBlock Text="Primary Commands" FontWeight="SemiBold" />
<TextBlock Text="Buttons displayed directly in the bar: New, Save, Bold, Italic, Share." <TextBlock Text="Buttons displayed directly in the bar: New, Save, Bold, Italic, Share."
FontSize="12" Opacity="0.7" TextWrapping="Wrap" /> Opacity="0.7" TextWrapping="Wrap" />
<Separator /> <Separator />
<TextBlock Text="Secondary Commands" FontWeight="SemiBold" /> <TextBlock Text="Secondary Commands" FontWeight="SemiBold" />
<TextBlock Text="Buttons in the overflow menu (three-dot icon): Export, Print, Delete." <TextBlock Text="Buttons in the overflow menu (three-dot icon): Export, Print, Delete."
FontSize="12" Opacity="0.7" TextWrapping="Wrap" /> Opacity="0.7" TextWrapping="Wrap" />
<Separator /> <Separator />
<TextBlock Text="Content Area" FontWeight="SemiBold" /> <TextBlock Text="Content Area" FontWeight="SemiBold" />
<TextBlock Text="Custom content (e.g. 'Document Editor' text) displayed on the left side of the bar." <TextBlock Text="Custom content (e.g. 'Document Editor' text) displayed on the left side of the bar."
FontSize="12" Opacity="0.7" TextWrapping="Wrap" /> Opacity="0.7" TextWrapping="Wrap" />
<Separator /> <Separator />
<TextBlock Text="Separators" FontWeight="SemiBold" /> <TextBlock Text="Separators" FontWeight="SemiBold" />
<TextBlock Text="CommandBarSeparator creates visual dividers between command groups." <TextBlock Text="CommandBarSeparator creates visual dividers between command groups."
FontSize="12" Opacity="0.7" TextWrapping="Wrap" /> Opacity="0.7" TextWrapping="Wrap" />
</StackPanel> </StackPanel>
</ScrollViewer> </ScrollViewer>
@ -86,7 +86,6 @@
<TextBlock x:Name="StatusText" <TextBlock x:Name="StatusText"
Text="Ready" Text="Ready"
FontSize="13"
Opacity="0.7" /> Opacity="0.7" />
</StackPanel> </StackPanel>
</ScrollViewer> </ScrollViewer>

118
src/Avalonia.Themes.Fluent2/Accents/FluentControlResources.xaml
View File

@ -117,6 +117,65 @@
<StaticResource x:Key="HyperlinkButtonBorderBrushPressed" ResourceKey="SubtleFillColorTransparentBrush" /> <StaticResource x:Key="HyperlinkButtonBorderBrushPressed" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="HyperlinkButtonBorderBrushDisabled" ResourceKey="SubtleFillColorTransparentBrush" /> <StaticResource x:Key="HyperlinkButtonBorderBrushDisabled" ResourceKey="SubtleFillColorTransparentBrush" />
<!-- Resources for CommandBar.xaml -->
<StaticResource x:Key="CommandBarButtonBackground" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBackgroundPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarButtonBackgroundPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarButtonBackgroundDisabled" ResourceKey="SubtleFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarButtonForeground" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarButtonForegroundPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarButtonForegroundPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarButtonForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrush" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrushPointerOver" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrushPressed" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrushDisabled" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackground" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundDisabled" ResourceKey="SubtleFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundChecked" ResourceKey="AccentFillColorDefaultBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundCheckedPointerOver" ResourceKey="AccentFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundCheckedPressed" ResourceKey="AccentFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundCheckedDisabled" ResourceKey="AccentFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonForeground" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundChecked" ResourceKey="TextOnAccentFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundCheckedPointerOver" ResourceKey="TextOnAccentFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundCheckedPressed" ResourceKey="TextOnAccentFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundCheckedDisabled" ResourceKey="TextOnAccentFillColorDisabled" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrush" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushPointerOver" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushPressed" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushDisabled" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushChecked" ResourceKey="AccentControlElevationBorderBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushCheckedPointerOver" ResourceKey="AccentControlElevationBorderBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushCheckedPressed" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushCheckedDisabled" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlay" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayCheckedPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayCheckedPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundCheckedPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundCheckedPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundCheckedDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandSeparatorForeground" ResourceKey="DividerStrokeColorDefaultBrush" />
<StaticResource x:Key="CommandBarBackground" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarBackgroundOpen" ResourceKey="AcrylicInAppFillColorDefaultBrush" />
<StaticResource x:Key="CommandBarBorderBrushOpen" ResourceKey="CardStrokeColorDefaultSolidBrush" />
<StaticResource x:Key="CommandBarForeground" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarHighContrastBorder" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarEllipsisIconForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarOverflowPresenterBackground" ResourceKey="AcrylicInAppFillColorDefaultBrush" />
<StaticResource x:Key="CommandBarOverflowPresenterBorderBrush" ResourceKey="SystemControlTransientBorderBrush" />
<StaticResource x:Key="CommandBarLightDismissOverlayBackground" ResourceKey="SystemControlPageBackgroundMediumAltMediumBrush" />
<!-- Resources for ComboBox.xaml --> <!-- Resources for ComboBox.xaml -->
<x:Double x:Key="ComboBoxThemeMinWidth">64</x:Double> <x:Double x:Key="ComboBoxThemeMinWidth">64</x:Double>
<Thickness x:Key="ComboBoxBorderThemeThickness">1</Thickness> <Thickness x:Key="ComboBoxBorderThemeThickness">1</Thickness>
@ -835,6 +894,65 @@
<StaticResource x:Key="GroupBoxBorderBrush" ResourceKey="SystemControlForegroundBaseMediumBrush" /> <StaticResource x:Key="GroupBoxBorderBrush" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="GroupBoxHeaderForeground" ResourceKey="SystemBaseHighColor" /> <StaticResource x:Key="GroupBoxHeaderForeground" ResourceKey="SystemBaseHighColor" />
<!-- Resources for CommandBar.xaml -->
<StaticResource x:Key="CommandBarButtonBackground" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBackgroundPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarButtonBackgroundPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarButtonBackgroundDisabled" ResourceKey="SubtleFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarButtonForeground" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarButtonForegroundPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarButtonForegroundPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarButtonForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrush" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrushPointerOver" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrushPressed" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarButtonBorderBrushDisabled" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackground" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundDisabled" ResourceKey="SubtleFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundChecked" ResourceKey="AccentFillColorDefaultBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundCheckedPointerOver" ResourceKey="AccentFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundCheckedPressed" ResourceKey="AccentFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundCheckedDisabled" ResourceKey="AccentFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonForeground" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundChecked" ResourceKey="TextOnAccentFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundCheckedPointerOver" ResourceKey="TextOnAccentFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundCheckedPressed" ResourceKey="TextOnAccentFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonForegroundCheckedDisabled" ResourceKey="TextOnAccentFillColorDisabled" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrush" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushPointerOver" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushPressed" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushDisabled" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushChecked" ResourceKey="AccentControlElevationBorderBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushCheckedPointerOver" ResourceKey="AccentControlElevationBorderBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushCheckedPressed" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBorderBrushCheckedDisabled" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlay" ResourceKey="SubtleFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayCheckedPointerOver" ResourceKey="SubtleFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonBackgroundHighLightOverlayCheckedPressed" ResourceKey="SubtleFillColorTertiaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundCheckedPointerOver" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundCheckedPressed" ResourceKey="TextFillColorSecondaryBrush" />
<StaticResource x:Key="CommandBarToggleButtonOverflowLabelForegroundCheckedDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandSeparatorForeground" ResourceKey="DividerStrokeColorDefaultBrush" />
<StaticResource x:Key="CommandBarBackground" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarBackgroundOpen" ResourceKey="AcrylicInAppFillColorDefaultBrush" />
<StaticResource x:Key="CommandBarBorderBrushOpen" ResourceKey="CardStrokeColorDefaultSolidBrush" />
<StaticResource x:Key="CommandBarForeground" ResourceKey="TextFillColorPrimaryBrush" />
<StaticResource x:Key="CommandBarHighContrastBorder" ResourceKey="ControlFillColorTransparentBrush" />
<StaticResource x:Key="CommandBarEllipsisIconForegroundDisabled" ResourceKey="TextFillColorDisabledBrush" />
<StaticResource x:Key="CommandBarOverflowPresenterBackground" ResourceKey="AcrylicInAppFillColorDefaultBrush" />
<StaticResource x:Key="CommandBarOverflowPresenterBorderBrush" ResourceKey="SystemControlTransientBorderBrush" />
<StaticResource x:Key="CommandBarLightDismissOverlayBackground" ResourceKey="SystemControlPageBackgroundMediumAltMediumBrush" />
<!-- Resources for HyperlinkButton.xaml --> <!-- Resources for HyperlinkButton.xaml -->
<Color x:Key="HyperlinkVisitedColor">#FFC58AF9</Color> <Color x:Key="HyperlinkVisitedColor">#FFC58AF9</Color>
<SolidColorBrush x:Key="HyperlinkVisitedBrush" Color="{StaticResource HyperlinkVisitedColor}" /> <SolidColorBrush x:Key="HyperlinkVisitedBrush" Color="{StaticResource HyperlinkVisitedColor}" />

694
src/Avalonia.Themes.Fluent2/Controls/CommandBar.xaml
View File

@ -26,26 +26,64 @@
</Border> </Border>
</Design.PreviewWith> </Design.PreviewWith>
<x:Double x:Key="CommandBarExpandButtonThemeWidth">48</x:Double>
<Thickness x:Key="CommandBarEllipsisButtonInnerBorderMargin">2,6,6,6</Thickness>
<Thickness x:Key="CommandBarInnerBorderMargin">2,6,2,6</Thickness>
<Thickness x:Key="CommandBarButtonInnerBorderCompactMargin">2,6,2,22</Thickness>
<Thickness x:Key="CommandBarButtonContentViewboxMargin">12,16,0,10</Thickness>
<Thickness x:Key="CommandBarButtonTextLabelOnRightMargin">8,16,12,10</Thickness>
<x:Double x:Key="CommandBarThemeMinHeight">64</x:Double>
<x:Double x:Key="CommandBarThemeCompactHeight">48</x:Double>
<x:Double x:Key="CommandButtonContentHeight">16</x:Double>
<Thickness x:Key="CommandButtonContentViewboxCollapsedMargin">0,16,0,2</Thickness>
<x:Double x:Key="CommandBarButtonLabelFontSize">12</x:Double>
<Thickness x:Key="CommandBarButtonTextLabelMargin">2,0,2,8</Thickness>
<Thickness x:Key="CommandBarButtonOverflowTextLabelPadding">0,5,0,8</Thickness>
<Thickness x:Key="CommandBarButtonInnerBorderOverflowMargin">4,0,4,0</Thickness>
<Thickness x:Key="CommandBarOverflowPresenterBorderPadding">0</Thickness>
<Thickness x:Key="CommandBarSeparatorMargin">2,8,2,8</Thickness>
<Thickness x:Key="CommandBarOverflowSeparatorMargin">0,4,0,4</Thickness>
<x:Double x:Key="CommandBarSeparatorWidth">1</x:Double>
<x:Double x:Key="CommandBarOverflowSeparatorHeight">1</x:Double>
<x:Double x:Key="CommandBarSeparatorCornerRadius">0.5</x:Double>
<Thickness x:Key="CommandBarBorderThicknessOpen">1</Thickness>
<x:Double x:Key="CommandBarOverflowMinWidth">160</x:Double>
<x:Double x:Key="CommandBarOverflowTouchMinWidth">240</x:Double>
<x:Double x:Key="CommandBarOverflowMaxWidth">480</x:Double>
<x:Double x:Key="CommandBarOverflowMaxHeight">198</x:Double>
<Thickness x:Key="CommandBarOverflowPresenterBorderThickness">1</Thickness>
<Thickness x:Key="CommandBarOverflowPresenterBorderDownThickness">0,0,0,1</Thickness>
<Thickness x:Key="CommandBarOverflowPresenterBorderUpThickness">0,1,0,0</Thickness>
<Thickness x:Key="CommandBarOverflowPresenterBorderDownPadding">0</Thickness>
<Thickness x:Key="CommandBarOverflowPresenterBorderUpPadding">0</Thickness>
<x:Double x:Key="CommandBarMoreButtonColumnMinWidth">6</x:Double>
<Thickness x:Key="CommandBarOverflowPresenterMargin">0,4,0,4</Thickness>
<Thickness x:Key="CommandBarOverflowButtonMargin">14,23,14,0</Thickness>
<!-- WinUI reference: CommandBar_themeresources.xaml, AppBarButton_themeresources.xaml (winui3/release/1.6.4), <!-- WinUI reference: CommandBar_themeresources.xaml, AppBarButton_themeresources.xaml (winui3/release/1.6.4),
AppBarToggleButton_themeresources.xaml, AppBarSeparator_themeresources.xaml (via Uno.UI.FluentTheme.v2). AppBarToggleButton_themeresources.xaml, AppBarSeparator_themeresources.xaml (via Uno.UI.FluentTheme.v2).
AppBar idiom: transparent bar (CommandBarBackground = ControlFillColorTransparent; the open state uses AppBar idiom: transparent bar (CommandBarBackground = ControlFillColorTransparent; the open state uses
AcrylicInAppFillColorDefault with a 1px CardStrokeColorDefaultSolid border), subtle-fill command pills AcrylicInAppFillColorDefault with a 1px CardStrokeColorDefaultSolid border), subtle-fill command pills
with ControlCornerRadius and an 83ms fill cross-fade, 16px icons (AppBarButtonContentHeight) with 12px with ControlCornerRadius and an 83ms fill cross-fade, 16px icons (AppBarButtonContentHeight) with 12px
labels, checked toggles on AccentFillColorDefault with TextOnAccent text, and 1px labels, checked toggles on AccentFillColorDefault with TextOnAccent text, and 1px
DividerStrokeColorDefault separators (AppBarSeparatorMargin 2,8). WinUI's default closed CommandBar has DividerStrokeColorDefault separators (AppBarSeparatorMargin 2,8). WinUI's default closed CommandBar has
no bottom divider, so none is drawn here. The v1 SystemControl* brush references were re-pointed to the no bottom divider, so none is drawn here. The v1 SystemControl* brush references were re-pointed to the
Fluent 2 tokens in this file; no shared-file keys are defined for these controls. --> Fluent 2 tokens in this file; no shared-file keys are defined for these controls. -->
<!-- CommandBar ellipsis (more) button: same subtle-fill treatment as AppBarButton. --> <!-- CommandBar ellipsis (more) button: same subtle-fill treatment as AppBarButton. -->
<ControlTheme x:Key="Fluent2CommandBarMoreButtonTheme" TargetType="Button"> <ControlTheme x:Key="Fluent2CommandBarEllipsisButtonTheme" TargetType="Button">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorTransparentBrush}" /> <Setter Property="Background" Value="{DynamicResource CommandBarButtonBackground}" />
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrush}" />
<Setter Property="Padding" Value="0" />
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Stretch" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="BackgroundSizing" Value="InnerBorderEdge" /> <Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
<Setter Property="Foreground" Value="{DynamicResource TextFillColorPrimaryBrush}" />
<Setter Property="BorderBrush" Value="{DynamicResource ControlFillColorTransparentBrush}" />
<Setter Property="BorderThickness" Value="0" /> <Setter Property="BorderThickness" Value="0" />
<Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" /> <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
<Setter Property="HorizontalContentAlignment" Value="Center" /> <Setter Property="Width" Value="{DynamicResource CommandBarExpandButtonThemeWidth}" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<ContentPresenter x:Name="PART_ContentPresenter" <ContentPresenter x:Name="PART_ContentPresenter"
@ -57,11 +95,13 @@
Content="{TemplateBinding Content}" Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" ContentTemplate="{TemplateBinding ContentTemplate}"
Padding="{TemplateBinding Padding}" Padding="{TemplateBinding Padding}"
Margin="{StaticResource CommandBarEllipsisButtonInnerBorderMargin}"
TemplatedControl.IsTemplateFocusTarget="True"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"> VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}">
<ContentPresenter.Transitions> <ContentPresenter.Transitions>
<Transitions> <Transitions>
<BrushTransition Property="Background" Duration="0:0:0.083" /> <BrushTransition Property="Background" Duration="{DynamicResource ControlFasterAnimationDuration}" />
</Transitions> </Transitions>
</ContentPresenter.Transitions> </ContentPresenter.Transitions>
</ContentPresenter> </ContentPresenter>
@ -69,27 +109,39 @@
</Setter> </Setter>
<Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter"> <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorSecondaryBrush}" /> <Setter Property="Background" Value="{DynamicResource CommandBarButtonBackgroundPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrushPointerOver}" />
</Style>
<Style Selector="^:pointerover">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundPointerOver}" />
</Style> </Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter"> <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorTertiaryBrush}" /> <Setter Property="Background" Value="{DynamicResource CommandBarButtonBackgroundPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrushPressed}" />
</Style> </Style>
<Style Selector="^:pressed"> <Style Selector="^:pressed">
<Setter Property="Foreground" Value="{DynamicResource TextFillColorSecondaryBrush}" /> <Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundPressed}" />
</Style> </Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter"> <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorDisabledBrush}" /> <Setter Property="Background" Value="{DynamicResource CommandBarButtonBackgroundDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrushDisabled}" />
</Style> </Style>
<Style Selector="^:disabled"> <Style Selector="^:disabled">
<Setter Property="Foreground" Value="{DynamicResource TextFillColorDisabledBrush}" /> <Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundDisabled}" />
</Style> </Style>
</ControlTheme> </ControlTheme>
<ControlTheme x:Key="CommandButtonOverflowStyle" TargetType="CommandBarButton" BasedOn="{StaticResource DefaultFluentCommandBarButtonStyle}">
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="Width" Value="NaN" />
</ControlTheme>
<ControlTheme x:Key="{x:Type CommandBarButton}" TargetType="CommandBarButton" BasedOn="{StaticResource DefaultFluentCommandBarButtonStyle}"/>
<!-- CommandBarButton ControlTheme (WinUI DefaultAppBarButtonStyle) --> <!-- CommandBarButton ControlTheme (WinUI DefaultAppBarButtonStyle) -->
<ControlTheme x:Key="{x:Type CommandBarButton}" TargetType="CommandBarButton"> <ControlTheme x:Key="DefaultFluentCommandBarButtonStyle" TargetType="CommandBarButton">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorTransparentBrush}" /> <Setter Property="Background" Value="{DynamicResource CommandBarButtonBackground}" />
<Setter Property="Foreground" Value="{DynamicResource TextFillColorPrimaryBrush}" /> <Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ControlFillColorTransparentBrush}" /> <Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrush}" />
<Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
<Setter Property="BorderThickness" Value="0" /> <Setter Property="BorderThickness" Value="0" />
<Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" /> <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
<Setter Property="Padding" Value="8,4" /> <Setter Property="Padding" Value="8,4" />
@ -100,114 +152,153 @@
<Setter Property="VerticalContentAlignment" Value="Center" /> <Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Border x:Name="PART_Border" <Grid Name="RootGrid"
Background="{TemplateBinding Background}" Background="Transparent"
BackgroundSizing="InnerBorderEdge" MinWidth="{TemplateBinding MinWidth}"
BorderBrush="{TemplateBinding BorderBrush}" MaxWidth="{TemplateBinding MaxWidth}">
BorderThickness="{TemplateBinding BorderThickness}" <Border Name="PART_Border"
CornerRadius="{TemplateBinding CornerRadius}" Margin="{DynamicResource CommandBarInnerBorderMargin}"
Padding="{TemplateBinding Padding}"> Background="{TemplateBinding Background}"
<Border.Transitions> BorderBrush="{TemplateBinding BorderBrush}"
<Transitions> BorderThickness="{TemplateBinding BorderThickness}"
<BrushTransition Property="Background" Duration="0:0:0.083" /> CornerRadius="{TemplateBinding CornerRadius}"
</Transitions> BackgroundSizing="{TemplateBinding BackgroundSizing}">
</Border.Transitions> <Border.Transitions>
<StackPanel x:Name="PART_LayoutRoot" <Transitions>
Spacing="4" <BrushTransition Property="Background" Duration="{DynamicResource ControlFasterAnimationDuration}" />
HorizontalAlignment="Center" </Transitions>
VerticalAlignment="Center"> </Border.Transitions>
<ContentPresenter x:Name="PART_IconPresenter" </Border>
Content="{TemplateBinding Icon}" <Grid Name="LayoutGrid"
Foreground="{TemplateBinding Foreground}" MinHeight="{DynamicResource CommandBarThemeMinHeight}">
Width="16" <StackPanel Name="PART_LayoutRoot"
Height="16" Orientation="Vertical"
HorizontalAlignment="Center" /> VerticalAlignment="Center"
<TextBlock x:Name="PART_Label" Spacing="6">
Text="{TemplateBinding Label}" <Viewbox Name="ContentViewbox"
Foreground="{TemplateBinding Foreground}" Height="{DynamicResource CommandButtonContentHeight}"
FontSize="12" HorizontalAlignment="Stretch">
HorizontalAlignment="Center" <ContentPresenter Name="PART_IconPresenter"
TextTrimming="CharacterEllipsis" /> Content="{TemplateBinding Icon}"
</StackPanel> Foreground="{TemplateBinding Foreground}" />
</Border> </Viewbox>
<TextBlock Name="PART_Label"
Text="{TemplateBinding Label}"
Foreground="{TemplateBinding Foreground}"
FontSize="{DynamicResource CommandBarButtonLabelFontSize}"
FontFamily="{TemplateBinding FontFamily}"
TextAlignment="Center"
TextWrapping="Wrap"
TextTrimming="CharacterEllipsis" />
</StackPanel>
</Grid>
</Grid>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<!-- Hover --> <!-- Hover -->
<Style Selector="^:pointerover /template/ Border#PART_Border"> <Style Selector="^:pointerover">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorSecondaryBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarButtonBackgroundPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrushPointerOver}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundPointerOver}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundPointerOver}" />
</Style>
</Style> </Style>
<!-- Pressed --> <!-- Pressed -->
<Style Selector="^:pressed /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorTertiaryBrush}" />
</Style>
<Style Selector="^:pressed"> <Style Selector="^:pressed">
<Setter Property="Foreground" Value="{DynamicResource TextFillColorSecondaryBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarButtonBackgroundPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrushPressed}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundPressed}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundPressed}" />
</Style>
</Style> </Style>
<!-- Disabled --> <!-- Disabled -->
<Style Selector="^:disabled /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorDisabledBrush}" />
</Style>
<Style Selector="^:disabled"> <Style Selector="^:disabled">
<Setter Property="Foreground" Value="{DynamicResource TextFillColorDisabledBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarButtonBackgroundDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarButtonBorderBrushDisabled}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundDisabled}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarButtonForegroundDisabled}" />
</Style>
</Style> </Style>
<!-- Compact: hide label, reduce width --> <!-- Compact: hide label -->
<Style Selector="^[IsCompact=True]"> <Style Selector="^[IsCompact=True]">
<Setter Property="Width" Value="40" /> <Style Selector="^ /template/ Border#PART_Border">
</Style> <Setter Property="Margin" Value="{DynamicResource CommandBarButtonInnerBorderCompactMargin}" />
<Style Selector="^[IsCompact=True] /template/ TextBlock#PART_Label"> </Style>
<Setter Property="IsVisible" Value="False" /> <Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="IsVisible" Value="False" />
</Style>
</Style> </Style>
<!-- LabelPosition=Right: horizontal layout, auto-width --> <!-- LabelPosition=Right: horizontal layout, auto-width -->
<Style Selector="^[LabelPosition=Right]"> <Style Selector="^[LabelPosition=Right]">
<Setter Property="Width" Value="NaN" /> <Style Selector="^ /template/ StackPanel#PART_LayoutRoot">
<Setter Property="MinWidth" Value="40" /> <Setter Property="Orientation" Value="Horizontal"/>
</Style> <Setter Property="Spacing" Value="12"/>
<Style Selector="^[LabelPosition=Right] /template/ StackPanel#PART_LayoutRoot"> </Style>
<Setter Property="Orientation" Value="Horizontal" /> <Style Selector="^ /template/ Grid#LayoutGrid">
</Style> <Setter Property="MinHeight" Value="{DynamicResource CommandBarThemeCompactHeight}" />
<Style Selector="^[LabelPosition=Right] /template/ ContentPresenter#PART_IconPresenter"> </Style>
<Setter Property="VerticalAlignment" Value="Center" /> <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
</Style> <Setter Property="VerticalAlignment" Value="Center" />
<Style Selector="^[LabelPosition=Right] /template/ TextBlock#PART_Label"> </Style>
<Setter Property="VerticalAlignment" Value="Center" /> <Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="TextAlignment" Value="Left" />
</Style>
</Style> </Style>
<!-- IsInOverflow: full-width horizontal layout --> <!-- IsInOverflow: full-width horizontal layout -->
<Style Selector="^[IsInOverflow=True]"> <Style Selector="^[IsInOverflow=True]">
<Setter Property="HorizontalAlignment" Value="Stretch" /> <Style Selector="^ /template/ Grid#LayoutGrid">
<Setter Property="HorizontalContentAlignment" Value="Left" /> <Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="Width" Value="NaN" /> <Setter Property="MinHeight" Value="0" />
<Setter Property="MinHeight" Value="36" /> </Style>
</Style>
<Style Selector="^[IsInOverflow=True] /template/ StackPanel#PART_LayoutRoot"> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="Margin" Value="{DynamicResource CommandBarButtonInnerBorderOverflowMargin}" />
<Setter Property="Orientation" Value="Horizontal" /> </Style>
<Setter Property="Spacing" Value="0" />
</Style> <Style Selector="^ /template/ Viewbox#ContentViewbox">
<Style Selector="^[IsInOverflow=True] /template/ ContentPresenter#PART_IconPresenter"> <Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="Width" Value="16" /> <Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="Height" Value="16" /> <Setter Property="Width" Value="16" />
<Setter Property="Margin" Value="4,0,10,0" /> <Setter Property="Height" Value="16" />
<Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="Margin" Value="12,0,0,0" />
<Setter Property="VerticalAlignment" Value="Center" /> </Style>
</Style>
<Style Selector="^[IsInOverflow=True] /template/ TextBlock#PART_Label">
<Setter Property="IsVisible" Value="True" />
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style> </Style>
</ControlTheme> </ControlTheme>
<ControlTheme x:Key="CommandToggleButtonOverflowStyle" TargetType="CommandBarToggleButton" BasedOn="{StaticResource DefaultCommandBarToggleButtonStyle}">
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="Width" Value="NaN" />
</ControlTheme>
<ControlTheme x:Key="{x:Type CommandBarToggleButton}" TargetType="CommandBarToggleButton" BasedOn="{StaticResource DefaultCommandBarToggleButtonStyle}"/>
<!-- CommandBarToggleButton ControlTheme (WinUI DefaultAppBarToggleButtonStyle) --> <!-- CommandBarToggleButton ControlTheme (WinUI DefaultAppBarToggleButtonStyle) -->
<ControlTheme x:Key="{x:Type CommandBarToggleButton}" TargetType="CommandBarToggleButton"> <ControlTheme x:Key="DefaultCommandBarToggleButtonStyle" TargetType="CommandBarToggleButton">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorTransparentBrush}" /> <Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackground}" />
<Setter Property="Foreground" Value="{DynamicResource TextFillColorPrimaryBrush}" /> <Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ControlFillColorTransparentBrush}" /> <Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrush}" />
<Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
<Setter Property="BorderThickness" Value="0" /> <Setter Property="BorderThickness" Value="0" />
<Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" /> <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
<Setter Property="Padding" Value="8,4" /> <Setter Property="Padding" Value="8,4" />
@ -218,173 +309,283 @@
<Setter Property="VerticalContentAlignment" Value="Center" /> <Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Border x:Name="PART_Border" <Grid Name="RootGrid"
Background="{TemplateBinding Background}" Background="Transparent"
BackgroundSizing="InnerBorderEdge" MinWidth="{TemplateBinding MinWidth}"
BorderBrush="{TemplateBinding BorderBrush}" MaxWidth="{TemplateBinding MaxWidth}">
BorderThickness="{TemplateBinding BorderThickness}" <Border Name="PART_Border"
CornerRadius="{TemplateBinding CornerRadius}" Margin="{DynamicResource CommandBarInnerBorderMargin}"
Padding="{TemplateBinding Padding}"> Background="{TemplateBinding Background}"
<Border.Transitions> BorderBrush="{TemplateBinding BorderBrush}"
<Transitions> BorderThickness="{TemplateBinding BorderThickness}"
<BrushTransition Property="Background" Duration="0:0:0.083" /> CornerRadius="{TemplateBinding CornerRadius}"
</Transitions> BackgroundSizing="{TemplateBinding BackgroundSizing}">
</Border.Transitions> <Border.Transitions>
<StackPanel x:Name="PART_LayoutRoot" <Transitions>
Spacing="4" <BrushTransition Property="Background" Duration="{DynamicResource ControlFasterAnimationDuration}" />
HorizontalAlignment="Center" </Transitions>
VerticalAlignment="Center"> </Border.Transitions>
<ContentPresenter x:Name="PART_IconPresenter" </Border>
Content="{TemplateBinding Icon}" <Grid Name="LayoutGrid"
Foreground="{TemplateBinding Foreground}" MinHeight="{DynamicResource CommandBarThemeMinHeight}">
Width="16" <StackPanel Name="PART_LayoutRoot"
Height="16" Orientation="Vertical"
HorizontalAlignment="Center" /> VerticalAlignment="Center"
<TextBlock x:Name="PART_Label" Spacing="6">
Text="{TemplateBinding Label}" <Viewbox Name="ContentViewbox"
Foreground="{TemplateBinding Foreground}" Height="{DynamicResource CommandButtonContentHeight}"
FontSize="12" HorizontalAlignment="Stretch">
HorizontalAlignment="Center" <ContentPresenter Name="PART_IconPresenter"
TextTrimming="CharacterEllipsis" /> Content="{TemplateBinding Icon}"
</StackPanel> Foreground="{TemplateBinding Foreground}" />
</Border> </Viewbox>
<TextBlock Name="PART_Label"
Text="{TemplateBinding Label}"
Foreground="{TemplateBinding Foreground}"
FontSize="{DynamicResource CommandBarButtonLabelFontSize}"
FontFamily="{TemplateBinding FontFamily}"
TextAlignment="Center"
TextWrapping="Wrap"
TextTrimming="CharacterEllipsis" />
</StackPanel>
</Grid>
</Grid>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<!-- Hover --> <!-- Hover -->
<Style Selector="^:pointerover /template/ Border#PART_Border"> <Style Selector="^:pointerover">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorSecondaryBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushPointerOver}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundPointerOver}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundPointerOver}" />
</Style>
</Style> </Style>
<!-- Pressed --> <!-- Pressed -->
<Style Selector="^:pressed /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorTertiaryBrush}" />
</Style>
<Style Selector="^:pressed"> <Style Selector="^:pressed">
<Setter Property="Foreground" Value="{DynamicResource TextFillColorSecondaryBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushPressed}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundPressed}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundPressed}" />
</Style>
</Style> </Style>
<!-- Disabled -->
<Style Selector="^:disabled /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource SubtleFillColorDisabledBrush}" />
</Style>
<Style Selector="^:disabled"> <Style Selector="^:disabled">
<Setter Property="Foreground" Value="{DynamicResource TextFillColorDisabledBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushDisabled}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundDisabled}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundDisabled}" />
</Style>
</Style> </Style>
<!-- Checked: accent fill with on-accent text, per AppBarToggleButton_themeresources --> <!-- Checked -->
<Style Selector="^:checked /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource AccentFillColorDefaultBrush}" />
</Style>
<Style Selector="^:checked"> <Style Selector="^:checked">
<Setter Property="Foreground" Value="{DynamicResource TextOnAccentFillColorPrimaryBrush}" /> <Style Selector="^ /template/ Border#PART_Border">
</Style> <Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundChecked}" />
<Style Selector="^:checked:pointerover /template/ Border#PART_Border"> <Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushChecked}" />
<Setter Property="Background" Value="{DynamicResource AccentFillColorSecondaryBrush}" /> </Style>
</Style> <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Style Selector="^:checked:pressed /template/ Border#PART_Border"> <Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundChecked}" />
<Setter Property="Background" Value="{DynamicResource AccentFillColorTertiaryBrush}" /> </Style>
</Style> <Style Selector="^ /template/ TextBlock#PART_Label">
<Style Selector="^:checked:pressed"> <Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundChecked}" />
<Setter Property="Foreground" Value="{DynamicResource TextOnAccentFillColorSecondaryBrush}" /> </Style>
</Style>
<Style Selector="^:checked:disabled /template/ Border#PART_Border"> <!-- Hover -->
<Setter Property="Background" Value="{DynamicResource AccentFillColorDisabledBrush}" /> <Style Selector="^:pointerover">
</Style> <Style Selector="^ /template/ Border#PART_Border">
<Style Selector="^:checked:disabled"> <Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundCheckedPointerOver}" />
<Setter Property="Foreground" Value="{DynamicResource TextOnAccentFillColorDisabledBrush}" /> <Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushCheckedPointerOver}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundCheckedPointerOver}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundCheckedPointerOver}" />
</Style>
</Style>
<!-- Pressed -->
<Style Selector="^:pressed">
<Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundCheckedPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushCheckedPressed}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundCheckedPressed}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundCheckedPressed}" />
</Style>
</Style>
<Style Selector="^:disabled">
<Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundCheckedDisabled}" />
<Setter Property="BorderBrush" Value="{DynamicResource CommandBarToggleButtonBorderBrushCheckedDisabled}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundCheckedDisabled}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonForegroundCheckedDisabled}" />
</Style>
</Style>
</Style> </Style>
<!-- Compact: hide label, reduce width --> <!-- Compact: hide label -->
<Style Selector="^[IsCompact=True]"> <Style Selector="^[IsCompact=True]">
<Setter Property="Width" Value="40" /> <Style Selector="^ /template/ Border#PART_Border">
</Style> <Setter Property="Margin" Value="{DynamicResource CommandBarToggleButtonInnerBorderCompactMargin}" />
<Style Selector="^[IsCompact=True] /template/ TextBlock#PART_Label"> </Style>
<Setter Property="IsVisible" Value="False" /> <Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="IsVisible" Value="False" />
</Style>
</Style> </Style>
<!-- LabelPosition=Right: horizontal layout, auto-width --> <!-- LabelPosition=Right: horizontal layout, auto-width -->
<Style Selector="^[LabelPosition=Right]"> <Style Selector="^[LabelPosition=Right]">
<Setter Property="Width" Value="NaN" /> <Style Selector="^ /template/ StackPanel#PART_LayoutRoot">
<Setter Property="MinWidth" Value="40" /> <Setter Property="Orientation" Value="Horizontal"/>
</Style> <Setter Property="Spacing" Value="12"/>
<Style Selector="^[LabelPosition=Right] /template/ StackPanel#PART_LayoutRoot"> </Style>
<Setter Property="Orientation" Value="Horizontal" /> <Style Selector="^ /template/ Grid#LayoutGrid">
</Style> <Setter Property="MinHeight" Value="{DynamicResource CommandBarThemeCompactHeight}" />
<Style Selector="^[LabelPosition=Right] /template/ ContentPresenter#PART_IconPresenter"> </Style>
<Setter Property="VerticalAlignment" Value="Center" /> <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
</Style> <Setter Property="VerticalAlignment" Value="Center" />
<Style Selector="^[LabelPosition=Right] /template/ TextBlock#PART_Label"> </Style>
<Setter Property="VerticalAlignment" Value="Center" /> <Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="TextAlignment" Value="Left" />
</Style>
</Style> </Style>
<!-- IsInOverflow: full-width horizontal layout --> <!-- IsInOverflow: full-width horizontal layout -->
<Style Selector="^[IsInOverflow=True]"> <Style Selector="^[IsInOverflow=True]">
<Setter Property="HorizontalAlignment" Value="Stretch" /> <Style Selector="^ /template/ Grid#LayoutGrid">
<Setter Property="HorizontalContentAlignment" Value="Left" /> <Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="Width" Value="NaN" /> <Setter Property="MinHeight" Value="0" />
<Setter Property="MinHeight" Value="36" /> </Style>
</Style>
<Style Selector="^[IsInOverflow=True] /template/ StackPanel#PART_LayoutRoot"> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="Margin" Value="{DynamicResource CommandBarToggleButtonInnerBorderOverflowMargin}" />
<Setter Property="Orientation" Value="Horizontal" /> </Style>
<Setter Property="Spacing" Value="0" />
</Style> <Style Selector="^ /template/ Viewbox#ContentViewbox">
<Style Selector="^[IsInOverflow=True] /template/ ContentPresenter#PART_IconPresenter"> <Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="Width" Value="16" /> <Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="Height" Value="16" /> <Setter Property="Width" Value="16" />
<Setter Property="Margin" Value="4,0,10,0" /> <Setter Property="Height" Value="16" />
<Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="Margin" Value="12,0,0,0" />
<Setter Property="VerticalAlignment" Value="Center" /> </Style>
</Style>
<Style Selector="^[IsInOverflow=True] /template/ TextBlock#PART_Label"> <Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="IsVisible" Value="True" /> <Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonOverflowLabelForegroundPointerOver}" />
<Setter Property="HorizontalAlignment" Value="Left" /> </Style>
<Setter Property="VerticalAlignment" Value="Center" />
<!-- Hover -->
<Style Selector="^:pointerover">
<Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundHighLightOverlayPointerOver}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonOverflowLabelForegroundPointerOver}" />
</Style>
</Style>
<!-- Pressed -->
<Style Selector="^:pressed">
<Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundHighLightOverlayPressed}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonOverflowLabelForegroundPressed}" />
</Style>
</Style>
<!-- Checked -->
<Style Selector="^:checked">
<!-- Hover -->
<Style Selector="^:pointerover">
<Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundHighLightOverlayCheckedPointerOver}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonOverflowLabelForegroundCheckedPointerOver}" />
</Style>
</Style>
<!-- Pressed -->
<Style Selector="^:pressed">
<Style Selector="^ /template/ Border#PART_Border">
<Setter Property="Background" Value="{DynamicResource CommandBarToggleButtonBackgroundHighLightOverlayCheckedPressed}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Label">
<Setter Property="Foreground" Value="{DynamicResource CommandBarToggleButtonOverflowLabelForegroundCheckedPressed}" />
</Style>
</Style>
</Style>
</Style> </Style>
</ControlTheme> </ControlTheme>
<!-- CommandBarSeparator ControlTheme (WinUI DefaultAppBarSeparatorStyle: <!-- CommandBarSeparator ControlTheme (WinUI DefaultAppBarSeparatorStyle:
1px DividerStrokeColorDefault, AppBarSeparatorMargin 2,8, corner radius 0.5) --> 1px DividerStrokeColorDefault, AppBarSeparatorMargin 2,8, corner radius 0.5) -->
<ControlTheme x:Key="{x:Type CommandBarSeparator}" TargetType="CommandBarSeparator"> <ControlTheme x:Key="{x:Type CommandBarSeparator}" TargetType="CommandBarSeparator">
<Setter Property="Width" Value="1" /> <Setter Property="Foreground" Value="{DynamicResource CommandSeparatorForeground}" />
<Setter Property="MinHeight" Value="24" /> <Setter Property="Padding" Value="{DynamicResource CommandBarSeparatorMargin}" />
<Setter Property="Margin" Value="2,8" /> <Setter Property="IsTabStop" Value="False" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Border Background="{DynamicResource DividerStrokeColorDefaultBrush}" <Rectangle Name="SeparatorRectangle"
CornerRadius="0.5" RadiusX="{StaticResource CommandBarSeparatorCornerRadius}"
Width="{TemplateBinding Width}" RadiusY="{StaticResource CommandBarSeparatorCornerRadius}"
Height="{TemplateBinding Height}" Width="{StaticResource CommandBarSeparatorWidth}"
MinHeight="{TemplateBinding MinHeight}" /> VerticalAlignment="Stretch"
Fill="{TemplateBinding Foreground}"
Margin="{TemplateBinding Padding}" />
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<!-- IsInOverflow: horizontal separator (AppBarOverflowSeparatorMargin 0,4) --> <!-- IsInOverflow -->
<Style Selector="^[IsInOverflow=True]"> <Style Selector="^[IsInOverflow=True] /template/ Rectangle#SeparatorRectangle">
<Setter Property="HorizontalAlignment" Value="Stretch" /> <Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="Width" Value="NaN" /> <Setter Property="Width" Value="NaN" />
<Setter Property="Height" Value="1" /> <Setter Property="Height" Value="{StaticResource CommandBarOverflowSeparatorHeight}" />
<Setter Property="MinHeight" Value="0" /> <Setter Property="Margin" Value="{StaticResource CommandBarOverflowSeparatorMargin}" />
<Setter Property="Margin" Value="0,4" />
</Style> </Style>
</ControlTheme> </ControlTheme>
<!-- CommandBar ControlTheme (WinUI XamlDefaultCommandBar) --> <!-- CommandBar ControlTheme (WinUI XamlDefaultCommandBar) -->
<ControlTheme x:Key="{x:Type CommandBar}" TargetType="CommandBar"> <ControlTheme x:Key="{x:Type CommandBar}" TargetType="CommandBar">
<Setter Property="HorizontalAlignment" Value="Stretch" /> <Setter Property="Background" Value="{DynamicResource CommandBarBackground}" />
<!-- CommandBarBackground = ControlFillColorTransparentBrush; the open state swaps to <Setter Property="Foreground" Value="{DynamicResource CommandBarForeground}" />
AcrylicInAppFillColorDefault with a CardStrokeColorDefaultSolid border (see IsOpen style). -->
<Setter Property="Background" Value="{DynamicResource ControlFillColorTransparentBrush}" />
<Setter Property="Foreground" Value="{DynamicResource TextFillColorPrimaryBrush}" />
<Setter Property="BorderBrush" Value="{DynamicResource ControlFillColorTransparentBrush}" /> <Setter Property="BorderBrush" Value="{DynamicResource ControlFillColorTransparentBrush}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" /> <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
<Setter Property="MinHeight" Value="48" /> <Setter Property="MinHeight" Value="{DynamicResource CommandBarThemeCompactHeight}" />
<Setter Property="Padding" Value="4,0" /> <Setter Property="Padding" Value="4,0" />
<Setter Property="ItemWidthBottom" Value="70" /> <Setter Property="ItemWidthBottom" Value="70" />
<Setter Property="ItemWidthRight" Value="102" /> <Setter Property="ItemWidthRight" Value="102" />
<Setter Property="ItemWidthCollapsed" Value="42" /> <Setter Property="ItemWidthCollapsed" Value="42" />
<Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<Border x:Name="LayoutRoot" <Border x:Name="LayoutRoot"
@ -395,25 +596,19 @@
CornerRadius="{TemplateBinding CornerRadius}" CornerRadius="{TemplateBinding CornerRadius}"
Padding="{TemplateBinding Padding}" Padding="{TemplateBinding Padding}"
MinHeight="{TemplateBinding MinHeight}"> MinHeight="{TemplateBinding MinHeight}">
<Border.Transitions>
<Transitions>
<BrushTransition Property="Background" Duration="0:0:0.083" />
<BrushTransition Property="BorderBrush" Duration="0:0:0.083" />
</Transitions>
</Border.Transitions>
<Panel> <Panel>
<DockPanel KeyboardNavigation.TabNavigation="Cycle"> <DockPanel KeyboardNavigation.TabNavigation="Cycle">
<!-- Overflow (more/ellipsis) button (docked right) --> <!-- Overflow (more/ellipsis) button (docked right) -->
<Button x:Name="PART_OverflowButton" <Button x:Name="PART_OverflowButton"
DockPanel.Dock="Right" DockPanel.Dock="Right"
Theme="{StaticResource Fluent2CommandBarMoreButtonTheme}" Foreground="{TemplateBinding Foreground}"
Margin="2,6" Theme="{DynamicResource Fluent2CommandBarEllipsisButtonTheme}"
Padding="12,0" MinHeight="{DynamicResource CommandBarThemeCompactHeight}"
MinWidth="40"
VerticalAlignment="Stretch" VerticalAlignment="Stretch"
FontSize="16"
IsVisible="{TemplateBinding IsOverflowButtonVisible}"> IsVisible="{TemplateBinding IsOverflowButtonVisible}">
<PathIcon Width="16" Height="16" <PathIcon Width="20"
Height="20"
VerticalAlignment="Center"
Data="M6,10A2,2 0 0,0 4,12A2,2 0 0,0 6,14A2,2 0 0,0 8,12A2,2 0 0,0 6,10M12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12A2,2 0 0,0 12,10M18,10A2,2 0 0,0 16,12A2,2 0 0,0 18,14A2,2 0 0,0 20,12A2,2 0 0,0 18,10Z" /> Data="M6,10A2,2 0 0,0 4,12A2,2 0 0,0 6,14A2,2 0 0,0 8,12A2,2 0 0,0 6,10M12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12A2,2 0 0,0 12,10M18,10A2,2 0 0,0 16,12A2,2 0 0,0 18,14A2,2 0 0,0 20,12A2,2 0 0,0 18,10Z" />
</Button> </Button>
@ -427,33 +622,40 @@
<ItemsControl x:Name="PART_PrimaryCommands" <ItemsControl x:Name="PART_PrimaryCommands"
ItemsSource="{Binding VisiblePrimaryCommands, RelativeSource={RelativeSource TemplatedParent}}" ItemsSource="{Binding VisiblePrimaryCommands, RelativeSource={RelativeSource TemplatedParent}}"
HorizontalAlignment="Right" HorizontalAlignment="Right"
MinHeight="{DynamicResource CommandBarThemeCompactHeight}"
VerticalAlignment="Stretch" VerticalAlignment="Stretch"
ClipToBounds="True"> ClipToBounds="True">
<ItemsControl.ItemsPanel> <ItemsControl.ItemsPanel>
<ItemsPanelTemplate> <ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" Spacing="2" /> <StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate> </ItemsPanelTemplate>
</ItemsControl.ItemsPanel> </ItemsControl.ItemsPanel>
</ItemsControl> </ItemsControl>
</DockPanel> </DockPanel>
<!-- Overflow popup (WinUI overflow presenter: AcrylicInAppFillColorDefault surface, <!-- Overflow popup (WinUI overflow presenter: AcrylicInAppFillColorDefault surface,
SurfaceStrokeColorFlyout 1px border, OverlayCornerRadius, min width 160) --> SurfaceStrokeColorFlyout 1px border, OverlayCornerRadius, min width 160) -->
<Popup x:Name="PART_OverflowPopup" <Popup x:Name="PART_OverflowPopup"
IsOpen="{TemplateBinding IsOpen, Mode=TwoWay}" IsOpen="{TemplateBinding IsOpen, Mode=TwoWay}"
PlacementTarget="{Binding #PART_OverflowButton}" PlacementTarget="{Binding #LayoutRoot}"
Placement="Bottom" Placement="BottomEdgeAlignedRight"
IsLightDismissEnabled="True" IsLightDismissEnabled="True"
WindowManagerAddShadowHint="True"> WindowManagerAddShadowHint="True">
<Border Background="{DynamicResource AcrylicInAppFillColorDefaultBrush}" <Border Background="{DynamicResource CommandBarOverflowPresenterBackground}"
BackgroundSizing="InnerBorderEdge" BackgroundSizing="InnerBorderEdge"
BorderBrush="{DynamicResource SurfaceStrokeColorFlyoutBrush}" BorderBrush="{DynamicResource CommandBarOverflowPresenterBorderBrush}"
BorderThickness="1" BorderThickness="{DynamicResource CommandBarOverflowPresenterBorderThickness}"
CornerRadius="{DynamicResource OverlayCornerRadius}" CornerRadius="{DynamicResource OverlayCornerRadius}"
Padding="4" Padding="{DynamicResource CommandBarOverflowPresenterBorderPadding}"
MinWidth="160"> MinWidth="{DynamicResource CommandBarOverflowMinWidth}"
MaxWidth="{DynamicResource CommandBarOverflowMaxWidth}">
<ItemsControl x:Name="PART_OverflowPresenter" <ItemsControl x:Name="PART_OverflowPresenter"
ItemContainerTheme="{DynamicResource CommandButtonOverflowStyle}"
ItemsSource="{Binding OverflowItems, RelativeSource={RelativeSource TemplatedParent}}"> ItemsSource="{Binding OverflowItems, RelativeSource={RelativeSource TemplatedParent}}">
<ItemsControl.Resources>
<ControlTheme x:Key="{x:Type CommandBarButton}" TargetType="CommandBarButton" BasedOn="{StaticResource CommandButtonOverflowStyle}"/>
<ControlTheme x:Key="{x:Type CommandBarToggleButton}" TargetType="CommandBarToggleButton" BasedOn="{StaticResource CommandToggleButtonOverflowStyle}"/>
</ItemsControl.Resources>
<ItemsControl.ItemsPanel> <ItemsControl.ItemsPanel>
<ItemsPanelTemplate> <ItemsPanelTemplate>
<StackPanel Spacing="2" /> <StackPanel Spacing="2" />
@ -468,7 +670,7 @@
</Setter> </Setter>
<!-- Open state: CommandBarBackgroundOpen / CommandBarBorderBrushOpen (thickness stays 1 to avoid <!-- Open state: CommandBarBackgroundOpen / CommandBarBorderBrushOpen (thickness stays 1 to avoid
a layout jump; the rest-state border is transparent). --> a layout jump; the rest-state border is transparent). -->
<Style Selector="^[IsOpen=True] /template/ Border#LayoutRoot"> <Style Selector="^[IsOpen=True] /template/ Border#LayoutRoot">
<Setter Property="Background" Value="{DynamicResource AcrylicInAppFillColorDefaultBrush}" /> <Setter Property="Background" Value="{DynamicResource AcrylicInAppFillColorDefaultBrush}" />
<Setter Property="BorderBrush" Value="{DynamicResource CardStrokeColorDefaultSolidBrush}" /> <Setter Property="BorderBrush" Value="{DynamicResource CardStrokeColorDefaultSolidBrush}" />

Write Preview
Loading…
Cancel
Save