From 94b30bdb29d4c2cd617c253889b1573e50d28d53 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Sun, 6 Nov 2022 00:41:32 +0800
Subject: [PATCH] feat: add button related resources.

---
 src/Semi.Avalonia.Demo/App.axaml              |  9 +---
 src/Semi.Avalonia.Demo/MainWindow.axaml       |  6 +--
 src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml | 14 +++++
 .../Pages/ButtonDemo.axaml.cs                 | 18 +++++++
 src/Semi.Avalonia/Controls/Button.axaml       | 54 ++++++++++++-------
 src/Semi.Avalonia/Controls/Window.axaml       |  6 +--
 src/Semi.Avalonia/README.MD                   | 26 +++++++++
 src/Semi.Avalonia/Themes/Dark/Button.axaml    |  2 +
 src/Semi.Avalonia/Themes/Dark/Window.axaml    |  4 +-
 src/Semi.Avalonia/Themes/DarkTheme.axaml      | 21 +++++---
 src/Semi.Avalonia/Themes/Light/Button.axaml   | 25 ++++++++-
 src/Semi.Avalonia/Themes/Light/Window.axaml   |  4 +-
 src/Semi.Avalonia/Themes/LightTheme.axaml     | 22 +++++---
 13 files changed, 157 insertions(+), 54 deletions(-)
 create mode 100644 src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml
 create mode 100644 src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml.cs
 create mode 100644 src/Semi.Avalonia/README.MD

diff --git a/src/Semi.Avalonia.Demo/App.axaml b/src/Semi.Avalonia.Demo/App.axaml
index dee4770..3946d7d 100644
--- a/src/Semi.Avalonia.Demo/App.axaml
+++ b/src/Semi.Avalonia.Demo/App.axaml
@@ -2,13 +2,6 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              x:Class="Semi.Avalonia.Demo.App">
     <Application.Styles>
-        
+        <StyleInclude Source="avares://Semi.Avalonia/Themes/LightTheme.axaml"></StyleInclude>
     </Application.Styles>
-    <Application.Resources>
-        <ResourceDictionary>
-            <ResourceDictionary.MergedDictionaries>
-                <ResourceInclude Source="avares://Semi.Avalonia/Themes/DarkTheme.axaml"/>
-            </ResourceDictionary.MergedDictionaries>
-        </ResourceDictionary>
-    </Application.Resources>
 </Application>
diff --git a/src/Semi.Avalonia.Demo/MainWindow.axaml b/src/Semi.Avalonia.Demo/MainWindow.axaml
index 3ff4055..7093382 100644
--- a/src/Semi.Avalonia.Demo/MainWindow.axaml
+++ b/src/Semi.Avalonia.Demo/MainWindow.axaml
@@ -2,11 +2,9 @@
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+        xmlns:pages="using:Semi.Avalonia.Demo.Pages"
         mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
         x:Class="Semi.Avalonia.Demo.MainWindow"
         Title="Semi.Demo">
-    <StackPanel>
-        <Button>Primary</Button>
-        <Button>Secondary</Button>
-    </StackPanel>
+        <pages:ButtonDemo></pages:ButtonDemo>
 </Window>
diff --git a/src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml b/src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml
new file mode 100644
index 0000000..6bb0593
--- /dev/null
+++ b/src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml
@@ -0,0 +1,14 @@
+<UserControl 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"
+             mc:Ignorable="d" d:DesignWidth="800"
+             d:DesignHeight="450"
+             x:Class="Semi.Avalonia.Demo.Pages.ButtonDemo">
+    <StackPanel Spacing="20" Margin="20" HorizontalAlignment="Left">
+        <Button>Primary</Button>
+        <Button Classes="Large">Primary</Button>
+        <Button Classes="Small">Primary</Button>
+        <Button Classes="Primary">Secondary</Button>
+    </StackPanel>
+</UserControl>
diff --git a/src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml.cs b/src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml.cs
new file mode 100644
index 0000000..8d412cd
--- /dev/null
+++ b/src/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml.cs
@@ -0,0 +1,18 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Markup.Xaml;
+
+namespace Semi.Avalonia.Demo.Pages;
+
+public partial class ButtonDemo : UserControl
+{
+    public ButtonDemo()
+    {
+        InitializeComponent();
+    }
+
+    private void InitializeComponent()
+    {
+        AvaloniaXamlLoader.Load(this);
+    }
+}
\ No newline at end of file
diff --git a/src/Semi.Avalonia/Controls/Button.axaml b/src/Semi.Avalonia/Controls/Button.axaml
index eb980c3..d2876fc 100644
--- a/src/Semi.Avalonia/Controls/Button.axaml
+++ b/src/Semi.Avalonia/Controls/Button.axaml
@@ -1,16 +1,21 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <!-- Add Resources Here -->
+    <!-- Button Theme Key: Solid Light Borderless; Default is Light -->
+    <!-- Button Default Classes: Primary Secondary, Tertiary, Warning, Danger; Default is Primary -->
+    <!-- State： default pointerover pressed disabled  -->
     <ControlTheme x:Key="{x:Type Button}" TargetType="Button">
-        <Setter Property="Button.Background" Value="{DynamicResource ColorButtonOutlineBackground}"/>
-        <Setter Property="Button.Foreground" Value="{DynamicResource ColorButtonOutlinePrimaryForeground}"/>
-        <Setter Property="Button.BorderBrush" Value="{DynamicResource ColorButtonOutlinePrimaryBorderBrush}"/>
-        <Setter Property="Button.CornerRadius" Value="{DynamicResource SizeButtonCornerRadius}"/>
+        <Setter Property="Button.Background" Value="{DynamicResource ButtonDefaultBackground}"/>
+        <Setter Property="Button.Foreground" Value="{DynamicResource ButtonDefaultForeground}"/>
+        <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}"/>
+        <Setter Property="Button.CornerRadius" Value="3"/>
         <Setter Property="Button.BorderThickness" Value="1"/>
-        <Setter Property="Button.Padding" Value="{DynamicResource ThicknessButtonContentDefault}"/>
+        <Setter Property="Button.Padding" Value="{DynamicResource ButtonDefaultPadding}"/>
         <Setter Property="Button.RenderTransform" Value="none"/>
-        <Setter Property="Button.FontSize" Value="{DynamicResource FontRegularSize}"></Setter>
-        <Setter Property="Button.FontWeight" Value="{DynamicResource FontButtonFontWeight}"></Setter>
+        <Setter Property="Button.FontSize" Value="{DynamicResource ButtonDefaultFontSize}"></Setter>
+        <Setter Property="Button.FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}"></Setter>
+        <Setter Property="Button.HorizontalContentAlignment" Value="Center"></Setter>
+        <Setter Property="Button.VerticalContentAlignment" Value="Center"></Setter>
+        <Setter Property="Button.MinHeight" Value="12"></Setter>
         <Setter Property="Button.Template">
             <ControlTemplate TargetType="Button">
                 <ContentPresenter
@@ -22,11 +27,11 @@
                     Content="{TemplateBinding Content}"
                     ContentTemplate="{TemplateBinding ContentTemplate}"
                     Padding="{TemplateBinding Padding}"
-                    RecognizesAccessKey="True"
                     HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                     VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                     TextElement.FontWeight="{TemplateBinding FontWeight}"
                     TextElement.FontSize="{TemplateBinding FontSize}"
+                    RecognizesAccessKey="True"
                     UseLayoutRounding="False"
                     >
 
@@ -34,19 +39,32 @@
             </ControlTemplate>
         </Setter>
         
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Button.BorderBrush" Value="{DynamicResource ColorButtonOutlinePrimaryPointeroverForeground}" />
-            <Setter Property="Button.Foreground" Value="{DynamicResource ColorButtonOutlinePrimaryPointeroverBorderBrush}" />
+        <Style Selector="^:pointerover">
+            <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonDefaultPointerOverBorderBrush}" />
+            <Setter Property="Button.Background" Value="{DynamicResource ButtonDefaultPointerOverBackground}" />
+            <Setter Property="Button.Foreground" Value="{DynamicResource ButtonDefaultPointerOverForeground}" />
         </Style>
         
-        <Style Selector="^:pressed  /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Button.BorderBrush" Value="{DynamicResource ColorButtonOutlinePrimaryPressedForeground}" />
-            <Setter Property="Button.Foreground" Value="{DynamicResource ColorButtonOutlinePrimaryPressedBorderBrush}" />
+        <Style Selector="^:pressed">
+            <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
+            <Setter Property="Button.Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
+            <Setter Property="Button.Foreground" Value="{DynamicResource ButtonDefaultPressedForeground}" />
         </Style>
 
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Button.BorderBrush" Value="{DynamicResource ColorButtonOutlineDisabledBorderBrush}" />
-            <Setter Property="Button.Foreground" Value="{DynamicResource ColorButtonOutlineDisabledForeground}" />
+        <Style Selector="^:disabled">
+            <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
+            <Setter Property="Button.Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="Button.Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+        
+        <Style Selector="^.Large">
+            <Setter Property="Button.Padding" Value="{DynamicResource ButtonLargePadding}"></Setter>
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="Button.Padding" Value="{DynamicResource ButtonSmallPadding}"></Setter>
         </Style>
     </ControlTheme>
+    
+    <ControlTheme x:Key="LightButtonTheme" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}"/>
+    
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Controls/Window.axaml b/src/Semi.Avalonia/Controls/Window.axaml
index 2a75660..2ba614f 100644
--- a/src/Semi.Avalonia/Controls/Window.axaml
+++ b/src/Semi.Avalonia/Controls/Window.axaml
@@ -1,9 +1,9 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <ControlTheme x:Key="{x:Type Window}" TargetType="Window">
-        <Setter Property="Background" Value="{DynamicResource BrushWindowDefaultBackground}"/>
-        <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource BrushWindowDefaultBackground}" />
-        <Setter Property="Foreground" Value="{DynamicResource BrushWindowDefaultForeground}"/>
+        <Setter Property="Background" Value="{DynamicResource WindowDefaultBackground}"/>
+        <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource WindowDefaultBackground}" />
+        <Setter Property="Foreground" Value="{DynamicResource WindowDefaultForeground}"/>
         <Setter Property="FontSize" Value="{DynamicResource FontDefaultFontSize}"/>
         <Setter Property="FontFamily" Value="{DynamicResource FontDefaultFontFamily}" />
         <Setter Property="Template">
diff --git a/src/Semi.Avalonia/README.MD b/src/Semi.Avalonia/README.MD
new file mode 100644
index 0000000..3acff27
--- /dev/null
+++ b/src/Semi.Avalonia/README.MD
@@ -0,0 +1,26 @@
+# Semi.Avalonia Theme 
+
+## Naming Conventions
+
+Resources are named by following format
+
+`Control`+`Theme`[+`Class`+`PseudoClass`]+`Property`
+
+Example:
+
+`ButtonDefaultBackground`
+
+`ButtonSolidPointeroverBorderThickness`
+
+### Theme
+
+If Theme key is type default, use `Default` as Theme part
+
+### Class and PseudoClass
+
+* Classes comes before PseudoClasses
+
+* If multiple Classes are applied, order by alphabet order.
+
+* If multiple PseudoClass are applied, order by alphabet order.
+
diff --git a/src/Semi.Avalonia/Themes/Dark/Button.axaml b/src/Semi.Avalonia/Themes/Dark/Button.axaml
index 779852d..0b8abd6 100644
--- a/src/Semi.Avalonia/Themes/Dark/Button.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/Button.axaml
@@ -1,4 +1,6 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!-- Add Resources Here -->
+    <SolidColorBrush x:Key="ButtonDefaultBackground" Color="Red"/>
+    <SolidColorBrush x:Key="ButtonDefaultForeground" Color="White"/>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/Window.axaml b/src/Semi.Avalonia/Themes/Dark/Window.axaml
index 4331a5d..878105d 100644
--- a/src/Semi.Avalonia/Themes/Dark/Window.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/Window.axaml
@@ -1,6 +1,6 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!-- Add Resources Here -->
-    <SolidColorBrush x:Key="BrushWindowDefaultBackground" Color="Black"/>
-    <SolidColorBrush x:Key="BrushWindowDefaultForeground" Color="White"/>
+    <SolidColorBrush x:Key="WindowDefaultBackground" Color="Black"/>
+    <SolidColorBrush x:Key="WindowDefaultForeground" Color="White"/>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/DarkTheme.axaml b/src/Semi.Avalonia/Themes/DarkTheme.axaml
index bd31c4c..b18c9c7 100644
--- a/src/Semi.Avalonia/Themes/DarkTheme.axaml
+++ b/src/Semi.Avalonia/Themes/DarkTheme.axaml
@@ -1,9 +1,16 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!-- Add Resources Here -->
-    <ResourceDictionary.MergedDictionaries>
-        <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/Dark.axaml"/>
-        <ResourceInclude Source="avares://Semi.Avalonia/Themes/Base.axaml"/>
-        <ResourceInclude Source="avares://Semi.Avalonia/Controls/Controls.axaml"/>
-    </ResourceDictionary.MergedDictionaries>
-</ResourceDictionary>
+    <Styles.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/Dark.axaml"/>
+                <ResourceInclude Source="avares://Semi.Avalonia/Themes/Base.axaml"/>
+                <ResourceInclude Source="avares://Semi.Avalonia/Controls/Controls.axaml"/>
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </Styles.Resources>
+    <Style Selector=":is(UserControl)">
+        <Setter Property="Theme" Value="{DynamicResource {x:Type UserControl}}"></Setter>
+    </Style>
+</Styles>
diff --git a/src/Semi.Avalonia/Themes/Light/Button.axaml b/src/Semi.Avalonia/Themes/Light/Button.axaml
index 779852d..020d5f7 100644
--- a/src/Semi.Avalonia/Themes/Light/Button.axaml
+++ b/src/Semi.Avalonia/Themes/Light/Button.axaml
@@ -1,4 +1,25 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <!-- Add Resources Here -->
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:sys="clr-namespace:System;assembly=System.Runtime">
+    
+    <sys:Double x:Key="ButtonDefaultFontSize">14</sys:Double>
+    <FontWeight x:Key="ButtonDefaultFontWeight">600</FontWeight>
+    
+    <Thickness x:Key="ButtonDefaultPadding">12 6</Thickness>
+    <Thickness x:Key="ButtonLargePadding">16 10</Thickness>
+    <Thickness x:Key="ButtonSmallPadding">6 2</Thickness>
+    
+    <SolidColorBrush x:Key="ButtonDefaultForeground" Color="White"/>
+    <SolidColorBrush x:Key="ButtonDefaultBackground" Color="#0077FA"/>
+    <SolidColorBrush x:Key="ButtonDefaultBorderBrush" Color="#0077FA"/>
+    <SolidColorBrush x:Key="ButtonDefaultPointerOverForeground" Color="White"/>
+    <SolidColorBrush x:Key="ButtonDefaultPointerOverBackground" Color="#0062D6"/>
+    <SolidColorBrush x:Key="ButtonDefaultPointerOverBorderBrush" Color="#0062D6"/>
+    <SolidColorBrush x:Key="ButtonDefaultPressedForeground" Color="White"/>
+    <SolidColorBrush x:Key="ButtonDefaultPressedBackground" Color="#004FB3"/>
+    <SolidColorBrush x:Key="ButtonDefaultPressedBorderBrush" Color="#004FB3"/>
+    <SolidColorBrush x:Key="ButtonDefaultDisabledForeground" Color="#E6E8EA"/>
+    <SolidColorBrush x:Key="ButtonDefaultDisabledBackground" Color="White"/>
+    <SolidColorBrush x:Key="ButtonDefaultDisabledBorderBrush" Color="#E6E8EA"/>
+    
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/Window.axaml b/src/Semi.Avalonia/Themes/Light/Window.axaml
index d7d2825..53a8b3c 100644
--- a/src/Semi.Avalonia/Themes/Light/Window.axaml
+++ b/src/Semi.Avalonia/Themes/Light/Window.axaml
@@ -1,6 +1,6 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!-- Add Resources Here -->
-    <SolidColorBrush x:Key="BrushWindowDefaultBackground" Color="White"/>
-    <SolidColorBrush x:Key="BrushWindowDefaultForeground" Color="Black"/>
+    <SolidColorBrush x:Key="WindowDefaultBackground" Color="White"/>
+    <SolidColorBrush x:Key="WindowDefaultForeground" Color="Black"/>
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/LightTheme.axaml b/src/Semi.Avalonia/Themes/LightTheme.axaml
index b9f5b41..28c6a29 100644
--- a/src/Semi.Avalonia/Themes/LightTheme.axaml
+++ b/src/Semi.Avalonia/Themes/LightTheme.axaml
@@ -1,10 +1,16 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui"
+<Styles xmlns="https://github.com/avaloniaui"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!-- Add Resources Here -->
-    
-    <ResourceDictionary.MergedDictionaries>
-        <ResourceInclude Source="avares://Semi.Avalonia/Themes/Light/Light.axaml"/>
-        <ResourceInclude Source="avares://Semi.Avalonia/Themes/Base.axaml"/>
-        <ResourceInclude Source="avares://Semi.Avalonia/Controls/Controls.axaml"/>
-    </ResourceDictionary.MergedDictionaries>
-</ResourceDictionary>
+    <Styles.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceInclude Source="avares://Semi.Avalonia/Themes/Light/Light.axaml"/>
+                <ResourceInclude Source="avares://Semi.Avalonia/Themes/Base.axaml"/>
+                <ResourceInclude Source="avares://Semi.Avalonia/Controls/Controls.axaml"/>
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </Styles.Resources>
+    <Style Selector=":is(UserControl)">
+        <Setter Property="Theme" Value="{StaticResource {x:Type UserControl}}"></Setter>
+    </Style>
+</Styles>