zhusenlin/Semi.Avalonia
1
0
Fork 0
mirror of https://gitcode.com/gh_mirrors/se/Semi.Avalonia synced 2026-04-27 11:43:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: redesign ButtonToggleSwitch.

Browse Source
This commit is contained in:
Zhang Dian
2024-12-01 17:19:09 +08:00
parent 147d4fd968
commit 3c8854f9de
4 changed files with 132 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -8,22 +8,23 @@
d:DesignWidth="800"
mc:Ignorable="d">
<StackPanel Spacing="8" Margin="20">
<ToggleSwitch
Content="Content"
OffContent="OffContent"
OnContent="OnContent" />
<ToggleSwitch
Content="Content"
IsChecked="True"
IsEnabled="False"
OffContent="OffContent"
OnContent="OnContent" />
<ToggleSwitch
Content="Content"
IsChecked="False"
IsEnabled="False"
OffContent="OffContent"
OnContent="OnContent" />
<StackPanel Orientation="Horizontal">
<StackPanel>
<ToggleSwitch />
<ToggleSwitch IsChecked="True" />
</StackPanel>
<StackPanel>
<ToggleSwitch IsEnabled="False" />
<ToggleSwitch IsChecked="True" IsEnabled="False" />
</StackPanel>
</StackPanel>
<StackPanel Orientation="Horizontal">
<ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" />
<ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" IsChecked="True"/>
<ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" IsEnabled="False" />
<ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" IsEnabled="False" IsChecked="True" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small" />
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small" IsChecked="True" />
@@ -44,8 +45,8 @@
</StackPanel>
<StackPanel Orientation="Horizontal">
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开"/>
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜"/>
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" />
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" IsChecked="True" />
@@ -60,21 +61,35 @@
<ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" Classes="Large" IsChecked="True" />
</StackPanel>
<ToggleSwitch Theme="{DynamicResource ButtonToggleSwitch}">
<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 Orientation="Horizontal">
<ToggleSwitch
HorizontalAlignment="Left"
Padding="8"
Theme="{DynamicResource ButtonToggleSwitch}"
Foreground="{DynamicResource ButtonDefaultTertiaryForeground}">
<ToggleSwitch.Content>
<PathIcon
Theme="{DynamicResource InnerPathIcon}"
Data="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" />
</ToggleSwitch.Content>
</ToggleSwitch>
<ToggleSwitch
HorizontalAlignment="Left"
Padding="8"
Theme="{DynamicResource ButtonToggleSwitch}"
Foreground="{DynamicResource ButtonDefaultTertiaryForeground}">
<ToggleSwitch.OnContent>
<PathIcon
Theme="{DynamicResource InnerPathIcon}"
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" />
</ToggleSwitch.OnContent>
<ToggleSwitch.OffContent>
<PathIcon
Theme="{DynamicResource InnerPathIcon}"
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" />
</ToggleSwitch.OffContent>
</ToggleSwitch>
</StackPanel>
</StackPanel>
</UserControl>