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

Merge pull request #694 from irihitech/AIButton

Browse Source 
add AI style - Colorful Button
This commit is contained in:
Dong Bin
2025-11-11 16:07:11 +08:00
committed by GitHub
parent 301a4e954c 4c7caa6dbf
commit 5f8357ecbc
11 changed files with 756 additions and 392 deletions
Download Patch File Download Diff File Expand all files Collapse all files

509
demo/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml
View File

@@ -6,174 +6,369 @@
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<ScrollViewer>
<StackPanel HorizontalAlignment="Left" Spacing="20">
<StackPanel HorizontalAlignment="Left" Spacing="8">
<StackPanel.Styles>
<Style Selector="SplitButton">
<Setter Property="Flyout">
<MenuFlyout Placement="BottomEdgeAlignedRight">
<MenuItem Header="Submit All" />
<MenuItem Header="Submit Updated" />
</MenuFlyout>
</Setter>
</Style>
<Style Selector="DropDownButton">
<Setter Property="Flyout">
<MenuFlyout Placement="BottomEdgeAlignedRight">
<MenuItem Header="Submit All" />
<MenuItem Header="Submit Updated" />
</MenuFlyout>
</Setter>
</Style>
<Style Selector="ToggleSplitButton">
<Setter Property="Flyout">
<MenuFlyout Placement="BottomEdgeAlignedRight">
<Style Selector="SplitButton,DropDownButton,ToggleSplitButton">
<Setter Property="Button.Flyout">
<MenuFlyout>
<MenuItem Header="Submit All" />
<MenuItem Header="Submit Updated" />
</MenuFlyout>
</Setter>
</Style>
</StackPanel.Styles>
<HeaderedContentControl
Theme="{StaticResource GroupBox}">
<HeaderedContentControl.Header>
<StackPanel Spacing="8">
<TextBlock Text="Button/RepeatButton Theme" />
<WrapPanel ItemSpacing="4">
<TextBlock Text="Theme:" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Light" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Solid" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Outline" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Borderless" />
</WrapPanel>
<WrapPanel ItemSpacing="4">
<TextBlock Text="Classes:" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Primary" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Secondary" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Tertiary" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Success" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Warning" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Danger" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl.Header>
<StackPanel HorizontalAlignment="Left" Spacing="16">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Default" />
<Button Content="Primary" Classes="Primary" />
<Button Content="Secondary" Classes="Secondary" />
<Button Content="Tertiary" Classes="Tertiary" />
<Button Content="Success" Classes="Success" />
<Button Content="Warning" Classes="Warning" />
<Button Content="Danger" Classes="Danger" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Default" Theme="{StaticResource SolidButton}" />
<Button Content="Primary" Classes="Primary" Theme="{StaticResource SolidButton}" />
<Button Content="Secondary" Classes="Secondary" Theme="{StaticResource SolidButton}" />
<Button Content="Tertiary" Classes="Tertiary" Theme="{StaticResource SolidButton}" />
<Button Content="Success" Classes="Success" Theme="{StaticResource SolidButton}" />
<Button Content="Warning" Classes="Warning" Theme="{StaticResource SolidButton}" />
<Button Content="Danger" Classes="Danger" Theme="{StaticResource SolidButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Default" Theme="{StaticResource OutlineButton}" />
<Button Content="Primary" Classes="Primary" Theme="{StaticResource OutlineButton}" />
<Button Content="Secondary" Classes="Secondary" Theme="{StaticResource OutlineButton}" />
<Button Content="Tertiary" Classes="Tertiary" Theme="{StaticResource OutlineButton}" />
<Button Content="Success" Classes="Success" Theme="{StaticResource OutlineButton}" />
<Button Content="Warning" Classes="Warning" Theme="{StaticResource OutlineButton}" />
<Button Content="Danger" Classes="Danger" Theme="{StaticResource OutlineButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Default" Theme="{StaticResource BorderlessButton}" />
<Button Content="Primary" Classes="Primary" Theme="{StaticResource BorderlessButton}" />
<Button Content="Secondary" Classes="Secondary" Theme="{StaticResource BorderlessButton}" />
<Button Content="Tertiary" Classes="Tertiary" Theme="{StaticResource BorderlessButton}" />
<Button Content="Success" Classes="Success" Theme="{StaticResource BorderlessButton}" />
<Button Content="Warning" Classes="Warning" Theme="{StaticResource BorderlessButton}" />
<Button Content="Danger" Classes="Danger" Theme="{StaticResource BorderlessButton}" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl>
<TextBlock>Light (Default)</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary">Primary</Button>
<Button Classes="Secondary">Secondary</Button>
<Button Classes="Tertiary">Tertiary</Button>
<Button Classes="Success">Success</Button>
<Button Classes="Warning">Warning</Button>
<Button Classes="Danger">Danger</Button>
<Button Classes="Danger" IsEnabled="False">Disabled</Button>
</StackPanel>
<TextBlock>Solid</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary" Theme="{DynamicResource SolidButton}">Primary</Button>
<Button Classes="Secondary" Theme="{DynamicResource SolidButton}">Secondary</Button>
<Button Classes="Tertiary" Theme="{DynamicResource SolidButton}">Tertiary</Button>
<Button Classes="Success" Theme="{DynamicResource SolidButton}">Success</Button>
<Button Classes="Warning" Theme="{DynamicResource SolidButton}">Warning</Button>
<Button Classes="Danger" Theme="{DynamicResource SolidButton}">Danger</Button>
<Button
Classes="Danger"
IsEnabled="False"
Theme="{DynamicResource SolidButton}">
Disabled
</Button>
</StackPanel>
<TextBlock>Outline</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary" Theme="{DynamicResource OutlineButton}">Primary</Button>
<Button Classes="Secondary" Theme="{DynamicResource OutlineButton}">Secondary</Button>
<Button Classes="Tertiary" Theme="{DynamicResource OutlineButton}">Tertiary</Button>
<Button Classes="Success" Theme="{DynamicResource OutlineButton}">Success</Button>
<Button Classes="Warning" Theme="{DynamicResource OutlineButton}">Warning</Button>
<Button Classes="Danger" Theme="{DynamicResource OutlineButton}">Danger</Button>
<Button Classes="Danger" Theme="{DynamicResource OutlineButton}" IsEnabled="False">Disabled</Button>
</StackPanel>
<TextBlock>Borderless</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary" Theme="{DynamicResource BorderlessButton}">Primary</Button>
<Button Classes="Secondary" Theme="{DynamicResource BorderlessButton}">Secondary</Button>
<Button Classes="Tertiary" Theme="{DynamicResource BorderlessButton}">Tertiary</Button>
<Button Classes="Success" Theme="{DynamicResource BorderlessButton}">Success</Button>
<Button Classes="Warning" Theme="{DynamicResource BorderlessButton}">Warning</Button>
<Button Classes="Danger" Theme="{DynamicResource BorderlessButton}">Danger</Button>
<Button
Classes="Danger"
IsEnabled="False"
Theme="{DynamicResource BorderlessButton}">
Disabled
</Button>
</StackPanel>
<TextBlock>Disabled</TextBlock>
<StackPanel Background="{DynamicResource SemiColorBackground1}" Orientation="Horizontal" Spacing="20">
<Button IsEnabled="False">Light</Button>
<Button IsEnabled="False" Theme="{DynamicResource SolidButton}">Solid</Button>
<Button IsEnabled="False" Theme="{DynamicResource OutlineButton}">Outline</Button>
<Button IsEnabled="False" Theme="{DynamicResource BorderlessButton}">Borderless</Button>
</StackPanel>
<TextBlock>Size Classes</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary Small">Small</Button>
<Button Classes="Primary">Default</Button>
<Button Classes="Primary Large">Large</Button>
</StackPanel>
<HeaderedContentControl
Theme="{StaticResource GroupBox}"
Header="Prohibited Status">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Light" IsEnabled="False" />
<Button Content="Solid" IsEnabled="False" Theme="{StaticResource SolidButton}" />
<Button Content="Outline" IsEnabled="False" Theme="{StaticResource OutlineButton}" />
<Button Content="Borderless" IsEnabled="False" Theme="{StaticResource BorderlessButton}" />
</WrapPanel>
</HeaderedContentControl>
<TextBlock>DropDownButton</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="8">
<DropDownButton Content="Primary" />
<DropDownButton Classes="Secondary" Content="Secondary" />
<DropDownButton Classes="Tertiary" Content="Tertiary" />
<DropDownButton Classes="Success" Content="Success" />
<DropDownButton Classes="Warning" Content="Warning" />
<DropDownButton Classes="Danger" Content="Danger" />
<DropDownButton
Classes="Danger"
Content="Disabled"
IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="8">
<DropDownButton Content="Default" Classes="Success" />
<DropDownButton Content="Solid" Theme="{DynamicResource SolidDropDownButton}" Classes="Success" />
<DropDownButton Content="Outline" Theme="{DynamicResource OutlineDropDownButton}" Classes="Success" />
<DropDownButton Content="Borderless" Theme="{DynamicResource BorderlessDropDownButton}" Classes="Success" />
<DropDownButton Content="Default" Classes="Success" IsEnabled="False" />
<DropDownButton Content="Solid" Theme="{DynamicResource SolidDropDownButton}" Classes="Success" IsEnabled="False" />
<DropDownButton Content="Outline" Theme="{DynamicResource OutlineDropDownButton}" Classes="Success" IsEnabled="False" />
<DropDownButton Content="Borderless" Theme="{DynamicResource BorderlessDropDownButton}" Classes="Success" IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="8">
<DropDownButton Classes="Small" Content="Small" />
<DropDownButton Content="Default" />
<DropDownButton Classes="Large" Content="Large" />
</StackPanel>
<HeaderedContentControl
Theme="{StaticResource GroupBox}">
<HeaderedContentControl.Header>
<StackPanel Spacing="8">
<WrapPanel ItemSpacing="4">
<TextBlock Text="Size Classes:" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Large" />
<Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Small" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl.Header>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Large" Classes="Large" />
<Button Content="Default" />
<Button Content="Small" Classes="Small" />
</WrapPanel>
</HeaderedContentControl>
<TextBlock>SplitButton</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="8">
<SplitButton Content="Primary" />
<SplitButton Classes="Secondary" Content="Secondary" />
<SplitButton Classes="Tertiary" Content="Tertiary" />
<SplitButton Classes="Success" Content="Success" />
<SplitButton Classes="Warning" Content="Warning" />
<SplitButton Classes="Danger" Content="Danger" />
<SplitButton Classes="Danger" Content="Disabled" IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="8">
<SplitButton Content="Default" Classes="Success" />
<SplitButton Content="Solid" Theme="{DynamicResource SolidSplitButton}" Classes="Success" />
<SplitButton Content="Outline" Theme="{DynamicResource OutlineSplitButton}" Classes="Success" />
<SplitButton Content="Borderless" Theme="{DynamicResource BorderlessSplitButton}" Classes="Success" />
<SplitButton Content="Default" Classes="Success" IsEnabled="False" />
<SplitButton Content="Solid" Theme="{DynamicResource SolidSplitButton}" Classes="Success" IsEnabled="False" />
<SplitButton Content="Outline" Theme="{DynamicResource OutlineSplitButton}" Classes="Success" IsEnabled="False" />
<SplitButton Content="Borderless" Theme="{DynamicResource BorderlessSplitButton}" Classes="Success" IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="8">
<SplitButton Classes="Small" Content="Small" />
<SplitButton Content="Default" />
<SplitButton Classes="Large" Content="Large" />
</StackPanel>
<HeaderedContentControl
Theme="{StaticResource GroupBox}">
<HeaderedContentControl.Header>
<StackPanel Spacing="8">
<TextBlock Text="AI style - Colorful buttons" />
<WrapPanel ItemSpacing="4">
<TextBlock Text="Theme:" />
<Label Theme="{StaticResource TagLabel}" Classes="Colorful Solid" Content="Light" />
<Label Theme="{StaticResource TagLabel}" Classes="Colorful Solid" Content="Solid" />
<Label Theme="{StaticResource TagLabel}" Classes="Colorful Solid" Content="Outline" />
<Label Theme="{StaticResource TagLabel}" Classes="Colorful Solid" Content="Borderless" />
</WrapPanel>
<WrapPanel ItemSpacing="4">
<TextBlock Text="Classes:" />
<Label Theme="{StaticResource TagLabel}" Classes="Colorful" Content="Colorful Primary" />
<Label Theme="{StaticResource TagLabel}" Classes="Colorful" Content="Colorful Tertiary" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl.Header>
<StackPanel HorizontalAlignment="Left" Spacing="16">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Primary" Classes="Colorful Primary" />
<Button Content="Tertiary" Classes="Colorful Tertiary" />
<Button Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Primary" Classes="Colorful Primary" Theme="{StaticResource SolidButton}" />
<Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource SolidButton}" />
<Button Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource SolidButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Primary" Classes="Colorful Primary" Theme="{StaticResource OutlineButton}" />
<Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource OutlineButton}" />
<Button Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource OutlineButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<Button Content="Primary" Classes="Colorful Primary" Theme="{StaticResource BorderlessButton}" />
<Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource BorderlessButton}" />
<Button Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource BorderlessButton}" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl>
<TextBlock>ToggleSplitButton</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="8">
<ToggleSplitButton Content="Primary" />
<ToggleSplitButton Classes="Secondary" Content="Secondary" />
<ToggleSplitButton Classes="Tertiary" Content="Tertiary" />
<ToggleSplitButton Classes="Success" Content="Success" />
<ToggleSplitButton Classes="Warning" Content="Warning" />
<ToggleSplitButton Classes="Danger" Content="Danger" />
<ToggleSplitButton Classes="Danger" Content="Disabled" IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="8">
<ToggleSplitButton Content="Default" Classes="Success" />
<ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" />
<ToggleSplitButton Content="Default" Classes="Success" IsEnabled="False" />
<ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="8">
<ToggleSplitButton Classes="Small" Content="Small" />
<ToggleSplitButton Content="Default" />
<ToggleSplitButton Classes="Large" Content="Large" />
</StackPanel>
<HeaderedContentControl
Theme="{StaticResource GroupBox}" Header="DropDownButton">
<StackPanel HorizontalAlignment="Left" Spacing="16">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Default" />
<DropDownButton Content="Primary" Classes="Primary" />
<DropDownButton Content="Secondary" Classes="Secondary" />
<DropDownButton Content="Tertiary" Classes="Tertiary" />
<DropDownButton Content="Success" Classes="Success" />
<DropDownButton Content="Warning" Classes="Warning" />
<DropDownButton Content="Danger" Classes="Danger" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Default" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Primary" Classes="Primary" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Secondary" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Success" Classes="Success" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Warning" Classes="Warning" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Danger" Classes="Danger" Theme="{StaticResource SolidDropDownButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Default" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Primary" Classes="Primary" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Secondary" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Success" Classes="Success" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Warning" Classes="Warning" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Danger" Classes="Danger" Theme="{StaticResource OutlineDropDownButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Default" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Primary" Classes="Primary" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Secondary" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Success" Classes="Success" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Warning" Classes="Warning" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Danger" Classes="Danger" Theme="{StaticResource BorderlessDropDownButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Light" IsEnabled="False" />
<DropDownButton Content="Solid" IsEnabled="False" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Outline" IsEnabled="False" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Borderless" IsEnabled="False" Theme="{StaticResource BorderlessDropDownButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Large" Classes="Large" />
<DropDownButton Content="Default" />
<DropDownButton Content="Small" Classes="Small" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Primary" Classes="Colorful Primary" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource SolidDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource SolidDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource OutlineDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource OutlineDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource BorderlessDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource BorderlessDropDownButton}" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl>
<HeaderedContentControl
Theme="{StaticResource GroupBox}" Header="SplitButton">
<StackPanel HorizontalAlignment="Left" Spacing="16">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<SplitButton Content="Default" />
<SplitButton Content="Primary" Classes="Primary" />
<SplitButton Content="Secondary" Classes="Secondary" />
<SplitButton Content="Tertiary" Classes="Tertiary" />
<SplitButton Content="Success" Classes="Success" />
<SplitButton Content="Warning" Classes="Warning" />
<SplitButton Content="Danger" Classes="Danger" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<SplitButton Content="Default" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Primary" Classes="Primary" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Secondary" Classes="Secondary" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Success" Classes="Success" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Warning" Classes="Warning" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Danger" Classes="Danger" Theme="{StaticResource SolidSplitButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<SplitButton Content="Default" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Primary" Classes="Primary" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Secondary" Classes="Secondary" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Success" Classes="Success" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Warning" Classes="Warning" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Danger" Classes="Danger" Theme="{StaticResource OutlineSplitButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<SplitButton Content="Default" Theme="{StaticResource BorderlessSplitButton}" />
<SplitButton Content="Primary" Classes="Primary" Theme="{StaticResource BorderlessSplitButton}" />
<SplitButton Content="Secondary" Classes="Secondary" Theme="{StaticResource BorderlessSplitButton}" />
<SplitButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource BorderlessSplitButton}" />
<SplitButton Content="Success" Classes="Success" Theme="{StaticResource BorderlessSplitButton}" />
<SplitButton Content="Warning" Classes="Warning" Theme="{StaticResource BorderlessSplitButton}" />
<SplitButton Content="Danger" Classes="Danger" Theme="{StaticResource BorderlessSplitButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<SplitButton Content="Light" IsEnabled="False" />
<SplitButton Content="Solid" IsEnabled="False" Theme="{StaticResource SolidSplitButton}" />
<SplitButton Content="Outline" IsEnabled="False" Theme="{StaticResource OutlineSplitButton}" />
<SplitButton Content="Borderless" IsEnabled="False" Theme="{StaticResource BorderlessSplitButton}" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<SplitButton Content="Large" Classes="Large" />
<SplitButton Content="Default" />
<SplitButton Content="Small" Classes="Small" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl>
<HeaderedContentControl
Theme="{StaticResource GroupBox}"
Header="ToggleSplitButton">
<StackPanel HorizontalAlignment="Left" Spacing="24">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleSplitButton Content="Default" />
<ToggleSplitButton Classes="Primary" Content="Primary" />
<ToggleSplitButton Classes="Secondary" Content="Secondary" />
<ToggleSplitButton Classes="Tertiary" Content="Tertiary" />
<ToggleSplitButton Classes="Success" Content="Success" />
<ToggleSplitButton Classes="Warning" Content="Warning" />
<ToggleSplitButton Classes="Danger" Content="Danger" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleSplitButton Content="Default" IsChecked="True" />
<ToggleSplitButton Classes="Primary" Content="Primary" IsChecked="True" />
<ToggleSplitButton Classes="Secondary" Content="Secondary" IsChecked="True" />
<ToggleSplitButton Classes="Tertiary" Content="Tertiary" IsChecked="True" />
<ToggleSplitButton Classes="Success" Content="Success" IsChecked="True" />
<ToggleSplitButton Classes="Warning" Content="Warning" IsChecked="True" />
<ToggleSplitButton Classes="Danger" Content="Danger" IsChecked="True" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleSplitButton Content="Unchecked" Classes="Success" IsEnabled="False" />
<ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleSplitButton Content="Large" Classes="Large" />
<ToggleSplitButton Content="Default" />
<ToggleSplitButton Content="Small" Classes="Small" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl>
<HeaderedContentControl
Theme="{StaticResource GroupBox}" Header="ToggleButton">
<StackPanel HorizontalAlignment="Left" Spacing="16">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" />
<ToggleButton Content="Primary" Classes="Primary" />
<ToggleButton Content="Secondary" Classes="Secondary" />
<ToggleButton Content="Tertiary" Classes="Tertiary" />
<ToggleButton Content="Success" Classes="Success" />
<ToggleButton Content="Warning" Classes="Warning" />
<ToggleButton Content="Danger" Classes="Danger" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" IsChecked="True" />
<ToggleButton Content="Primary" Classes="Primary" IsChecked="True" />
<ToggleButton Content="Secondary" Classes="Secondary" IsChecked="True" />
<ToggleButton Content="Tertiary" Classes="Tertiary" IsChecked="True" />
<ToggleButton Content="Success" Classes="Success" IsChecked="True" />
<ToggleButton Content="Warning" Classes="Warning" IsChecked="True" />
<ToggleButton Content="Danger" Classes="Danger" IsChecked="True" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Primary" Classes="Primary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Secondary" Classes="Secondary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Tertiary" Classes="Tertiary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Success" Classes="Success" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Warning" Classes="Warning" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Danger" Classes="Danger" IsChecked="{x:Null}" IsThreeState="True" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Unchecked" IsEnabled="False" />
<ToggleButton Content="Checked" IsEnabled="False" IsChecked="True" />
<ToggleButton Content="Indeterminate" IsEnabled="False" IsChecked="{x:Null}" IsThreeState="True" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Large" Classes="Large" />
<ToggleButton Content="Default" />
<ToggleButton Content="Small" Classes="Small" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Primary" Classes="Colorful Primary" />
<ToggleButton Content="Tertiary" Classes="Colorful Tertiary" />
<ToggleButton Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Primary" Classes="Colorful Primary" IsChecked="True" />
<ToggleButton Content="Tertiary" Classes="Colorful Tertiary" IsChecked="True" />
<ToggleButton Content="Disabled" Classes="Colorful Primary" IsChecked="True" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Primary" Classes="Colorful Primary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Tertiary" Classes="Colorful Tertiary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Disabled" Classes="Colorful Primary" IsChecked="{x:Null}" IsThreeState="True" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</HeaderedContentControl>
</StackPanel>
</ScrollViewer>
</UserControl>

80
demo/Semi.Avalonia.Demo/Pages/RepeatButtonDemo.axaml
View File

@@ -1,80 +0,0 @@
<UserControl
x:Class="Semi.Avalonia.Demo.Pages.RepeatButtonDemo"
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 HorizontalAlignment="Left" Spacing="20">
<TextBlock>Light (Default)</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<RepeatButton Classes="Primary">Primary</RepeatButton>
<RepeatButton Classes="Secondary">Secondary</RepeatButton>
<RepeatButton Classes="Tertiary">Tertiary</RepeatButton>
<RepeatButton Classes="Success">Success</RepeatButton>
<RepeatButton Classes="Warning">Warning</RepeatButton>
<RepeatButton Classes="Danger">Danger</RepeatButton>
<RepeatButton Classes="Danger" IsEnabled="False">Disabled</RepeatButton>
</StackPanel>
<TextBlock>Solid</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<RepeatButton Classes="Primary" Theme="{DynamicResource SolidRepeatButton}">Primary</RepeatButton>
<RepeatButton Classes="Secondary" Theme="{DynamicResource SolidRepeatButton}">Secondary</RepeatButton>
<RepeatButton Classes="Tertiary" Theme="{DynamicResource SolidRepeatButton}">Tertiary</RepeatButton>
<RepeatButton Classes="Success" Theme="{DynamicResource SolidRepeatButton}">Success</RepeatButton>
<RepeatButton Classes="Warning" Theme="{DynamicResource SolidRepeatButton}">Warning</RepeatButton>
<RepeatButton Classes="Danger" Theme="{DynamicResource SolidRepeatButton}">Danger</RepeatButton>
<RepeatButton
Classes="Danger"
IsEnabled="False"
Theme="{DynamicResource SolidRepeatButton}">
Disabled
</RepeatButton>
</StackPanel>
<TextBlock>Outline</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<RepeatButton Classes="Primary" Theme="{DynamicResource OutlineRepeatButton}">Primary</RepeatButton>
<RepeatButton Classes="Secondary" Theme="{DynamicResource OutlineRepeatButton}">Secondary</RepeatButton>
<RepeatButton Classes="Tertiary" Theme="{DynamicResource OutlineRepeatButton}">Tertiary</RepeatButton>
<RepeatButton Classes="Success" Theme="{DynamicResource OutlineRepeatButton}">Success</RepeatButton>
<RepeatButton Classes="Warning" Theme="{DynamicResource OutlineRepeatButton}">Warning</RepeatButton>
<RepeatButton Classes="Danger" Theme="{DynamicResource OutlineRepeatButton}">Danger</RepeatButton>
<RepeatButton
Classes="Danger"
IsEnabled="False"
Theme="{DynamicResource OutlineRepeatButton}">
Disabled
</RepeatButton>
</StackPanel>
<TextBlock>Borderless</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<RepeatButton Classes="Primary" Theme="{DynamicResource BorderlessRepeatButton}">Primary</RepeatButton>
<RepeatButton Classes="Secondary" Theme="{DynamicResource BorderlessRepeatButton}">Secondary</RepeatButton>
<RepeatButton Classes="Tertiary" Theme="{DynamicResource BorderlessRepeatButton}">Tertiary</RepeatButton>
<RepeatButton Classes="Success" Theme="{DynamicResource BorderlessRepeatButton}">Success</RepeatButton>
<RepeatButton Classes="Warning" Theme="{DynamicResource BorderlessRepeatButton}">Warning</RepeatButton>
<RepeatButton Classes="Danger" Theme="{DynamicResource BorderlessRepeatButton}">Danger</RepeatButton>
<RepeatButton
Classes="Danger"
IsEnabled="False"
Theme="{DynamicResource BorderlessRepeatButton}">
Disabled
</RepeatButton>
</StackPanel>
<TextBlock>Disabled</TextBlock>
<StackPanel Background="{DynamicResource SemiColorBackground1}" Orientation="Horizontal" Spacing="20">
<Button IsEnabled="False">Light</Button>
<Button IsEnabled="False" Theme="{DynamicResource SolidButton}">Solid</Button>
<Button IsEnabled="False" Theme="{DynamicResource OutlineButton}">Outline</Button>
<Button IsEnabled="False" Theme="{DynamicResource BorderlessButton}">Borderless</Button>
</StackPanel>
<TextBlock>Size Classes</TextBlock>
<StackPanel Orientation="Horizontal" Spacing="20">
<RepeatButton Classes="Small">Small</RepeatButton>
<RepeatButton>Default</RepeatButton>
<RepeatButton Classes="Large">Large</RepeatButton>
</StackPanel>
</StackPanel>
</UserControl>

11
demo/Semi.Avalonia.Demo/Pages/RepeatButtonDemo.axaml.cs
View File

@@ -1,11 +0,0 @@
using Avalonia.Controls;
namespace Semi.Avalonia.Demo.Pages;
public partial class RepeatButtonDemo : UserControl
{
public RepeatButtonDemo()
{
InitializeComponent();
}
}

98
demo/Semi.Avalonia.Demo/Pages/ToggleButtonDemo.axaml
View File

@@ -1,98 +0,0 @@
<UserControl
x:Class="Semi.Avalonia.Demo.Pages.ToggleButtonDemo"
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 Spacing="20">
<TextBlock Text="Toggle Button (Default)" />
<StackPanel Orientation="Horizontal" Spacing="20">
<ToggleButton>Default</ToggleButton>
<ToggleButton Classes="Primary">Primary</ToggleButton>
<ToggleButton Classes="Secondary">Secondary</ToggleButton>
<ToggleButton Classes="Tertiary">Tertiary</ToggleButton>
<ToggleButton Classes="Success">Success</ToggleButton>
<ToggleButton Classes="Warning">Warning</ToggleButton>
<ToggleButton Classes="Danger">Danger</ToggleButton>
<ToggleButton Classes="Danger" IsEnabled="False">Disabled</ToggleButton>
</StackPanel>
<TextBlock Text="Toggle Button Checked State" />
<StackPanel Orientation="Horizontal" Spacing="20">
<ToggleButton IsChecked="True">Default</ToggleButton>
<ToggleButton Classes="Primary" IsChecked="True">Primary</ToggleButton>
<ToggleButton Classes="Secondary" IsChecked="True">Secondary</ToggleButton>
<ToggleButton Classes="Tertiary" IsChecked="True">Tertiary</ToggleButton>
<ToggleButton Classes="Success" IsChecked="True">Success</ToggleButton>
<ToggleButton Classes="Warning" IsChecked="True">Warning</ToggleButton>
<ToggleButton Classes="Danger" IsChecked="True">Danger</ToggleButton>
<ToggleButton
Classes="Danger"
IsChecked="True"
IsEnabled="False">
Disabled
</ToggleButton>
</StackPanel>
<TextBlock Text="Toggle Button Three State" />
<StackPanel Orientation="Horizontal" Spacing="20">
<ToggleButton IsChecked="{x:Null}" IsThreeState="True">Default</ToggleButton>
<ToggleButton
Classes="Primary"
IsChecked="{x:Null}"
IsThreeState="True">
Primary
</ToggleButton>
<ToggleButton
Classes="Secondary"
IsChecked="{x:Null}"
IsThreeState="True">
Secondary
</ToggleButton>
<ToggleButton
Classes="Tertiary"
IsChecked="{x:Null}"
IsThreeState="True">
Tertiary
</ToggleButton>
<ToggleButton
Classes="Success"
IsChecked="{x:Null}"
IsThreeState="True">
Success
</ToggleButton>
<ToggleButton
Classes="Warning"
IsChecked="{x:Null}"
IsThreeState="True">
Warning
</ToggleButton>
<ToggleButton
Classes="Danger"
IsChecked="{x:Null}"
IsThreeState="True">
Danger
</ToggleButton>
<ToggleButton
Classes="Danger"
IsChecked="{x:Null}"
IsEnabled="False"
IsThreeState="True">
Disabled
</ToggleButton>
</StackPanel>
<TextBlock Text="Toggle Button Disabled State" />
<StackPanel Background="{DynamicResource SemiColorBackground1}" Orientation="Horizontal" Spacing="20">
<ToggleButton IsThreeState="True" IsEnabled="False">Default</ToggleButton>
<ToggleButton IsThreeState="True" IsEnabled="False" IsChecked="True">Checked</ToggleButton>
<ToggleButton IsThreeState="True" IsEnabled="False" IsChecked="{x:Null}">Indeterminate</ToggleButton>
</StackPanel>
<TextBlock Text="Toggle Button Size" />
<StackPanel Orientation="Horizontal" Spacing="20">
<ToggleButton Classes="Small" IsThreeState="True">Small</ToggleButton>
<ToggleButton IsThreeState="True">Default</ToggleButton>
<ToggleButton Classes="Large" IsThreeState="True">Large</ToggleButton>
</StackPanel>
</StackPanel>
</UserControl>

11
demo/Semi.Avalonia.Demo/Pages/ToggleButtonDemo.axaml.cs
View File

@@ -1,11 +0,0 @@
using Avalonia.Controls;
namespace Semi.Avalonia.Demo.Pages;
public partial class ToggleButtonDemo : UserControl
{
public ToggleButtonDemo()
{
InitializeComponent();
}
}

6
demo/Semi.Avalonia.Demo/Views/MainView.axaml
View File

@@ -161,15 +161,9 @@
<TabItem Header="Button">
<pages:ButtonDemo />
</TabItem>
<TabItem Header="RepeatButton">
<pages:RepeatButtonDemo />
</TabItem>
<TabItem Header="HyperlinkButton">
<pages:HyperlinkButtonDemo />
</TabItem>
<TabItem Header="ToggleButton">
<pages:ToggleButtonDemo />
</TabItem>
<TabItem Header="CheckBox">
<pages:CheckBoxDemo />
</TabItem>

142
src/Semi.Avalonia/Controls/Button.axaml
View File

@@ -1,11 +1,97 @@
<ResourceDictionary
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Button Theme Key: Light, Solid, Outline, Borderless; Default is Light -->
<!-- Button Default Classes: Primary, Secondary, Tertiary, Success, Warning, Danger; Default is Primary -->
<!-- State: default, pointerover, pressed, disabled -->
<!-- Theme: Light, Solid, Outline, Borderless; Default is Light -->
<!-- Color Classes: Primary, Secondary, Tertiary, Success, Warning, Danger; Default is Primary -->
<!-- Size Classes: Large, Small -->
<!-- AI style Classes: Colorful -->
<!-- PseudoClasses: :pointerover, :pressed, :disabled -->
<Design.PreviewWith>
<StackPanel Margin="16" Spacing="16">
<WrapPanel ItemSpacing="16">
<Button Content="Default" />
<Button Content="Primary" Classes="Primary" />
<Button Content="Secondary" Classes="Secondary" />
<Button Content="Tertiary" Classes="Tertiary" />
<Button Content="Success" Classes="Success" />
<Button Content="Warning" Classes="Warning" />
<Button Content="Danger" Classes="Danger" />
<Button Content="Disabled" Classes="Danger" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Theme="{DynamicResource SolidButton}" />
<Button Content="Primary" Classes="Primary" Theme="{DynamicResource SolidButton}" />
<Button Content="Secondary" Classes="Secondary" Theme="{DynamicResource SolidButton}" />
<Button Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource SolidButton}" />
<Button Content="Success" Classes="Success" Theme="{DynamicResource SolidButton}" />
<Button Content="Warning" Classes="Warning" Theme="{DynamicResource SolidButton}" />
<Button Content="Danger" Classes="Danger" Theme="{DynamicResource SolidButton}" />
<Button Content="Disabled" Classes="Danger" Theme="{DynamicResource SolidButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Theme="{DynamicResource OutlineButton}" />
<Button Content="Primary" Classes="Primary" Theme="{DynamicResource OutlineButton}" />
<Button Content="Secondary" Classes="Secondary" Theme="{DynamicResource OutlineButton}" />
<Button Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource OutlineButton}" />
<Button Content="Success" Classes="Success" Theme="{DynamicResource OutlineButton}" />
<Button Content="Warning" Classes="Warning" Theme="{DynamicResource OutlineButton}" />
<Button Content="Danger" Classes="Danger" Theme="{DynamicResource OutlineButton}" />
<Button Content="Disabled" Classes="Danger" Theme="{DynamicResource OutlineButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Primary" Classes="Primary" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Secondary" Classes="Secondary" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Success" Classes="Success" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Warning" Classes="Warning" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Danger" Classes="Danger" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Disabled" Classes="Danger" Theme="{DynamicResource BorderlessButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Classes="Colorful" />
<Button Content="Primary" Classes="Colorful Primary" />
<Button Content="Secondary" Classes="Colorful Secondary" />
<Button Content="Tertiary" Classes="Colorful Tertiary" />
<Button Content="Success" Classes="Colorful Success" />
<Button Content="Warning" Classes="Colorful Warning" />
<Button Content="Danger" Classes="Colorful Danger" />
<Button Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Classes="Colorful" Theme="{DynamicResource SolidButton}" />
<Button Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource SolidButton}" />
<Button Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource SolidButton}" />
<Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource SolidButton}" />
<Button Content="Success" Classes="Colorful Success" Theme="{DynamicResource SolidButton}" />
<Button Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource SolidButton}" />
<Button Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource SolidButton}" />
<Button Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource SolidButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Classes="Colorful" Theme="{DynamicResource OutlineButton}" />
<Button Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource OutlineButton}" />
<Button Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource OutlineButton}" />
<Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource OutlineButton}" />
<Button Content="Success" Classes="Colorful Success" Theme="{DynamicResource OutlineButton}" />
<Button Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource OutlineButton}" />
<Button Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource OutlineButton}" />
<Button Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource OutlineButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<Button Content="Default" Classes="Colorful" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Success" Classes="Colorful Success" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource BorderlessButton}" />
<Button Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource BorderlessButton}" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</Design.PreviewWith>
<!-- Button Light -->
<ControlTheme x:Key="{x:Type Button}" TargetType="Button">
<Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
<Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
@@ -68,6 +154,12 @@
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultColorfulPrimaryForeground}" />
</Style>
</Style>
<Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
@@ -209,6 +301,39 @@
</Style>
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
</Style>
<Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
</Style>
</Style>
<Style Selector="^.Tertiary">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidColorfulTertiaryForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
</Style>
<Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
</Style>
</Style>
</Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidDisabledForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
@@ -241,6 +366,14 @@
<Style Selector="^.Danger /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonOutlineColorfulPrimaryForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineColorfulPrimaryBorderBrush}" />
</Style>
</Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
@@ -261,7 +394,6 @@
<Setter Property="Background" Value="{DynamicResource ButtonBorderlessBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderlessBorderBrush}" />
</Style>
</ControlTheme>
<ControlTheme x:Key="InnerIconButton" TargetType="Button">

143
src/Semi.Avalonia/Controls/DropDownButton.axaml
View File

@@ -2,16 +2,90 @@
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Design.PreviewWith>
<StackPanel Margin="20">
<DropDownButton Content="Button" />
<DropDownButton Classes="Primary" Content="Button" />
<DropDownButton Classes="Secondary" Content="Button" />
<DropDownButton IsEnabled="False" Classes="Tertiary" Content="Button" />
<DropDownButton Theme="{DynamicResource SolidDropDownButton}" Classes="Success" Content="Button" />
<DropDownButton Theme="{DynamicResource OutlineDropDownButton}" Classes="Warning" Content="Button" />
<DropDownButton Theme="{DynamicResource BorderlessDropDownButton}" Classes="Danger" Content="Button" />
<StackPanel Margin="16" Spacing="16">
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" />
<DropDownButton Content="Primary" Classes="Primary" />
<DropDownButton Content="Secondary" Classes="Secondary" />
<DropDownButton Content="Tertiary" Classes="Tertiary" />
<DropDownButton Content="Success" Classes="Success" />
<DropDownButton Content="Warning" Classes="Warning" />
<DropDownButton Content="Danger" Classes="Danger" />
<DropDownButton Content="Disabled" Classes="Danger" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Primary" Classes="Primary" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Secondary" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Success" Classes="Success" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Warning" Classes="Warning" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Danger" Classes="Danger" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Danger" Theme="{DynamicResource SolidDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Primary" Classes="Primary" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Secondary" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Success" Classes="Success" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Warning" Classes="Warning" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Danger" Classes="Danger" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Danger" Theme="{DynamicResource OutlineDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Primary" Classes="Primary" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Secondary" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Success" Classes="Success" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Warning" Classes="Warning" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Danger" Classes="Danger" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Danger" Theme="{DynamicResource BorderlessDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Classes="Colorful" />
<DropDownButton Content="Primary" Classes="Colorful Primary" />
<DropDownButton Content="Secondary" Classes="Colorful Secondary" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" />
<DropDownButton Content="Success" Classes="Colorful Success" />
<DropDownButton Content="Warning" Classes="Colorful Warning" />
<DropDownButton Content="Danger" Classes="Colorful Danger" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Classes="Colorful" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Success" Classes="Colorful Success" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource SolidDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource SolidDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Classes="Colorful" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Success" Classes="Colorful Success" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource OutlineDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource OutlineDropDownButton}" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16">
<DropDownButton Content="Default" Classes="Colorful" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Success" Classes="Colorful Success" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource BorderlessDropDownButton}" />
<DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource BorderlessDropDownButton}" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</Design.PreviewWith>
<ControlTheme x:Key="{x:Type DropDownButton}" TargetType="DropDownButton">
<Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
<Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
@@ -36,13 +110,12 @@
Padding="{TemplateBinding Padding}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<DockPanel>
<DockPanel HorizontalSpacing="8">
<PathIcon
Name="DropDownGlyph"
DockPanel.Dock="Right"
Theme="{DynamicResource InnerPathIcon}"
HorizontalAlignment="Right"
Margin="8,0,0,0"
Data="{DynamicResource DropDownButtonIconGlyph}"
Foreground="{Binding #PART_ContentPresenter.Foreground}"
IsHitTestVisible="False"
@@ -84,6 +157,12 @@
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultColorfulPrimaryForeground}" />
</Style>
</Style>
<Style Selector="^:pointerover /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
@@ -243,6 +322,40 @@
</Style>
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary">
<Style Selector="^ /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
</Style>
<Style Selector="^:pointerover /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
</Style>
</Style>
<Style Selector="^.Tertiary">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidColorfulTertiaryForeground}" />
</Style>
<Style Selector="^ /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
</Style>
<Style Selector="^:pointerover /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ Border#PART_Background">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
</Style>
</Style>
</Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidDisabledForeground}" />
</Style>
@@ -277,6 +390,16 @@
<Style Selector="^.Danger /template/ Border#PART_Background">
<Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonOutlineColorfulPrimaryForeground}" />
</Style>
<Style Selector="^ /template/ Border#PART_Background">
<Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineColorfulPrimaryBorderBrush}" />
</Style>
</Style>
</Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
</Style>

116
src/Semi.Avalonia/Controls/ToggleButton.axaml
View File

@@ -2,20 +2,67 @@
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Design.PreviewWith>
<StackPanel Margin="20">
<ToggleButton Classes="Primary">Toggle</ToggleButton>
<ToggleButton Classes="Secondary">Toggle</ToggleButton>
<ToggleButton Classes="Tertiary">Toggle</ToggleButton>
<ToggleButton Classes="Success">Toggle</ToggleButton>
<ToggleButton Classes="Warning">Toggle</ToggleButton>
<ToggleButton Classes="Danger">Toggle</ToggleButton>
<ToggleButton Classes="Primary" IsThreeState="True">Toggle 3</ToggleButton>
<ToggleButton Classes="Secondary" IsThreeState="True">Toggle 3</ToggleButton>
<ToggleButton Classes="Tertiary" IsThreeState="True">Toggle 3</ToggleButton>
<ToggleButton Classes="Success" IsThreeState="True">Toggle 3</ToggleButton>
<ToggleButton Classes="Warning" IsThreeState="True">Toggle 3</ToggleButton>
<ToggleButton Classes="Danger" IsThreeState="True">Toggle 3</ToggleButton>
<StackPanel HorizontalAlignment="Left" Spacing="16">
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" />
<ToggleButton Content="Primary" Classes="Primary" />
<ToggleButton Content="Secondary" Classes="Secondary" />
<ToggleButton Content="Tertiary" Classes="Tertiary" />
<ToggleButton Content="Success" Classes="Success" />
<ToggleButton Content="Warning" Classes="Warning" />
<ToggleButton Content="Danger" Classes="Danger" />
<ToggleButton Content="Disabled" Classes="Danger" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" IsChecked="True" />
<ToggleButton Content="Primary" Classes="Primary" IsChecked="True" />
<ToggleButton Content="Secondary" Classes="Secondary" IsChecked="True" />
<ToggleButton Content="Tertiary" Classes="Tertiary" IsChecked="True" />
<ToggleButton Content="Success" Classes="Success" IsChecked="True" />
<ToggleButton Content="Warning" Classes="Warning" IsChecked="True" />
<ToggleButton Content="Danger" Classes="Danger" IsChecked="True" />
<ToggleButton Content="Disabled" Classes="Danger" IsChecked="True" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Primary" Classes="Primary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Secondary" Classes="Secondary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Tertiary" Classes="Tertiary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Success" Classes="Success" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Warning" Classes="Warning" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Danger" Classes="Danger" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Disabled" Classes="Danger" IsChecked="{x:Null}" IsThreeState="True" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" Classes="Colorful" />
<ToggleButton Content="Primary" Classes="Colorful Primary" />
<ToggleButton Content="Secondary" Classes="Colorful Secondary" />
<ToggleButton Content="Tertiary" Classes="Colorful Tertiary" />
<ToggleButton Content="Success" Classes="Colorful Success" />
<ToggleButton Content="Warning" Classes="Colorful Warning" />
<ToggleButton Content="Danger" Classes="Colorful Danger" />
<ToggleButton Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" Classes="Colorful" IsChecked="True" />
<ToggleButton Content="Primary" Classes="Colorful Primary" IsChecked="True" />
<ToggleButton Content="Secondary" Classes="Colorful Secondary" IsChecked="True" />
<ToggleButton Content="Tertiary" Classes="Colorful Tertiary" IsChecked="True" />
<ToggleButton Content="Success" Classes="Colorful Success" IsChecked="True" />
<ToggleButton Content="Warning" Classes="Colorful Warning" IsChecked="True" />
<ToggleButton Content="Danger" Classes="Colorful Danger" IsChecked="True" />
<ToggleButton Content="Disabled" Classes="Colorful Primary" IsChecked="True" IsEnabled="False" />
</WrapPanel>
<WrapPanel ItemSpacing="16" LineSpacing="16">
<ToggleButton Content="Default" Classes="Colorful" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Primary" Classes="Colorful Primary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Secondary" Classes="Colorful Secondary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Tertiary" Classes="Colorful Tertiary" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Success" Classes="Colorful Success" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Warning" Classes="Colorful Warning" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Danger" Classes="Colorful Danger" IsChecked="{x:Null}" IsThreeState="True" />
<ToggleButton Content="Disabled" Classes="Colorful Primary" IsChecked="{x:Null}" IsThreeState="True" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</Design.PreviewWith>
<ControlTheme
@@ -136,6 +183,39 @@
</Style>
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
</Style>
<Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
</Style>
</Style>
<Style Selector="^.Tertiary">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidColorfulTertiaryForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
</Style>
<Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
</Style>
</Style>
</Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidDisabledForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
@@ -174,6 +254,14 @@
<Style Selector="^.Danger /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
</Style>
<Style Selector="^.Colorful">
<Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonOutlineColorfulPrimaryForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineColorfulPrimaryBorderBrush}" />
</Style>
</Style>
<Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
<Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />

16
src/Semi.Avalonia/Themes/Dark/Button.axaml
View File

@@ -71,6 +71,22 @@
<SolidColorBrush x:Key="ButtonBorderlessBackground" Color="Transparent" />
<SolidColorBrush x:Key="ButtonBorderlessBorderBrush" Color="Transparent" />
<!-- end Borderless -->
<!-- Colorful Classes -->
<StaticResource x:Key="ButtonDefaultColorfulPrimaryForeground" ResourceKey="SemiColorAIGeneral" />
<StaticResource x:Key="ButtonSolidColorfulPrimaryBackground" ResourceKey="SemiColorAIGeneral" />
<StaticResource x:Key="ButtonSolidColorfulPrimaryPointeroverBackground" ResourceKey="SemiColorAIGeneralPointerover" />
<StaticResource x:Key="ButtonSolidColorfulPrimaryPressedBackground" ResourceKey="SemiColorAIGeneralActive" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryForeground" ResourceKey="SemiColorAIGeneral" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryBackground" ResourceKey="SemiAIGeneral0" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryPointeroverBackground" ResourceKey="SemiAIGeneral1" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryPressedBackground" ResourceKey="SemiAIGeneral2" />
<StaticResource x:Key="ButtonOutlineColorfulPrimaryForeground" ResourceKey="SemiColorAIPurple" />
<StaticResource x:Key="ButtonOutlineColorfulPrimaryBorderBrush" ResourceKey="SemiColorAIPurple" />
<!-- end Colorful -->
<StaticResource x:Key="ButtonInputInnerForeground" ResourceKey="SemiColorText2" />
<StaticResource x:Key="ButtonInputInnerPointeroverForeground" ResourceKey="SemiColorPrimaryPointerover" />
<StaticResource x:Key="ButtonInputInnerPressedForeground" ResourceKey="SemiColorPrimaryActive" />

16
src/Semi.Avalonia/Themes/Light/Button.axaml
View File

@@ -71,6 +71,22 @@
<SolidColorBrush x:Key="ButtonBorderlessBackground" Color="Transparent" />
<SolidColorBrush x:Key="ButtonBorderlessBorderBrush" Color="Transparent" />
<!-- end Borderless -->
<!-- Colorful Classes -->
<StaticResource x:Key="ButtonDefaultColorfulPrimaryForeground" ResourceKey="SemiColorAIGeneral" />
<StaticResource x:Key="ButtonSolidColorfulPrimaryBackground" ResourceKey="SemiColorAIGeneral" />
<StaticResource x:Key="ButtonSolidColorfulPrimaryPointeroverBackground" ResourceKey="SemiColorAIGeneralPointerover" />
<StaticResource x:Key="ButtonSolidColorfulPrimaryPressedBackground" ResourceKey="SemiColorAIGeneralActive" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryForeground" ResourceKey="SemiColorAIGeneral" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryBackground" ResourceKey="SemiAIGeneral0" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryPointeroverBackground" ResourceKey="SemiAIGeneral1" />
<StaticResource x:Key="ButtonSolidColorfulTertiaryPressedBackground" ResourceKey="SemiAIGeneral2" />
<StaticResource x:Key="ButtonOutlineColorfulPrimaryForeground" ResourceKey="SemiColorAIPurple" />
<StaticResource x:Key="ButtonOutlineColorfulPrimaryBorderBrush" ResourceKey="SemiColorAIPurple" />
<!-- end Colorful -->
<StaticResource x:Key="ButtonInputInnerForeground" ResourceKey="SemiColorText2" />
<StaticResource x:Key="ButtonInputInnerPointeroverForeground" ResourceKey="SemiColorPrimaryPointerover" />
<StaticResource x:Key="ButtonInputInnerPressedForeground" ResourceKey="SemiColorPrimaryActive" />