feat: update radio button theme, pending on card and pure card.
update checkbox glyphs.
This commit is contained in:
parent
8c19376e7c
commit
c509d2024a
@ -1,14 +1,9 @@
|
||||
<Window
|
||||
Title="Semi.Demo"
|
||||
d:DesignHeight="450"
|
||||
d:DesignWidth="800"
|
||||
mc:Ignorable="d"
|
||||
x:Class="Semi.Avalonia.Demo.MainWindow"
|
||||
xmlns="https://github.com/avaloniaui"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:pages="using:Semi.Avalonia.Demo.Pages"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
x:Class="Semi.Avalonia.Demo.MainWindow" xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:pages="using:Semi.Avalonia.Demo.Pages"
|
||||
Title="Semi.Demo" d:DesignHeight="450"
|
||||
d:DesignWidth="800" mc:Ignorable="d">
|
||||
<TabControl TabStripPlacement="Left">
|
||||
<TabItem Header="Button">
|
||||
<pages:ButtonDemo />
|
||||
@ -16,5 +11,8 @@
|
||||
<TabItem Header="CheckBox">
|
||||
<pages:CheckBoxDemo />
|
||||
</TabItem>
|
||||
<TabItem Header="RadioButton">
|
||||
<pages:RadioButtonDemo />
|
||||
</TabItem>
|
||||
</TabControl>
|
||||
</Window>
|
||||
|
@ -1,4 +1,5 @@
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Interactivity;
|
||||
|
||||
namespace Semi.Avalonia.Demo
|
||||
{
|
||||
|
56
src/Semi.Avalonia.Demo/Pages/RadioButtonDemo.axaml
Normal file
56
src/Semi.Avalonia.Demo/Pages/RadioButtonDemo.axaml
Normal file
@ -0,0 +1,56 @@
|
||||
<UserControl
|
||||
x:Class="Semi.Avalonia.Demo.Pages.RadioButtonDemo" xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" d:DesignHeight="450"
|
||||
d:DesignWidth="800" mc:Ignorable="d">
|
||||
<StackPanel
|
||||
Margin="20" HorizontalAlignment="Left"
|
||||
Spacing="20">
|
||||
<TextBlock Text="Radio Buttons" />
|
||||
<StackPanel>
|
||||
<RadioButton>111</RadioButton>
|
||||
<RadioButton>222</RadioButton>
|
||||
<RadioButton>333</RadioButton>
|
||||
</StackPanel>
|
||||
<TextBlock Text="Radio Button as Button" />
|
||||
<Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
|
||||
<StackPanel Orientation="Horizontal">
|
||||
<RadioButton Classes="Small" Theme="{DynamicResource ButtonRadioButton}">小1</RadioButton>
|
||||
<RadioButton Classes="Small" Theme="{DynamicResource ButtonRadioButton}">小2</RadioButton>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
<Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
|
||||
<StackPanel Orientation="Horizontal">
|
||||
<RadioButton Theme="{DynamicResource ButtonRadioButton}">默认1</RadioButton>
|
||||
<RadioButton Theme="{DynamicResource ButtonRadioButton}">默认2</RadioButton>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
<Border Theme="{StaticResource RadioButtonGroupBorder}">
|
||||
<StackPanel Orientation="Horizontal">
|
||||
<RadioButton Classes="Large" Theme="{DynamicResource ButtonRadioButton}">大1</RadioButton>
|
||||
<RadioButton Classes="Large" Theme="{DynamicResource ButtonRadioButton}">大2</RadioButton>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
<TextBlock Text="Radio Button as Card" />
|
||||
<StackPanel Width="300">
|
||||
<RadioButton Theme="{DynamicResource CardRadioButton}">
|
||||
<StackPanel>
|
||||
<TextBlock FontWeight="Bold">单选框标题</TextBlock>
|
||||
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
|
||||
</StackPanel>
|
||||
</RadioButton>
|
||||
<RadioButton Theme="{DynamicResource CardRadioButton}">
|
||||
<StackPanel>
|
||||
<TextBlock FontWeight="Bold">单选框标题</TextBlock>
|
||||
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
|
||||
</StackPanel>
|
||||
</RadioButton>
|
||||
<RadioButton Theme="{DynamicResource CardRadioButton}">
|
||||
<StackPanel>
|
||||
<TextBlock FontWeight="Bold">单选框标题</TextBlock>
|
||||
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
|
||||
</StackPanel>
|
||||
</RadioButton>
|
||||
</StackPanel>
|
||||
</StackPanel>
|
||||
</UserControl>
|
18
src/Semi.Avalonia.Demo/Pages/RadioButtonDemo.axaml.cs
Normal file
18
src/Semi.Avalonia.Demo/Pages/RadioButtonDemo.axaml.cs
Normal file
@ -0,0 +1,18 @@
|
||||
using Avalonia;
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Markup.Xaml;
|
||||
|
||||
namespace Semi.Avalonia.Demo.Pages;
|
||||
|
||||
public partial class RadioButtonDemo : UserControl
|
||||
{
|
||||
public RadioButtonDemo()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void InitializeComponent()
|
||||
{
|
||||
AvaloniaXamlLoader.Load(this);
|
||||
}
|
||||
}
|
@ -90,7 +90,7 @@
|
||||
</Style>
|
||||
|
||||
<Style Selector="^ /template/ Path#CheckGlyph">
|
||||
<Setter Property="Data" Value="M1507 31L438 1101L-119 543L-29 453L438 919L1417 -59L1507 31Z" />
|
||||
<Setter Property="Data" Value="M17.4111 7.30848C18.0692 7.81171 18.1947 8.75312 17.6915 9.41119L11.1915 17.9112C10.909 18.2806 10.4711 18.4981 10.0061 18.5C9.54105 18.5019 9.10143 18.288 8.81592 17.9209L5.31592 13.4209C4.80731 12.767 4.92512 11.8246 5.57904 11.316C6.23296 10.8074 7.17537 10.9252 7.68398 11.5791L9.98988 14.5438L15.3084 7.58884C15.8116 6.93077 16.7531 6.80525 17.4111 7.30848Z" />
|
||||
<Setter Property="Width" Value="9" />
|
||||
<Setter Property="Opacity" Value="1" />
|
||||
</Style>
|
||||
@ -134,7 +134,7 @@
|
||||
</Style>
|
||||
|
||||
<Style Selector="^ /template/ Path#CheckGlyph">
|
||||
<Setter Property="Data" Value="M1536 1536v-0h-1024v128h1024z" />
|
||||
<Setter Property="Data" Value="M5 12.5C5 11.6716 5.67157 11 6.5 11H17.5C18.3284 11 19 11.6716 19 12.5C19 13.3284 18.3284 14 17.5 14H6.5C5.67157 14 5 13.3284 5 12.5Z" />
|
||||
<Setter Property="Width" Value="9" />
|
||||
<Setter Property="Opacity" Value="1" />
|
||||
</Style>
|
||||
|
@ -3,6 +3,7 @@
|
||||
<ResourceDictionary.MergedDictionaries>
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Controls/Button.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Controls/CheckBox.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Controls/RadioButton.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Controls/TabControl.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Controls/TabItem.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Controls/UserControl.axaml" />
|
||||
|
302
src/Semi.Avalonia/Controls/RadioButton.axaml
Normal file
302
src/Semi.Avalonia/Controls/RadioButton.axaml
Normal file
@ -0,0 +1,302 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<Design.PreviewWith>
|
||||
<StackPanel>
|
||||
<RadioButton Theme="{StaticResource ButtonRadioButton}">Hello Button</RadioButton>
|
||||
<RadioButton>Hello Button2</RadioButton>
|
||||
<RadioButton>Hello Button3</RadioButton>
|
||||
<Border Theme="{StaticResource RadioButtonGroupBorder}">
|
||||
<StackPanel Orientation="Horizontal">
|
||||
<RadioButton Theme="{StaticResource ButtonRadioButton}">Hello Button2</RadioButton>
|
||||
<RadioButton Theme="{StaticResource ButtonRadioButton}">Hello Button3</RadioButton>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
<RadioButton Theme="{StaticResource CardRadioButton}">Hello Button3</RadioButton>
|
||||
<RadioButton Theme="{StaticResource CardRadioButton}">Hello Button3</RadioButton>
|
||||
</StackPanel>
|
||||
</Design.PreviewWith>
|
||||
<!-- Theme: Default, Button, Card, PureCard -->
|
||||
<ControlTheme x:Key="{x:Type RadioButton}" TargetType="RadioButton">
|
||||
<Setter Property="RadioButton.HorizontalAlignment" Value="Left" />
|
||||
<Setter Property="RadioButton.VerticalAlignment" Value="Top" />
|
||||
<Setter Property="RadioButton.HorizontalContentAlignment" Value="Left" />
|
||||
<Setter Property="RadioButton.VerticalContentAlignment" Value="Center" />
|
||||
<Setter Property="RadioButton.FontSize" Value="{DynamicResource RadioButtonFontSize}" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="RadioButton">
|
||||
<Border
|
||||
Name="RootBorder"
|
||||
Margin="{TemplateBinding Margin}"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid ColumnDefinitions="Auto,*">
|
||||
<Grid Margin="{DynamicResource RadioButtonIconMargin}" VerticalAlignment="Top">
|
||||
<Ellipse
|
||||
Name="OuterEllipse"
|
||||
Width="{DynamicResource RadioButtonIconRadius}"
|
||||
Height="{DynamicResource RadioButtonIconRadius}"
|
||||
Fill="{DynamicResource RadioButtonUncheckIconDefaultBackground}"
|
||||
Stroke="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}"
|
||||
StrokeThickness="1" UseLayoutRounding="False" />
|
||||
|
||||
<Ellipse
|
||||
Name="CheckGlyph"
|
||||
Width="{DynamicResource RadioButtonGlyphRadius}"
|
||||
Height="{DynamicResource RadioButtonGlyphRadius}"
|
||||
Fill="{DynamicResource RadioButtonCheckGlyphFill}"
|
||||
Opacity="0"
|
||||
Stroke="{DynamicResource RadioButtonCheckGlyphFill}"
|
||||
StrokeThickness="0" UseLayoutRounding="False" />
|
||||
</Grid>
|
||||
|
||||
<ContentPresenter
|
||||
Name="PART_ContentPresenter" Grid.Column="1"
|
||||
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}"
|
||||
Foreground="{TemplateBinding Foreground}"
|
||||
RecognizesAccessKey="True"
|
||||
TextElement.FontSize="{DynamicResource RadioButtonFontSize}"
|
||||
TextElement.Foreground="{DynamicResource RadioButtonForeground}" />
|
||||
</Grid>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
|
||||
<!-- PointerOver State -->
|
||||
<Style Selector="^:checked">
|
||||
<Style Selector="^ /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDefaultBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDefaultBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointOverBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointOverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPressedBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPressedBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
</Style>
|
||||
<Style Selector="^:unchecked">
|
||||
<Style Selector="^ /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDefaultBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointOverBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPointOverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPressedBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
|
||||
<ControlTheme x:Key="RadioButtonGroupBorder" TargetType="Border">
|
||||
<Setter Property="Border.CornerRadius" Value="{DynamicResource RadioButtonGroupCornerRadius}" />
|
||||
<Setter Property="Border.Background" Value="{DynamicResource RadioButtonGroupBackground}" />
|
||||
</ControlTheme>
|
||||
|
||||
|
||||
<ControlTheme x:Key="ButtonRadioButton" TargetType="RadioButton">
|
||||
<Setter Property="RadioButton.CornerRadius" Value="{DynamicResource RadioButtonButtonCornerRadius}" />
|
||||
<Setter Property="RadioButton.Margin" Value="2" />
|
||||
<Setter Property="RadioButton.FontWeight" Value="{DynamicResource RadioButtonButtonFontWeight}" />
|
||||
<Setter Property="RadioButton.FontSize" Value="{DynamicResource RadioButtonButtonDefaultFontSize}" />
|
||||
<Setter Property="RadioButton.Padding" Value="{DynamicResource RadioButtonButtonDefaultPadding}" />
|
||||
<Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonUncheckedForeground}" />
|
||||
<Setter Property="RadioButton.Template">
|
||||
<ControlTemplate TargetType="RadioButton">
|
||||
<ContentPresenter
|
||||
x:Name="PART_ContentPresenter"
|
||||
Margin="{TemplateBinding Margin}"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}"
|
||||
RecognizesAccessKey="True"
|
||||
TextElement.FontSize="{TemplateBinding FontSize}"
|
||||
TextElement.FontWeight="{TemplateBinding FontWeight}"
|
||||
UseLayoutRounding="False" />
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
<Style Selector="^:checked">
|
||||
<Setter Property="RadioButton.Background" Value="White" />
|
||||
<Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonCheckedForeground}" />
|
||||
</Style>
|
||||
<Style Selector="^:unchecked">
|
||||
<Setter Property="RadioButton.Background" Value="Transparent" />
|
||||
<Style Selector="^:pointerover">
|
||||
<Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonButtonUncheckedPointeroverBackground}" />
|
||||
</Style>
|
||||
</Style>
|
||||
<Style Selector="^.Small">
|
||||
<Setter Property="RadioButton.FontSize" Value="{StaticResource RadioButtonButtonSmallFontSize}" />
|
||||
<Setter Property="RadioButton.Padding" Value="{StaticResource RadioButtonButtonSmallPadding}" />
|
||||
</Style>
|
||||
<Style Selector="^.Large">
|
||||
<Setter Property="RadioButton.FontSize" Value="{StaticResource RadioButtonButtonLargeFontSize}" />
|
||||
<Setter Property="RadioButton.Padding" Value="{StaticResource RadioButtonButtonLargePadding}" />
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
|
||||
<ControlTheme x:Key="CardRadioButton" TargetType="RadioButton">
|
||||
<Setter Property="RadioButton.Padding" Value="{DynamicResource RadioButtonCardPadding}" />
|
||||
<Setter Property="RadioButton.BorderBrush" Value="BLue" />
|
||||
<Setter Property="RadioButton.BorderThickness" Value="1" />
|
||||
<Setter Property="RadioButton.HorizontalAlignment" Value="Left" />
|
||||
<Setter Property="RadioButton.VerticalAlignment" Value="Top" />
|
||||
<Setter Property="RadioButton.HorizontalContentAlignment" Value="Left" />
|
||||
<Setter Property="RadioButton.VerticalContentAlignment" Value="Center" />
|
||||
<Setter Property="RadioButton.Background" Value="Transparent" />
|
||||
<Setter Property="RadioButton.FontSize" Value="{DynamicResource RadioButtonFontSize}" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="RadioButton">
|
||||
<Border
|
||||
Name="RootBorder"
|
||||
Margin="{TemplateBinding Margin}"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid ColumnDefinitions="Auto,*">
|
||||
<Grid Margin="{DynamicResource RadioButtonIconMargin}" VerticalAlignment="Top">
|
||||
<Ellipse
|
||||
Name="OuterEllipse"
|
||||
Width="{DynamicResource RadioButtonIconRadius}"
|
||||
Height="{DynamicResource RadioButtonIconRadius}"
|
||||
Fill="{DynamicResource RadioButtonUncheckIconDefaultBackground}"
|
||||
Stroke="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}"
|
||||
StrokeThickness="1" UseLayoutRounding="False" />
|
||||
|
||||
<Ellipse
|
||||
Name="CheckGlyph"
|
||||
Width="{DynamicResource RadioButtonGlyphRadius}"
|
||||
Height="{DynamicResource RadioButtonGlyphRadius}"
|
||||
Fill="{DynamicResource RadioButtonCheckGlyphFill}"
|
||||
Opacity="0"
|
||||
Stroke="{DynamicResource RadioButtonCheckGlyphFill}"
|
||||
StrokeThickness="0" UseLayoutRounding="False" />
|
||||
</Grid>
|
||||
|
||||
<ContentPresenter
|
||||
Name="PART_ContentPresenter" Grid.Column="1"
|
||||
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}"
|
||||
Foreground="{TemplateBinding Foreground}"
|
||||
RecognizesAccessKey="True"
|
||||
TextElement.FontSize="{DynamicResource RadioButtonFontSize}"
|
||||
TextElement.Foreground="{DynamicResource RadioButtonForeground}" />
|
||||
</Grid>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
|
||||
<!-- PointerOver State -->
|
||||
<Style Selector="^:checked">
|
||||
<Style Selector="^ /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDefaultBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDefaultBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointOverBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointOverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPressedBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPressedBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="1" />
|
||||
</Style>
|
||||
</Style>
|
||||
<Style Selector="^:unchecked">
|
||||
<Style Selector="^ /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDefaultBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointOverBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPointOverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
|
||||
<Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
|
||||
<Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPressedBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
|
||||
<Setter Property="Ellipse.Opacity" Value="0" />
|
||||
</Style>
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
@ -1,27 +1,27 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<ControlTheme x:Key="{x:Type Window}" TargetType="Window">
|
||||
<Setter Property="Background" Value="{DynamicResource WindowDefaultBackground}" />
|
||||
<Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource WindowDefaultBackground}" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource WindowDefaultForeground}" />
|
||||
<Setter Property="FontSize" Value="{DynamicResource FontDefaultFontSize}"/>
|
||||
<Setter Property="FontFamily" Value="{DynamicResource FontDefaultFontFamily}" />
|
||||
<Setter Property="FontSize" Value="{DynamicResource DefaultFontSize}" />
|
||||
<Setter Property="FontFamily" Value="{DynamicResource DefaultFontFamily}" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="Window">
|
||||
<Panel>
|
||||
<Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
|
||||
<Border Background="{TemplateBinding Background}" IsHitTestVisible="False" />
|
||||
<Panel Background="Transparent" Margin="{TemplateBinding WindowDecorationMargin}" />
|
||||
<Panel Margin="{TemplateBinding WindowDecorationMargin}" Background="Transparent" />
|
||||
<VisualLayerManager>
|
||||
<VisualLayerManager.ChromeOverlayLayer>
|
||||
<TitleBar />
|
||||
</VisualLayerManager.ChromeOverlayLayer>
|
||||
<ContentPresenter Name="PART_ContentPresenter"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}"
|
||||
Content="{TemplateBinding Content}"
|
||||
<ContentPresenter
|
||||
Name="PART_ContentPresenter"
|
||||
Margin="{TemplateBinding Padding}"
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}" />
|
||||
</VisualLayerManager>
|
||||
</Panel>
|
||||
</ControlTemplate>
|
||||
|
@ -1,7 +1,7 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
<ResourceDictionary
|
||||
xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:sys="clr-namespace:System;assembly=System.Runtime">
|
||||
<!-- Add Resources Here -->
|
||||
<sys:Double x:Key="FontDefaultFontSize">14</sys:Double>
|
||||
<FontFamily x:Key="FontDefaultFontFamily">Inter,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif</FontFamily>
|
||||
<sys:Double x:Key="DefaultFontSize">14</sys:Double>
|
||||
<FontFamily x:Key="DefaultFontFamily">Inter,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif</FontFamily>
|
||||
</ResourceDictionary>
|
||||
|
@ -4,6 +4,7 @@
|
||||
<!-- Controls -->
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Themes/Light/Button.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Themes/Light/CheckBox.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Themes/Light/RadioButton.axaml" />
|
||||
<ResourceInclude Source="avares://Semi.Avalonia/Themes/Light/Window.axaml" />
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
</ResourceDictionary>
|
||||
|
54
src/Semi.Avalonia/Themes/Light/RadioButton.axaml
Normal file
54
src/Semi.Avalonia/Themes/Light/RadioButton.axaml
Normal file
@ -0,0 +1,54 @@
|
||||
<ResourceDictionary
|
||||
xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:sys="clr-namespace:System;assembly=System.Runtime">
|
||||
<sys:Double x:Key="RadioButtonIconRadius">16</sys:Double>
|
||||
<sys:Double x:Key="RadioButtonGlyphRadius">6</sys:Double>
|
||||
<sys:Double x:Key="RadioButtonFontSize">14</sys:Double>
|
||||
<Thickness x:Key="RadioButtonIconMargin">0 2 8 0</Thickness>
|
||||
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconDefaultBackground" Color="White" />
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconPointOverBackground" Opacity="0.05" Color="#2E3238" />
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconPressedBackground" Opacity="0.09" Color="#2E3238" />
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconDisabledBackground" Opacity="0.05" Color="#2E3238" />
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconDefaultBorderBrush" Opacity="0.35" Color="#1C1F23" />
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconPointOverBorderBrush" Color="#0062D6" />
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconPressedBorderBrush" Color="#004FB3" />
|
||||
<SolidColorBrush x:Key="RadioButtonUncheckIconDisabledBorderBrush" Opacity="0.08" Color="#1C1F23" />
|
||||
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconDefaultBackground" Color="#0077FA" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconPointOverBackground" Color="#0062D6" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconPressedBackground" Color="#004FB3" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconDisabledBackground" Color="#98CDFD" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconDefaultBorderBrush" Color="#0077FA" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconPointOverBorderBrush" Color="#0062D6" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconPressedBorderBrush" Color="#004FB3" />
|
||||
<SolidColorBrush x:Key="RadioButtonCheckIconDisabledBorderBrush" Color="#98CDFD" />
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonCheckGlyphFill" Color="White" />
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonForeground" Color="#1C1F23" />
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonGroupBackground" Opacity="0.05" Color="#2E3238" />
|
||||
|
||||
<CornerRadius x:Key="RadioButtonGroupCornerRadius">3</CornerRadius>
|
||||
<CornerRadius x:Key="RadioButtonButtonCornerRadius">3</CornerRadius>
|
||||
|
||||
<FontWeight x:Key="RadioButtonButtonFontWeight">600</FontWeight>
|
||||
<Thickness x:Key="RadioButtonButtonSmallPadding">16 2</Thickness>
|
||||
<Thickness x:Key="RadioButtonButtonDefaultPadding">16 4</Thickness>
|
||||
<Thickness x:Key="RadioButtonButtonLargePadding">24 6</Thickness>
|
||||
|
||||
<sys:Double x:Key="RadioButtonButtonSmallFontSize">12</sys:Double>
|
||||
<sys:Double x:Key="RadioButtonButtonDefaultFontSize">12</sys:Double>
|
||||
<sys:Double x:Key="RadioButtonButtonLargeFontSize">14</sys:Double>
|
||||
|
||||
<SolidColorBrush x:Key="RadioButtonButtonCheckedForeground" Color="#0077FA" />
|
||||
<SolidColorBrush x:Key="RadioButtonButtonUncheckedPointeroverBackground" Opacity="0.09" Color="#2E3238" />
|
||||
<SolidColorBrush x:Key="RadioButtonButtonUncheckedForeground" Opacity="0.8" Color="#1C1F23" />
|
||||
|
||||
<Thickness x:Key="RadioButtonCardPadding">16 12</Thickness>
|
||||
|
||||
</ResourceDictionary>
|
Loading…
x
Reference in New Issue
Block a user