feat: unified OverlayCloseButton.

This commit is contained in:
Zhang Dian
2025-01-08 21:42:20 +08:00
parent a00b0d2110
commit fa37a0763a
6 changed files with 36 additions and 100 deletions

View File

@@ -0,0 +1,4 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StaticResource x:Key="NotificationCloseButton" ResourceKey="OverlayCloseButton" />
<StaticResource x:Key="ToastCloseButton" ResourceKey="OverlayCloseButton" />
</ResourceDictionary>

View File

@@ -1,5 +1,6 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceInclude Source="/Compatibles/Icon.axaml" />
<ResourceInclude Source="/Compatibles/Theme.axaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

View File

@@ -59,7 +59,7 @@
Margin="{DynamicResource BannerCloseButtonMargin}"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Theme="{DynamicResource NotificationCloseButton}"
Theme="{DynamicResource OverlayCloseButton}"
IsVisible="{TemplateBinding CanClose}" />
</Grid>
</Border>

View File

@@ -1,28 +1,44 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Add Resources Here -->
<ControlTheme x:Key="CloseButton" TargetType="Button">
<Design.PreviewWith>
<StackPanel Orientation="Horizontal" Margin="20">
<Button Theme="{DynamicResource CloseButton}" />
<Button Theme="{DynamicResource OverlayCloseButton}" />
<Button Theme="{DynamicResource NotificationCloseButton}" />
<Button Theme="{DynamicResource ToastCloseButton}" />
</StackPanel>
</Design.PreviewWith>
<ControlTheme x:Key="OverlayCloseButton" TargetType="Button">
<Setter Property="CornerRadius" Value="6" />
<Setter Property="Margin" Value="0, 4" />
<Setter Property="Height" Value="24" />
<Setter Property="Width" Value="24" />
<Setter Property="Padding" Value="4" />
<Setter Property="Height" Value="28" />
<Setter Property="Width" Value="28" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="VerticalAlignment" Value="Stretch" />
<Setter Property="Template">
<ControlTemplate TargetType="Button">
<Border
Name="PART_Border"
Padding="{TemplateBinding Padding}"
Background="Transparent"
CornerRadius="{TemplateBinding CornerRadius}">
<PathIcon
Width="12"
Height="12"
Data="{DynamicResource WindowCloseIconGlyph}"/>
Foreground="{DynamicResource SemiColorText1}"
Theme="{StaticResource InnerPathIcon}"
Data="{DynamicResource SemiIconClose}" />
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^:pointerover /template/ Border">
<Setter Property="Background" Value="{DynamicResource SemiColorFill1}" />
</Style>
<Style Selector="^:pressed /template/ Border">
<Setter Property="Background" Value="{DynamicResource SemiColorFill2}" />
</Style>
</ControlTheme>
<ControlTheme
x:Key="CloseButton"
BasedOn="{StaticResource OverlayCloseButton}"
TargetType="Button">
<Style Selector="^:pointerover /template/ Border">
<Setter Property="Background" Value="{DynamicResource CaptionButtonClosePointeroverBackground}" />
</Style>
@@ -37,35 +53,5 @@
<Setter Property="Foreground" Value="White" />
</Style>
</ControlTheme>
<ControlTheme x:Key="OverlayCloseButton" TargetType="Button">
<Setter Property="CornerRadius" Value="6" />
<Setter Property="Margin" Value="0, 4" />
<Setter Property="Padding" Value="4" />
<Setter Property="Height" Value="28" />
<Setter Property="Width" Value="28" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="VerticalAlignment" Value="Stretch" />
<Setter Property="Template">
<ControlTemplate TargetType="Button">
<Border
Name="PART_Border"
Padding="{TemplateBinding Padding}"
Background="Transparent"
CornerRadius="{TemplateBinding CornerRadius}">
<PathIcon
Width="12"
Height="12"
Data="{DynamicResource WindowCloseIconGlyph}"/>
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^:pointerover /template/ Border">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ Border">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
</Style>
</ControlTheme>
</ResourceDictionary>
</ResourceDictionary>

View File

@@ -126,7 +126,7 @@
x:Name="PART_CloseButton"
VerticalAlignment="Top"
HorizontalAlignment="Right"
Theme="{StaticResource NotificationCloseButton}"
Theme="{StaticResource OverlayCloseButton}"
IsVisible="{TemplateBinding ShowClose}"
u:MessageCard.CloseOnClick="True" />
</DockPanel>
@@ -432,32 +432,4 @@
</Style>
</Style>
</ControlTheme>
<ControlTheme x:Key="NotificationCloseButton" TargetType="Button">
<Setter Property="CornerRadius" Value="6" />
<Setter Property="Height" Value="24" />
<Setter Property="Width" Value="24" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Foreground" Value="{DynamicResource NotificationCardCloseButtonForeground}" />
<Setter Property="Template">
<ControlTemplate TargetType="Button">
<Border
Name="PART_Border"
Padding="{TemplateBinding Padding}"
Background="Transparent"
CornerRadius="{TemplateBinding CornerRadius}">
<PathIcon
Width="10"
Height="10"
Data="{DynamicResource WindowCloseIconGlyph}" />
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^:pointerover /template/ Border">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ Border">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
</Style>
</ControlTheme>
</ResourceDictionary>

View File

@@ -87,7 +87,7 @@
</ContentControl>
<Button
x:Name="PART_CloseButton"
Theme="{StaticResource ToastCloseButton}"
Theme="{StaticResource OverlayCloseButton}"
VerticalAlignment="Top"
IsVisible="{TemplateBinding ShowClose}"
u:MessageCard.CloseOnClick="True" />
@@ -220,31 +220,4 @@
</Style>
</Style>
</ControlTheme>
<ControlTheme x:Key="ToastCloseButton" TargetType="Button">
<Setter Property="CornerRadius" Value="6" />
<Setter Property="Height" Value="24" />
<Setter Property="Width" Value="24" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<ControlTemplate TargetType="Button">
<Border
Name="PART_Border"
Padding="{TemplateBinding Padding}"
Background="Transparent"
CornerRadius="{TemplateBinding CornerRadius}">
<PathIcon
Width="10"
Height="10"
Data="{DynamicResource WindowCloseIconGlyph}" />
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^:pointerover /template/ Border">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ Border">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
</Style>
</ControlTheme>
</ResourceDictionary>