zhaoyushun1999/Semi.Avalonia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update pointerover, pressed and disabled style.

Browse Source
This commit is contained in:
rabbitism 2023-01-24 12:29:29 +08:00
parent 12c75c1573
commit 0f42087314
3 changed files with 44 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
demo/Semi.Avalonia.Demo/Pages/MenuDemo.axaml
View File

@ -27,10 +27,7 @@
</MenuItem>
<MenuItem Header="Menu Item with _Checkbox">
<MenuItem.Icon>
<CheckBox
BorderThickness="0"
IsChecked="True"
IsHitTestVisible="False" />
<TextBlock>😊</TextBlock>
</MenuItem.Icon>
</MenuItem>
</MenuItem>

80
src/Semi.Avalonia/Controls/Menu.axaml
View File

@ -107,11 +107,11 @@
</ControlTheme>
<ControlTheme x:Key="{x:Type MenuItem}" TargetType="MenuItem">
<Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackground}" />
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForeground}" />
<Setter Property="Background" Value="{DynamicResource MenuItemBackground}" />
<Setter Property="Foreground" Value="{DynamicResource MenuItemForeground}" />
<Setter Property="MenuItem.Cursor" Value="Hand" />
<!-- Narrow padding should be used for mouse input, when non-narrow one should be used for touch input in future. -->
<Setter Property="Padding" Value="{DynamicResource MenuFlyoutItemThemePaddingNarrow}" />
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
<Setter Property="Padding" Value="{DynamicResource MenuItemPadding}" />
<Setter Property="Template">
<ControlTemplate>
<Panel>
@ -132,12 +132,13 @@
<Viewbox
Name="PART_IconPresenter"
Width="16"
Height="16"
Margin="{DynamicResource MenuIconPresenterMargin}"
Width="12"
Height="12"
Margin="{DynamicResource MenuItemIconMargin}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
IsVisible="False"
Stretch="UniformToFill"
StretchDirection="DownOnly">
<ContentPresenter Content="{TemplateBinding Icon}" />
</Viewbox>
@ -152,23 +153,21 @@
<TextBlock
x:Name="PART_InputGestureText"
Grid.Column="2"
Margin="{DynamicResource MenuInputGestureTextMargin}"
Margin="{DynamicResource MenuItemInputGestureTextMargin}"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Classes="CaptionTextBlockStyle"
Foreground="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForeground}"
Foreground="{DynamicResource MenuItemInputGestureTextForeground}"
Text="{TemplateBinding InputGesture,
Converter={StaticResource KeyGestureConverter}}" />
<Path
Name="PART_ChevronPath"
<PathIcon
Name="PART_ExpandIcon"
Grid.Column="3"
Width="8"
Height="16"
Margin="{DynamicResource MenuFlyoutItemChevronMargin}"
Height="8"
Margin="{DynamicResource MenuItemExpandIconMargin}"
VerticalAlignment="Center"
Data="{DynamicResource MenuItemChevronPathData}"
Fill="{DynamicResource MenuFlyoutSubItemChevron}"
Stretch="Uniform" />
Data="{DynamicResource MenuItemExpandIconGlyph}"
Foreground="{DynamicResource MenuItemExpandIconForeground}" />
</Grid>
</Border>
<Popup
@ -213,53 +212,32 @@
<Style Selector="^:selected">
<Style Selector="^ /template/ Border#PART_LayoutRoot">
<Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPointerOver}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPointerOver}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_InputGestureText">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundPointerOver}" />
</Style>
<Style Selector="^ /template/ Path#PART_ChevronPath">
<Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronPointerOver}" />
<Setter Property="Background" Value="{DynamicResource MenuItemPointeroverBackground}" />
</Style>
</Style>
<!-- Listen for PART_LayoutRoot:pointerover, so it will not be triggered when subitem is pressed -->
<Style Selector="^:pressed /template/ Border#PART_LayoutRoot:pointerover">
<Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundPressed}" />
<Style Selector="^ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundPressed}" />
</Style>
<Style Selector="^ TextBlock#PART_InputGestureText">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundPressed}" />
</Style>
<Style Selector="^ Path#PART_ChevronPath">
<Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronPressed}" />
</Style>
<Setter Property="Background" Value="{DynamicResource MenuItemPressedBackground}" />
</Style>
<Style Selector="^:disabled">
<Style Selector="^ /template/ Border#PART_LayoutRoot">
<Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundDisabled}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundDisabled}" />
<Setter Property="Foreground" Value="{DynamicResource MenuItemDisabledForeground}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_InputGestureText">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemKeyboardAcceleratorTextForegroundDisabled}" />
<Setter Property="Foreground" Value="{DynamicResource MenuItemDisabledInputGestureTextForeground}" />
</Style>
<Style Selector="^ /template/ Path#PART_ChevronPath">
<Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronDisabled}" />
<Style Selector="^ /template/ PathIcon#PART_ExpandIcon">
<Setter Property="Foreground" Value="{DynamicResource MenuItemDisabledExpandIconForeground}" />
</Style>
</Style>
<Style Selector="^:open /template/ Path#PART_ChevronPath">
<Setter Property="Fill" Value="{DynamicResource MenuFlyoutSubItemChevronSubMenuOpened}" />
<Style Selector="^:open /template/ PathIcon#PART_ExpandIcon">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutSubItemChevronSubMenuOpened}" />
</Style>
<Style Selector="^:empty /template/ Path#PART_ChevronPath">
<Style Selector="^:empty /template/ PathIcon#PART_ExpandIcon">
<Setter Property="IsVisible" Value="False" />
</Style>
@ -275,8 +253,9 @@
<ControlTheme x:Key="TopLevelMenuItem" TargetType="MenuItem">
<Setter Property="Background" Value="{DynamicResource MenuItemBackground}" />
<Setter Property="Foreground" Value="{DynamicResource MenuItemForeground}" />
<Setter Property="MenuItem.Cursor" Value="Hand" />
<!-- Narrow padding should be used for mouse input, when non-narrow one should be used for touch input in future. -->
<Setter Property="Padding" Value="{DynamicResource MenuItemTopLevelPadding}" />
<Setter Property="Padding" Value="{DynamicResource MenuItemPadding}" />
<Setter Property="Template">
<ControlTemplate>
<Border
@ -341,11 +320,8 @@
</Style>
<Style Selector="^:disabled">
<Style Selector="^ /template/ Border#PART_LayoutRoot">
<Setter Property="Background" Value="{DynamicResource MenuFlyoutItemBackgroundDisabled}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource MenuFlyoutItemForegroundDisabled}" />
<Setter Property="Foreground" Value="{DynamicResource MenuItemDisabledForeground}" />
</Style>
</Style>
</ControlTheme>

17
src/Semi.Avalonia/Themes/Light/Menu.axaml
View File

@ -6,6 +6,7 @@
<PathGeometry x:Key="MenuScrollViewerUpButtonGlyph">M19.637 16.4369C19.0513 17.0227 18.1015 17.0227 17.5157 16.4369L11.8589 10.7801L6.20202 16.4369C5.61623 17.0227 4.66648 17.0227 4.0807 16.4369C3.49491 15.8511 3.49491 14.9014 4.0807 14.3156L10.7982 7.59809C11.384 7.01231 12.3337 7.01231 12.9195 7.59809L19.637 14.3156C20.2228 14.9014 20.2228 15.8511 19.637 16.4369Z</PathGeometry>
<PathGeometry x:Key="MenuScrollViewerDownButtonGlyph">M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z</PathGeometry>
<PathGeometry x:Key="MenuItemExpandIconGlyph">M7.43934 19.7957C6.85355 19.2099 6.85355 18.2601 7.43934 17.6744L13.0962 12.0175L7.43934 6.36065C6.85355 5.77486 6.85355 4.82511 7.43934 4.23933C8.02513 3.65354 8.97487 3.65354 9.56066 4.23933L16.2782 10.9568C16.864 11.5426 16.864 12.4924 16.2782 13.0782L9.56066 19.7957C8.97487 20.3815 8.02513 20.3815 7.43934 19.7957Z</PathGeometry>
<SolidColorBrush x:Key="MenuFlyoutScrollViewerIconForeground" Opacity="0.62" Color="#1C1F23" />
<!-- MenuFlyout -->
@ -21,13 +22,25 @@
<sys:Double x:Key="MenuFlyoutMaxWidth">600</sys:Double>
<!-- MenuItem -->
<SolidColorBrush x:Key="MenuItemBackground" Color="Transparent" />
<SolidColorBrush x:Key="MenuItemBackground" Color="White" />
<SolidColorBrush x:Key="MenuItemForeground" Color="#1C1F23" />
<Thickness x:Key="MenuItemTopLevelPadding">8 4</Thickness>
<Thickness x:Key="MenuItemPadding">8 4</Thickness>
<SolidColorBrush x:Key="MenuItemSeparatorBackground" Opacity="0.08" Color="#1C1F23" />
<sys:Double x:Key="MenuItemSeparatorHeight">1</sys:Double>
<Thickness x:Key="MenuItemSeparatorMargin">2</Thickness>
<SolidColorBrush x:Key="MenuItemPointeroverBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="MenuItemPressedBackground" Opacity="0.09" Color="#2E3238" />
<Thickness x:Key="MenuItemIconMargin">0 0 12 0</Thickness>
<Thickness x:Key="MenuItemInputGestureTextMargin">4 0</Thickness>
<SolidColorBrush x:Key="MenuItemInputGestureTextForeground" Color="Gray" />
<SolidColorBrush x:Key="MenuItemExpandIconForeground" Opacity="0.62" Color="#1C1F23" />
<Thickness x:Key="MenuItemExpandIconMargin">4 0</Thickness>
<SolidColorBrush x:Key="MenuItemDisabledForeground" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="MenuItemDisabledInputGestureTextForeground" Opacity="0.2" Color="#1C1F23" />
<SolidColorBrush x:Key="MenuItemDisabledExpandIconForeground" Opacity="0.35" Color="#1C1F23" />
</ResourceDictionary>