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

feat: add SimpleToggleSwitch theme.

Browse Source
This commit is contained in:
Zhang Dian 2023-02-22 17:37:39 +08:00
parent 4e48f28e1c
commit 20f421f6fc
2 changed files with 60 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
demo/Semi.Avalonia.Demo/Pages/ToggleSwitchDemo.axaml
View File

@ -24,5 +24,21 @@
IsEnabled="False" IsEnabled="False"
OffContent="OffContent" OffContent="OffContent"
OnContent="OnContent" /> OnContent="OnContent" />
<ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}">
<ToggleSwitch.OnContent>
<PathIcon
Width="16"
Height="16"
Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
</ToggleSwitch.OnContent>
<ToggleSwitch.OffContent>
<PathIcon
Width="16"
Height="16"
Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z"
Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
</ToggleSwitch.OffContent>
</ToggleSwitch>
</StackPanel> </StackPanel>
</UserControl> </UserControl>

55
src/Semi.Avalonia/Controls/ToggleSwitch.axaml
View File

@ -123,17 +123,22 @@
<Setter Property="ContentPresenter.IsVisible" Value="True" /> <Setter Property="ContentPresenter.IsVisible" Value="True" />
</Style> </Style>
<Style Selector="^ /template/ Border#SwitchBackgroundBorder"> <Style Selector="^ /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedDefaultBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerUnCheckedDefaultBackground}" />
</Style> </Style>
<Style Selector="^:pointerover /template/ Border#SwitchBackgroundBorder"> <Style Selector="^:pointerover /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedPointerOverBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerUnCheckedPointerOverBackground}" />
</Style> </Style>
<Style Selector="^:pressed /template/ Border#SwitchBackgroundBorder"> <Style Selector="^:pressed /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedPressedBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerUnCheckedPressedBackground}" />
</Style> </Style>
<Style Selector="^:disabled /template/ Border#SwitchBackgroundBorder"> <Style Selector="^:disabled /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedDisabledBackground}" /> <Setter Property="Border.Background"
<Setter Property="Border.BorderBrush" Value="{DynamicResource ToggleSwitchContainerUnCheckedDisabledBorderBrush}" /> Value="{DynamicResource ToggleSwitchContainerUnCheckedDisabledBackground}" />
<Setter Property="Border.BorderBrush"
Value="{DynamicResource ToggleSwitchContainerUnCheckedDisabledBorderBrush}" />
<Setter Property="Border.BorderThickness" Value="1" /> <Setter Property="Border.BorderThickness" Value="1" />
</Style> </Style>
</Style> </Style>
@ -146,19 +151,45 @@
<Setter Property="ContentPresenter.IsVisible" Value="False" /> <Setter Property="ContentPresenter.IsVisible" Value="False" />
</Style> </Style>
<Style Selector="^ /template/ Border#SwitchBackgroundBorder"> <Style Selector="^ /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedDefaultBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerCheckedDefaultBackground}" />
</Style> </Style>
<Style Selector="^:pointerover /template/ Border#SwitchBackgroundBorder"> <Style Selector="^:pointerover /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedPointerOverBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerCheckedPointerOverBackground}" />
</Style> </Style>
<Style Selector="^:pressed /template/ Border#SwitchBackgroundBorder"> <Style Selector="^:pressed /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedPressedBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerCheckedPressedBackground}" />
</Style> </Style>
<Style Selector="^:disabled /template/ Border#SwitchBackgroundBorder"> <Style Selector="^:disabled /template/ Border#SwitchBackgroundBorder">
<Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedDisabledBackground}" /> <Setter Property="Border.Background"
Value="{DynamicResource ToggleSwitchContainerCheckedDisabledBackground}" />
</Style> </Style>
</Style> </Style>
</ControlTheme> </ControlTheme>
</ResourceDictionary>
<ControlTheme x:Key="SimpleToggleSwitch" BasedOn="{StaticResource {x:Type ToggleSwitch}}" TargetType="ToggleSwitch">
<Setter Property="Template">
<ControlTemplate TargetType="ToggleSwitch">
<Grid
Background="Transparent"
Cursor="Hand"
ColumnDefinitions="Auto">
<Grid x:Name="PART_SwitchKnob" />
<Grid x:Name="PART_MovingKnobs" />
<ContentPresenter
x:Name="PART_OnContentPresenter"
Margin="{DynamicResource ToggleSwitchOnContentMargin}"
Content="{TemplateBinding OnContent}"
ContentTemplate="{TemplateBinding OnContentTemplate}" />
<ContentPresenter
x:Name="PART_OffContentPresenter"
Margin="{DynamicResource ToggleSwitchOnContentMargin}"
Content="{TemplateBinding OffContent}"
ContentTemplate="{TemplateBinding OffContentTemplate}" />
</Grid>
</ControlTemplate>
</Setter>
</ControlTheme>
</ResourceDictionary>