From 068f1e36cc932227e921dde70945924ef4b294e7 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Thu, 16 Feb 2023 02:01:17 +0800
Subject: [PATCH] feat: update ComboBox demo.

---
 .../Pages/ComboBoxDemo.axaml                  | 26 +++++++++
 src/Semi.Avalonia/Controls/ComboBox.axaml     | 53 ++++++++++++++++---
 src/Semi.Avalonia/Themes/Dark/ComboBox.axaml  | 11 ++++
 src/Semi.Avalonia/Themes/Dark/TextBox.axaml   |  2 +-
 src/Semi.Avalonia/Themes/Light/ComboBox.axaml | 11 ++++
 5 files changed, 95 insertions(+), 8 deletions(-)

diff --git a/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
index df5a595..c73cc17 100644
--- a/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
@@ -23,5 +23,31 @@
             <ComboBoxItem>BBB</ComboBoxItem>
             <ComboBoxItem>CCC</ComboBoxItem>
         </ComboBox>
+        <ComboBox
+            Width="150"
+            Classes="Large"
+            IsEnabled="False">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox Width="150" Classes="Small">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox Width="150" Classes="Bordered">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox
+            Width="150"
+            Classes="Bordered"
+            IsEnabled="False">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
     </StackPanel>
 </UserControl>
diff --git a/src/Semi.Avalonia/Controls/ComboBox.axaml b/src/Semi.Avalonia/Controls/ComboBox.axaml
index 9f0b934..c6019fb 100644
--- a/src/Semi.Avalonia/Controls/ComboBox.axaml
+++ b/src/Semi.Avalonia/Controls/ComboBox.axaml
@@ -35,7 +35,7 @@
         <Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" />
         <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
         <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-        <Setter Property="MinHeight" Value="30" />
+        <Setter Property="MinHeight" Value="{DynamicResource ComboBoxDefaultHeight}" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="HorizontalAlignment" Value="Left" />
@@ -115,6 +115,7 @@
                             BorderBrush="{DynamicResource ComboBoxPopupBorderBrush}"
                             BorderThickness="{DynamicResource ComboBoxPopupBorderThickness}"
                             BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
+                            ClipToBounds="True"
                             CornerRadius="6">
                             <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
                                 <ItemsPresenter
@@ -128,6 +129,13 @@
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^.Large">
+            <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxSmallHeight}" />
+        </Style>
+
         <!--  PointerOver State  -->
         <Style Selector="^:pointerover">
             <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorPointerOverBackground}" />
@@ -163,6 +171,35 @@
                 <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconDisabledForeground}" />
             </Style>
         </Style>
+        <Style Selector="^.Bordered">
+            <Style Selector="^ /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedBorderBrush}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedPointeroverBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:pressed /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedPressedBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedPressedBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#Background">
+                    <Setter Property="Border.Background" Value="{DynamicResource ComboBoxSelectorDisabledBackground}" />
+                    <Setter Property="Border.BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ ContentControl#ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconDisabledForeground}" />
+                </Style>
+            </Style>
+        </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
@@ -187,24 +224,26 @@
             </ControlTemplate>
         </Setter>
 
-        <Style Selector="^:pointerover">
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemPointerOverBackground}" />
         </Style>
 
-        <Style Selector="^:disabled">
+        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemDisabledBackground}" />
         </Style>
 
-        <Style Selector="^:pressed">
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemPressedBackground}" />
         </Style>
 
         <Style Selector="^:selected">
-            <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedBackground}" />
-            <Style Selector="^:disabled">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedBackground}" />
+            </Style>
+            <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedDisabledBackground}" />
             </Style>
-            <Style Selector="^:pointerover">
+            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedPointerOverBackground}" />
             </Style>
         </Style>
diff --git a/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml b/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml
index b7f63ae..e0b90f4 100644
--- a/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/ComboBox.axaml
@@ -37,4 +37,15 @@
     <PathGeometry x:Key="ComboBoxIcon">
         M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z
     </PathGeometry>
+
+    <x:Double x:Key="ComboBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="ComboBoxLargeHeight">24</x:Double>
+    <x:Double x:Key="ComboBoxSmallHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBorderBrush" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBorderBrush" Color="#7FC1FF" />
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Dark/TextBox.axaml b/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
index 6d7c503..ee51c09 100644
--- a/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/TextBox.axaml
@@ -25,7 +25,7 @@
     <SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
     <SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#7FC1FF" />
 
     <sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
     <sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>
diff --git a/src/Semi.Avalonia/Themes/Light/ComboBox.axaml b/src/Semi.Avalonia/Themes/Light/ComboBox.axaml
index 8f50dac..bd82b4b 100644
--- a/src/Semi.Avalonia/Themes/Light/ComboBox.axaml
+++ b/src/Semi.Avalonia/Themes/Light/ComboBox.axaml
@@ -37,4 +37,15 @@
     <PathGeometry x:Key="ComboBoxIcon">
         M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z
     </PathGeometry>
+
+    <x:Double x:Key="ComboBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="ComboBoxLargeHeight">24</x:Double>
+    <x:Double x:Key="ComboBoxSmallHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBorderBrush" Opacity="0.08" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBorderBrush" Color="#0062D6" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBorderBrush" Color="#0062D6" />
 </ResourceDictionary>