feat: transform style resources.

This commit is contained in:
Zhang Dian 2023-08-14 11:17:07 +08:00
parent e1588120f2
commit a6fe50e6bc
4 changed files with 158 additions and 34 deletions

View File

@ -120,11 +120,11 @@
<Setter Property="ListBoxItem.Cursor" Value="Hand" />
<Setter Property="ListBoxItem.HorizontalContentAlignment" Value="Left" />
<Setter Property="ListBoxItem.VerticalContentAlignment" Value="Center" />
<Setter Property="ListBoxItem.FontSize" Value="{DynamicResource RadioButtonFontSize}" />
<Setter Property="ListBoxItem.CornerRadius" Value="{DynamicResource RadioButtonBoxCornerRadius}" />
<Setter Property="ListBoxItem.Foreground" Value="{DynamicResource RadioButtonForeground}" />
<Setter Property="ListBoxItem.Background" Value="{DynamicResource RadioButtonDefaultBackground}" />
<Setter Property="ListBoxItem.BorderBrush" Value="{DynamicResource RadioButtonDefaultBorderBrush}" />
<Setter Property="ListBoxItem.FontSize" Value="{DynamicResource ListBoxItemRadioGroupFontSize}" />
<Setter Property="ListBoxItem.CornerRadius" Value="{DynamicResource ListBoxItemRadioGroupBoxCornerRadius}" />
<Setter Property="ListBoxItem.Foreground" Value="{DynamicResource ListBoxItemRadioGroupForeground}" />
<Setter Property="ListBoxItem.Background" Value="{DynamicResource ListBoxItemRadioGroupDefaultBackground}" />
<Setter Property="ListBoxItem.BorderBrush" Value="{DynamicResource ListBoxItemRadioGroupDefaultBorderBrush}" />
<Setter Property="ListBoxItem.Template">
<ControlTemplate TargetType="ListBoxItem">
<Border
@ -136,24 +136,24 @@
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<Grid ColumnDefinitions="Auto,*">
<Grid Margin="{DynamicResource RadioButtonIconMargin}"
<Grid Margin="{DynamicResource ListBoxItemRadioGroupIconMargin}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
<Ellipse
Name="OuterEllipse"
Width="{DynamicResource RadioButtonIconRadius}"
Height="{DynamicResource RadioButtonIconRadius}"
Fill="{DynamicResource RadioButtonUncheckIconDefaultBackground}"
Stroke="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}"
Width="{DynamicResource ListBoxItemRadioGroupIconRadius}"
Height="{DynamicResource ListBoxItemRadioGroupIconRadius}"
Fill="{DynamicResource ListBoxItemRadioGroupUncheckIconDefaultBackground}"
Stroke="{DynamicResource ListBoxItemRadioGroupUncheckIconDefaultBorderBrush}"
StrokeThickness="1"
UseLayoutRounding="False" />
<Ellipse
Name="CheckGlyph"
Width="{DynamicResource RadioButtonGlyphRadius}"
Height="{DynamicResource RadioButtonGlyphRadius}"
Fill="{DynamicResource RadioButtonCheckGlyphFill}"
Width="{DynamicResource ListBoxItemRadioGroupGlyphRadius}"
Height="{DynamicResource ListBoxItemRadioGroupGlyphRadius}"
Fill="{DynamicResource ListBoxItemRadioGroupCheckGlyphFill}"
Opacity="0"
Stroke="{DynamicResource RadioButtonCheckGlyphFill}"
Stroke="{DynamicResource ListBoxItemRadioGroupCheckGlyphFill}"
StrokeThickness="0"
UseLayoutRounding="False" />
</Grid>
@ -167,8 +167,8 @@
ContentTemplate="{TemplateBinding ContentTemplate}"
Foreground="{TemplateBinding Foreground}"
RecognizesAccessKey="True"
TextElement.FontSize="{DynamicResource RadioButtonFontSize}"
TextElement.Foreground="{DynamicResource RadioButtonForeground}" />
TextElement.FontSize="{DynamicResource ListBoxItemRadioGroupFontSize}"
TextElement.Foreground="{DynamicResource ListBoxItemRadioGroupForeground}" />
</Grid>
</Border>
@ -178,8 +178,8 @@
<!-- Unchecked State -->
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDefaultBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconDefaultBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconDefaultBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="0" />
@ -188,8 +188,8 @@
<!-- Unchecked Pointerover State -->
<Style Selector="^:pointerover">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointeroverBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPointeroverBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconPointeroverBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconPointeroverBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="0" />
@ -199,8 +199,8 @@
<!-- Unchecked Pressed State -->
<Style Selector="^:pressed">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPressedBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconPressedBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconPressedBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="0" />
@ -210,22 +210,22 @@
<!-- Unchecked Disabled state -->
<Style Selector="^:disabled">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconDisabledBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupUncheckIconDisabledBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="0" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
<Setter Property="Foreground" Value="{DynamicResource ListBoxItemRadioGroupDisabledForeground}" />
</Style>
</Style>
<!-- Checked State -->
<Style Selector="^:selected">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDefaultBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDefaultBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupCheckIconDefaultBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupCheckIconDefaultBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="1" />
@ -234,8 +234,8 @@
<!-- Checked Pointerover State -->
<Style Selector="^:pointerover">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointeroverBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointeroverBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupCheckIconPointeroverBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupCheckIconPointeroverBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="1" />
@ -245,8 +245,8 @@
<!-- Checked Pressed State -->
<Style Selector="^:pressed">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPressedBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPressedBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupCheckIconPressedBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupCheckIconPressedBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="1" />
@ -256,14 +256,14 @@
<!-- Checked Disabled State -->
<Style Selector="^:disabled">
<Style Selector="^ /template/ Ellipse#OuterEllipse">
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
<Setter Property="Stroke" Value="{DynamicResource ListBoxItemRadioGroupCheckIconDisabledBorderBrush}" />
<Setter Property="Fill" Value="{DynamicResource ListBoxItemRadioGroupCheckIconDisabledBackground}" />
</Style>
<Style Selector="^ /template/ Ellipse#CheckGlyph">
<Setter Property="Ellipse.Opacity" Value="1" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
<Setter Property="Foreground" Value="{DynamicResource ListBoxItemRadioGroupDisabledForeground}" />
</Style>
</Style>
</Style>

View File

@ -11,4 +11,53 @@
<SolidColorBrush x:Key="ListBoxItemSelectedPointeroverBackground" Opacity="0.3" Color="#FF54A9FF" />
<SolidColorBrush x:Key="ListBoxItemDisabledBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemSelectedDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
<!-- RadioGroupListBox -->
<SolidColorBrush x:Key="ListBoxItemRadioGroupDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPointeroverBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPressedBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDisabledBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDefaultBorderBrush" Opacity="0.35" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPointeroverBorderBrush" Color="#7FC1FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPressedBorderBrush" Color="#A9D7FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDisabledBorderBrush" Opacity="0.08" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDefaultBackground" Color="#54A9FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPointeroverBackground" Color="#7FC1FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPressedBackground" Color="#A9D7FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDisabledBackground" Color="#135cb8" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDefaultBorderBrush" Color="#54A9FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPointeroverBorderBrush" Color="#7FC1FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPressedBorderBrush" Color="#A9D7FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDisabledBorderBrush" Color="#135cb8" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckGlyphFill" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupForeground" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupDefaultBorderBrush" Opacity="0.35" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupGroupBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonUncheckedForeground" Opacity="0.8" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonUncheckedPointeroverBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonUncheckedDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonCheckedBackground" Color="#43444A" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonCheckedForeground" Color="#54A9FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonCheckedDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardDefaultBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckedBackground" Opacity="0.2" Color="#FF54A9FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckDefaultBorderBrush" Color="#54A9FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckPointeroverBorderBrush" Color="#7FC1FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckPressedBorderBrush" Color="#A9D7FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckDisabledBorderBrush" Color="#135cb8" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardUncheckPointeroverBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardUncheckPressedBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardUncheckDisabledBackground" Opacity="0.12" Color="White" />
</ResourceDictionary>

View File

@ -11,4 +11,54 @@
<SolidColorBrush x:Key="ListBoxItemSelectedPointeroverBackground" Color="#CBE7FE" />
<SolidColorBrush x:Key="ListBoxItemDisabledBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemSelectedDisabledBackground" Opacity="0.02" Color="#2E3238" />
<!-- RadioGroupListBox -->
<SolidColorBrush x:Key="ListBoxItemRadioGroupDisabledForeground" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPointeroverBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPressedBackground" Opacity="0.09" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDisabledBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDefaultBorderBrush" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPointeroverBorderBrush" Color="#0062D6" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconPressedBorderBrush" Color="#004FB3" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupUncheckIconDisabledBorderBrush" Opacity="0.08" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDefaultBackground" Color="#0077FA" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPointeroverBackground" Color="#0062D6" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPressedBackground" Color="#004FB3" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDisabledBackground" Color="#98CDFD" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDefaultBorderBrush" Color="#0077FA" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPointeroverBorderBrush" Color="#0062D6" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconPressedBorderBrush" Color="#004FB3" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckIconDisabledBorderBrush" Color="#98CDFD" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCheckGlyphFill" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupForeground" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupDefaultBorderBrush" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupGroupBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonUncheckedForeground" Opacity="0.8" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonUncheckedPointeroverBackground" Opacity="0.09" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonUncheckedDisabledForeground" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonCheckedForeground" Color="#0077FA" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonCheckedBackground" Color="White" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupButtonCheckedDisabledForeground" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardDefaultBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckedBackground" Color="#FFEAF5FF" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckDefaultBorderBrush" Color="#0077FA" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckPointeroverBorderBrush" Color="#0062D6" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckPressedBorderBrush" Color="#004FB3" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardCheckDisabledBorderBrush" Color="#98CDFD" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardUncheckPointeroverBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardUncheckPressedBackground" Opacity="0.09" Color="#2E3238" />
<SolidColorBrush x:Key="ListBoxItemRadioGroupCardUncheckDisabledBackground" Opacity="0.05" Color="#2E3238" />
</ResourceDictionary>

View File

@ -1,4 +1,29 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Thickness x:Key="ListBoxItemDefaultPadding">8 4</Thickness>
<CornerRadius x:Key="ListBoxItemCornerRadius">3</CornerRadius>
<!-- RadioGroupListBox -->
<x:Double x:Key="ListBoxItemRadioGroupIconRadius">16</x:Double>
<x:Double x:Key="ListBoxItemRadioGroupGlyphRadius">6</x:Double>
<x:Double x:Key="ListBoxItemRadioGroupFontSize">14</x:Double>
<Thickness x:Key="ListBoxItemRadioGroupIconMargin">0 2 8 0</Thickness>
<CornerRadius x:Key="ListBoxItemRadioGroupBoxCornerRadius">3</CornerRadius>
<CornerRadius x:Key="ListBoxItemRadioGroupGroupCornerRadius">3</CornerRadius>
<CornerRadius x:Key="ListBoxItemRadioGroupButtonCornerRadius">3</CornerRadius>
<FontWeight x:Key="ListBoxItemRadioGroupButtonFontWeight">600</FontWeight>
<Thickness x:Key="ListBoxItemRadioGroupButtonSmallPadding">16 2</Thickness>
<Thickness x:Key="ListBoxItemRadioGroupButtonDefaultPadding">16 4</Thickness>
<Thickness x:Key="ListBoxItemRadioGroupButtonLargePadding">24 6</Thickness>
<x:Double x:Key="ListBoxItemRadioGroupButtonSmallFontSize">12</x:Double>
<x:Double x:Key="ListBoxItemRadioGroupButtonDefaultFontSize">12</x:Double>
<x:Double x:Key="ListBoxItemRadioGroupButtonLargeFontSize">14</x:Double>
<Thickness x:Key="ListBoxItemRadioGroupCardPadding">16 12</Thickness>
<CornerRadius x:Key="ListBoxItemRadioGroupCardCornerRadius">3</CornerRadius>
</ResourceDictionary>