feat: add new Theme - ThemeToggleSwitch.
This commit is contained in:
Zhang Dian
parent
faee95f12f
commit
cc001e951e
@ -17,7 +17,7 @@
|
||||
<UserControl.Resources>
|
||||
<ResourceDictionary>
|
||||
<ResourceDictionary.MergedDictionaries>
|
||||
<ResourceInclude Source="../Themes/ToggleButton.axaml" />
|
||||
<ResourceInclude Source="../Themes/ToggleSwitch.axaml" />
|
||||
<ResourceInclude Source="../Controls/ColorItemControl.axaml" />
|
||||
<ResourceInclude Source="../Controls/ColorDetailControl.axaml" />
|
||||
<ResourceInclude Source="../Controls/FunctionalColorGroupControl.axaml" />
|
||||
@ -34,11 +34,11 @@
|
||||
PanePlacement="Right">
|
||||
<SplitView.Pane>
|
||||
<StackPanel>
|
||||
<ToggleButton
|
||||
<ToggleSwitch
|
||||
Name="toggle"
|
||||
HorizontalAlignment="Right"
|
||||
IsChecked="True"
|
||||
Theme="{DynamicResource SplitViewToggleButton}" />
|
||||
Theme="{DynamicResource SplitViewToggleSwitch}" />
|
||||
<Border IsVisible="{Binding #splitView.IsPaneOpen}" Theme="{DynamicResource CardBorder}">
|
||||
<Panel>
|
||||
<TextBlock
|
||||
|
||||
@ -112,12 +112,12 @@
|
||||
<ListBox
|
||||
Grid.Row="1"
|
||||
ItemsSource="{Binding Songs}" />
|
||||
<ToggleButton
|
||||
<ToggleSwitch
|
||||
Grid.Row="2"
|
||||
Theme="{DynamicResource SplitViewToggleButton}"
|
||||
Theme="{DynamicResource SplitViewToggleSwitch}"
|
||||
HorizontalAlignment="Left"
|
||||
IsChecked="{Binding #SplitView.IsPaneOpen}">
|
||||
</ToggleButton>
|
||||
</ToggleSwitch>
|
||||
</Grid>
|
||||
</SplitView.Pane>
|
||||
|
||||
|
||||
@ -1,36 +0,0 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<ControlTheme x:Key="SplitViewToggleButton" TargetType="ToggleButton">
|
||||
<Setter Property="Width" Value="32" />
|
||||
<Setter Property="Height" Value="32" />
|
||||
<Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultTertiaryForeground}" />
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
|
||||
<Setter Property="Cursor" Value="Hand" />
|
||||
<Setter Property="Content"
|
||||
Value="M5 2H19C20.6569 2 22 3.34315 22 5V19C22 20.6569 20.6569 22 19 22H5C3.34315 22 2 20.6569 2 19V5C2 3.34315 3.34315 2 5 2ZM6 4C5.44772 4 5 4.44772 5 5V19C5 19.5523 5.44772 20 6 20H9C9.55229 20 10 19.5523 10 19V5C10 4.44772 9.55229 4 9 4H6Z" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="ToggleButton">
|
||||
<Border
|
||||
Name="Background"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<PathIcon
|
||||
Name="Icon"
|
||||
Theme="{DynamicResource InnerPathIcon}"
|
||||
Data="{TemplateBinding Content}"
|
||||
Foreground="{TemplateBinding Foreground}" />
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
<Style Selector="^:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed">
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
||||
67
demo/Semi.Avalonia.Demo/Themes/ToggleSwitch.axaml
Normal file
67
demo/Semi.Avalonia.Demo/Themes/ToggleSwitch.axaml
Normal file
@ -0,0 +1,67 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<ControlTheme x:Key="ThemeToggleSwitch" TargetType="ToggleSwitch">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="VerticalAlignment" Value="Center" />
|
||||
<Setter Property="HorizontalContentAlignment" Value="Center" />
|
||||
<Setter Property="VerticalContentAlignment" Value="Center" />
|
||||
<Setter Property="Padding" Value="8" />
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
|
||||
<Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
|
||||
<Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
|
||||
<Setter Property="Cursor" Value="Hand" />
|
||||
<Setter Property="OnContentTemplate">
|
||||
<DataTemplate>
|
||||
<PathIcon Theme="{StaticResource InnerPathIcon}" Data="{Binding}" />
|
||||
</DataTemplate>
|
||||
</Setter>
|
||||
<Setter Property="OffContentTemplate">
|
||||
<DataTemplate>
|
||||
<PathIcon Theme="{StaticResource InnerPathIcon}" Data="{Binding}" />
|
||||
</DataTemplate>
|
||||
</Setter>
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="ToggleSwitch">
|
||||
<Border
|
||||
Name="Background"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Panel>
|
||||
<Panel Name="PART_SwitchKnob" />
|
||||
<Panel Name="PART_MovingKnobs" />
|
||||
<ContentPresenter
|
||||
Name="PART_OnContentPresenter"
|
||||
IsVisible="{TemplateBinding IsChecked}"
|
||||
Content="{TemplateBinding OnContent}"
|
||||
ContentTemplate="{TemplateBinding OnContentTemplate}" />
|
||||
<ContentPresenter
|
||||
Name="PART_OffContentPresenter"
|
||||
IsVisible="{TemplateBinding IsChecked, Converter={x:Static BoolConverters.Not}}"
|
||||
Content="{TemplateBinding OffContent}"
|
||||
ContentTemplate="{TemplateBinding OffContentTemplate}" />
|
||||
</Panel>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
|
||||
<Style Selector="^:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed">
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
|
||||
</Style>
|
||||
</ControlTheme>
|
||||
|
||||
<ControlTheme x:Key="SplitViewToggleSwitch"
|
||||
BasedOn="{StaticResource ThemeToggleSwitch}"
|
||||
TargetType="ToggleSwitch">
|
||||
<Setter Property="Width" Value="32" />
|
||||
<Setter Property="Height" Value="32" />
|
||||
<Setter Property="OnContent"
|
||||
Value="M5 2H19C20.6569 2 22 3.34315 22 5V19C22 20.6569 20.6569 22 19 22H5C3.34315 22 2 20.6569 2 19V5C2 3.34315 3.34315 2 5 2ZM6 4C5.44772 4 5 4.44772 5 5V19C5 19.5523 5.44772 20 6 20H9C9.55229 20 10 19.5523 10 19V5C10 4.44772 9.55229 4 9 4H6Z" />
|
||||
<Setter Property="OffContent" Value="{Binding $self.OnContent}" />
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
||||
@ -15,7 +15,7 @@
|
||||
<ResourceDictionary>
|
||||
<ResourceDictionary.MergedDictionaries>
|
||||
<ResourceInclude Source="../Themes/TabMenu.axaml" />
|
||||
<ResourceInclude Source="../Themes/ToggleButton.axaml" />
|
||||
<ResourceInclude Source="../Themes/ToggleSwitch.axaml" />
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
<StreamGeometry x:Key="DocIcon">M12 21.5C10.65 20.65 8.2 20 6.5 20C4.85 20 3.15 20.3 1.75 21.05C1.65 21.1 1.6 21.1 1.5 21.1C1.25 21.1 1 20.85 1 20.6V6C1.6 5.55 2.25 5.25 3 5C4.11 4.65 5.33 4.5 6.5 4.5C8.45 4.5 10.55 4.9 12 6C13.45 4.9 15.55 4.5 17.5 4.5C18.67 4.5 19.89 4.65 21 5C21.75 5.25 22.4 5.55 23 6V20.6C23 20.85 22.75 21.1 22.5 21.1C22.4 21.1 22.35 21.1 22.25 21.05C20.85 20.3 19.15 20 17.5 20C15.8 20 13.35 20.65 12 21.5M12 8V19.5C13.35 18.65 15.8 18 17.5 18C18.7 18 19.9 18.15 21 18.5V7C19.9 6.65 18.7 6.5 17.5 6.5C15.8 6.5 13.35 7.15 12 8M13 11.5C14.11 10.82 15.6 10.5 17.5 10.5C18.41 10.5 19.26 10.59 20 10.78V9.23C19.13 9.08 18.29 9 17.5 9C15.73 9 14.23 9.28 13 9.84V11.5M17.5 11.67C15.79 11.67 14.29 11.93 13 12.46V14.15C14.11 13.5 15.6 13.16 17.5 13.16C18.54 13.16 19.38 13.24 20 13.4V11.9C19.13 11.74 18.29 11.67 17.5 11.67M20 14.57C19.13 14.41 18.29 14.33 17.5 14.33C15.67 14.33 14.17 14.6 13 15.13V16.82C14.11 16.16 15.6 15.83 17.5 15.83C18.54 15.83 19.38 15.91 20 16.07V14.57Z</StreamGeometry>
|
||||
<StreamGeometry x:Key="RepoIcon">M12,2A10,10 0 0,0 2,12C2,16.42 4.87,20.17 8.84,21.5C9.34,21.58 9.5,21.27 9.5,21C9.5,20.77 9.5,20.14 9.5,19.31C6.73,19.91 6.14,17.97 6.14,17.97C5.68,16.81 5.03,16.5 5.03,16.5C4.12,15.88 5.1,15.9 5.1,15.9C6.1,15.97 6.63,16.93 6.63,16.93C7.5,18.45 8.97,18 9.54,17.76C9.63,17.11 9.89,16.67 10.17,16.42C7.95,16.17 5.62,15.31 5.62,11.5C5.62,10.39 6,9.5 6.65,8.79C6.55,8.54 6.2,7.5 6.75,6.15C6.75,6.15 7.59,5.88 9.5,7.17C10.29,6.95 11.15,6.84 12,6.84C12.85,6.84 13.71,6.95 14.5,7.17C16.41,5.88 17.25,6.15 17.25,6.15C17.8,7.5 17.45,8.54 17.35,8.79C18,9.5 18.38,10.39 18.38,11.5C18.38,15.32 16.04,16.16 13.81,16.41C14.17,16.72 14.5,17.33 14.5,18.26C14.5,19.6 14.5,20.68 14.5,21C14.5,21.27 14.66,21.59 15.17,21.5C19.14,20.16 22,16.42 22,12A10,10 0 0,0 12,2Z</StreamGeometry>
|
||||
@ -32,9 +32,9 @@
|
||||
Theme="{DynamicResource CardBorder}">
|
||||
<Panel>
|
||||
<StackPanel Orientation="Horizontal" Spacing="8">
|
||||
<ToggleButton
|
||||
<ToggleSwitch
|
||||
Name="ExpandButton"
|
||||
Theme="{DynamicResource SplitViewToggleButton}" />
|
||||
Theme="{DynamicResource SplitViewToggleSwitch}" />
|
||||
<SelectableTextBlock
|
||||
VerticalAlignment="Center"
|
||||
Classes="H6"
|
||||
@ -57,7 +57,7 @@
|
||||
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultTertiaryForeground}" />
|
||||
</Style>
|
||||
<Style Selector="ToggleSwitch">
|
||||
<Setter Property="Theme" Value="{DynamicResource ButtonToggleSwitch}" />
|
||||
<Setter Property="Theme" Value="{DynamicResource ThemeToggleSwitch}" />
|
||||
<Setter Property="Width" Value="32" />
|
||||
<Setter Property="Height" Value="32" />
|
||||
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultTertiaryForeground}" />
|
||||
@ -75,14 +75,10 @@
|
||||
<PathIcon Data="{StaticResource RepoIcon}" />
|
||||
</Button>
|
||||
|
||||
<ToggleSwitch Command="{Binding ToggleThemeCommand}">
|
||||
<ToggleSwitch.OnContent>
|
||||
<PathIcon Data="{StaticResource DarkThemeIcon}" />
|
||||
</ToggleSwitch.OnContent>
|
||||
<ToggleSwitch.OffContent>
|
||||
<PathIcon Data="{StaticResource LightThemeIcon}" />
|
||||
</ToggleSwitch.OffContent>
|
||||
</ToggleSwitch>
|
||||
<ToggleSwitch
|
||||
Command="{Binding ToggleThemeCommand}"
|
||||
OnContent="{StaticResource DarkThemeIcon}"
|
||||
OffContent="{StaticResource LightThemeIcon}" />
|
||||
|
||||
<Button>
|
||||
<PathIcon Data="{StaticResource MenuIcon}" />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user