From e888897bf41cdfcdfa07f6e384221360ab000d60 Mon Sep 17 00:00:00 2001
From: NaBian <836904362@qq.com>
Date: Wed, 20 Aug 2025 22:47:35 +0800
Subject: [PATCH] feat: add avalonia extend NumericUpDown style.

---
 .../Styles/NumericUpDownDemo.axaml            | 139 ++++++++++-
 .../Common/InputElementDemoViewModel.cs       |   4 +
 .../Themes/Styles/ButtonSpinner.axaml         |   2 +-
 .../Themes/Styles/NumericUpDown.axaml         | 218 ++++++++++++++++++
 4 files changed, 361 insertions(+), 2 deletions(-)

diff --git a/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Styles/NumericUpDownDemo.axaml b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Styles/NumericUpDownDemo.axaml
index 3a5441e7..677d506c 100644
--- a/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Styles/NumericUpDownDemo.axaml
+++ b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Styles/NumericUpDownDemo.axaml
@@ -11,12 +11,149 @@
             <hc:UniformSpacingPanel Spacing="16"
                                     Orientation="Vertical">
                 <NumericUpDown Value="0"
-                               Width="380"
                                Maximum="100" />
                 <NumericUpDown Value="0"
                                IsEnabled="False" />
                 <NumericUpDown Value="0"
                                IsReadOnly="True" />
+
+                <NumericUpDown Value="0"
+                               hc:TitleElement.Title="This is the title"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown Value="0"
+                               Watermark="Please enter content"
+                               hc:TitleElement.Title="This is the title"
+                               hc:InfoElement.Necessary="True"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown Value="0"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown FormatString="N2"
+                               Maximum="100000"
+                               Value="10000"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               Watermark="Please enter content"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend}"
+                               hc:InfoElement.Necessary="True" />
+            </hc:UniformSpacingPanel>
+            <hc:UniformSpacingPanel Spacing="16"
+                                    Orientation="Vertical">
+                <NumericUpDown hc:InfoElement.ShowClearButton="True"
+                               Theme="{StaticResource NumericUpDownExtend}"
+                               Value="{Binding DoubleValue1}" />
+                <NumericUpDown Value="0"
+                               IsEnabled="False"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown Value="0"
+                               IsReadOnly="True"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+
+                <NumericUpDown Value="0"
+                               hc:InfoElement.ShowClearButton="True"
+                               hc:TitleElement.Title="This is the title"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown Value="0"
+                               Watermark="Please enter content"
+                               hc:TitleElement.Title="This is the title"
+                               hc:InfoElement.Necessary="True"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown Value="0"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend}" />
+                <NumericUpDown Value="0"
+                               FormatString="N2"
+                               hc:InfoElement.ShowClearButton="True"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               Watermark="Please enter content"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend}"
+                               hc:InfoElement.Necessary="True" />
+            </hc:UniformSpacingPanel>
+            <hc:UniformSpacingPanel Spacing="16"
+                                    Orientation="Vertical">
+                <NumericUpDown Value="0"
+                               Maximum="100"
+                               Theme="{StaticResource NumericUpDown.Small}" />
+                <NumericUpDown Value="0"
+                               IsEnabled="False"
+                               Theme="{StaticResource NumericUpDown.Small}" />
+                <NumericUpDown Value="0"
+                               IsReadOnly="True"
+                               Theme="{StaticResource NumericUpDown.Small}" />
+
+                <NumericUpDown Value="0"
+                               hc:TitleElement.Title="This is the title"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown Value="0"
+                               Watermark="Please enter content"
+                               hc:TitleElement.Title="This is the title"
+                               hc:InfoElement.Necessary="True"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown Value="0"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown FormatString="N2"
+                               Maximum="100000"
+                               Value="10000"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               Watermark="Please enter content"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend.Small}"
+                               hc:InfoElement.Necessary="True" />
+            </hc:UniformSpacingPanel>
+            <hc:UniformSpacingPanel Spacing="16"
+                                    Orientation="Vertical">
+                <NumericUpDown hc:InfoElement.ShowClearButton="True"
+                               Theme="{StaticResource NumericUpDownExtend.Small}"
+                               Value="{Binding DoubleValue1}" />
+                <NumericUpDown Value="0"
+                               IsEnabled="False"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown Value="0"
+                               IsReadOnly="True"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+
+                <NumericUpDown Value="0"
+                               hc:InfoElement.ShowClearButton="True"
+                               hc:TitleElement.Title="This is the title"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown Value="0"
+                               Watermark="Please enter content"
+                               hc:TitleElement.Title="This is the title"
+                               hc:InfoElement.Necessary="True"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown Value="0"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend.Small}" />
+                <NumericUpDown Value="0"
+                               FormatString="N2"
+                               hc:InfoElement.ShowClearButton="True"
+                               Width="380"
+                               hc:TitleElement.TitleWidth="140"
+                               Watermark="Please enter content"
+                               hc:TitleElement.TitlePlacement="Left"
+                               hc:TitleElement.Title="The title is on the left"
+                               Theme="{StaticResource NumericUpDownExtend.Small}"
+                               hc:InfoElement.Necessary="True" />
             </hc:UniformSpacingPanel>
         </hc:UniformSpacingPanel>
     </ScrollViewer>
diff --git a/src/Avalonia/HandyControlDemo_Avalonia/ViewModel/Common/InputElementDemoViewModel.cs b/src/Avalonia/HandyControlDemo_Avalonia/ViewModel/Common/InputElementDemoViewModel.cs
index 1a03a524..b2be4b02 100644
--- a/src/Avalonia/HandyControlDemo_Avalonia/ViewModel/Common/InputElementDemoViewModel.cs
+++ b/src/Avalonia/HandyControlDemo_Avalonia/ViewModel/Common/InputElementDemoViewModel.cs
@@ -16,4 +16,8 @@ public partial class InputElementDemoViewModel : ObservableValidator
 
     [Required] [ObservableProperty] [NotifyDataErrorInfo]
     private string? _text2;
+
+    [ObservableProperty] private double? _doubleValue1;
+
+    [ObservableProperty] private double? _doubleValue2;
 }
diff --git a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/ButtonSpinner.axaml b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/ButtonSpinner.axaml
index b1a9b1ca..44c3bc6e 100644
--- a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/ButtonSpinner.axaml
+++ b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/ButtonSpinner.axaml
@@ -35,7 +35,7 @@
                                 BorderBrush="{TemplateBinding BorderBrush}"
                                 BorderThickness="{TemplateBinding BorderThickness}"
                                 CornerRadius="{TemplateBinding CornerRadius}" />
-                        <DockPanel>
+                        <DockPanel Margin="{Binding BorderThickness, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource ThicknessSplitConverter}, ConverterParameter='1,0,1,0'}">
                             <UniformGrid Name="PART_SpinnerPanel"
                                          TabIndex="2"
                                          DockPanel.Dock="Right"
diff --git a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/NumericUpDown.axaml b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/NumericUpDown.axaml
index ae4395a5..b7b9eab5 100644
--- a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/NumericUpDown.axaml
+++ b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/NumericUpDown.axaml
@@ -39,6 +39,7 @@
                                    VerticalContentAlignment="Stretch"
                                    IsTabStop="False"
                                    Padding="{TemplateBinding Padding}"
+                                   MinHeight="{TemplateBinding MinHeight}"
                                    MinWidth="0"
                                    AllowSpin="{TemplateBinding AllowSpin}"
                                    Background="{TemplateBinding Background}"
@@ -53,6 +54,7 @@
                                  BorderThickness="0"
                                  Padding="0"
                                  MinWidth="0"
+                                 MinHeight="{TemplateBinding MinHeight}"
                                  Foreground="{TemplateBinding Foreground}"
                                  Watermark="{TemplateBinding Watermark}"
                                  IsReadOnly="{TemplateBinding IsReadOnly}"
@@ -92,8 +94,224 @@
         </Style>
     </ControlTheme>
 
+    <ControlTemplate x:Key="NumericUpDownExtendTopTemplate"
+                     TargetType="NumericUpDown">
+        <Grid>
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition MinHeight="{Binding Path=(hc:InfoElement.MinContentHeight), RelativeSource={RelativeSource TemplatedParent}}"
+                               Height="{Binding Path=(hc:InfoElement.ContentHeight), RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource Double2GridLengthConverter}}" />
+            </Grid.RowDefinitions>
+            <DockPanel LastChildFill="True"
+                       IsHitTestVisible="False"
+                       IsVisible="{Binding Path=(hc:TitleElement.Title), RelativeSource={RelativeSource TemplatedParent},Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                       HorizontalAlignment="{Binding Path=(hc:TitleElement.HorizontalAlignment), RelativeSource={RelativeSource TemplatedParent}}"
+                       Margin="{Binding Path=(hc:TitleElement.MarginOnTheTop), RelativeSource={RelativeSource TemplatedParent}}">
+                <ContentPresenter DockPanel.Dock="Right"
+                                  TextElement.Foreground="{DynamicResource DangerBrush}"
+                                  Margin="4,0,0,0"
+                                  Content="{Binding Path=(hc:InfoElement.Symbol), RelativeSource={RelativeSource TemplatedParent}}"
+                                  IsVisible="{Binding Path=(hc:InfoElement.Necessary), RelativeSource={RelativeSource TemplatedParent}}" />
+                <TextBlock TextWrapping="NoWrap"
+                           TextTrimming="CharacterEllipsis"
+                           Text="{Binding Path=(hc:TitleElement.Title), RelativeSource={RelativeSource TemplatedParent}}" />
+            </DockPanel>
+            <DataValidationErrors Grid.Row="1">
+                <ButtonSpinner Name="PART_Spinner"
+                               HorizontalContentAlignment="Stretch"
+                               VerticalContentAlignment="Stretch"
+                               IsTabStop="False"
+                               Padding="{TemplateBinding Padding}"
+                               MinHeight="{TemplateBinding MinHeight}"
+                               MinWidth="0"
+                               AllowSpin="{TemplateBinding AllowSpin}"
+                               Background="{TemplateBinding Background}"
+                               BorderBrush="{TemplateBinding BorderBrush}"
+                               BorderThickness="{TemplateBinding BorderThickness}"
+                               ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}"
+                               CornerRadius="{TemplateBinding CornerRadius}"
+                               ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}">
+                    <DockPanel>
+                        <Button HorizontalAlignment="Right"
+                                VerticalAlignment="Stretch"
+                                hc:IconElement.Width="14"
+                                Width="{x:Static system:Double.NaN}"
+                                Command="{Binding Clear, ElementName=PART_TextBox}"
+                                Name="ButtonClear"
+                                Focusable="False"
+                                DockPanel.Dock="Right"
+                                Theme="{StaticResource ButtonIcon}"
+                                Padding="0,0,4,0"
+                                Margin="{Binding Padding, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource ThicknessSplitConverter}, ConverterParameter='0,0,-1,0'}"
+                                hc:IconElement.Geometry="{StaticResource DeleteFillCircleGeometry}"
+                                Foreground="{Binding BorderBrush,ElementName=PART_Spinner}">
+                            <Button.IsVisible>
+                                <MultiBinding Converter="{x:Static BoolConverters.And}">
+                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
+                                             Path="IsPointerOver" />
+                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
+                                             Path="(hc:InfoElement.ShowClearButton)" />
+                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
+                                             Path="IsReadOnly"
+                                             Converter="{x:Static BoolConverters.Not}" />
+                                </MultiBinding>
+                            </Button.IsVisible>
+                        </Button>
+                        <TextBox Name="PART_TextBox"
+                                 Background="Transparent"
+                                 BorderBrush="Transparent"
+                                 BorderThickness="0"
+                                 Padding="0"
+                                 MinWidth="0"
+                                 MinHeight="{TemplateBinding MinHeight}"
+                                 Foreground="{TemplateBinding Foreground}"
+                                 Watermark="{TemplateBinding Watermark}"
+                                 IsReadOnly="{TemplateBinding IsReadOnly}"
+                                 VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                 HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                 Text="{TemplateBinding Text}"
+                                 TextAlignment="{TemplateBinding TextAlignment}"
+                                 AcceptsReturn="False"
+                                 TextWrapping="NoWrap" />
+                    </DockPanel>
+                </ButtonSpinner>
+            </DataValidationErrors>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTemplate x:Key="NumericUpDownExtendLeftTemplate"
+                     TargetType="NumericUpDown">
+        <Grid MinHeight="{Binding Path=(hc:InfoElement.MinContentHeight), RelativeSource={RelativeSource TemplatedParent}}"
+              Height="{Binding Path=(hc:InfoElement.ContentHeight), RelativeSource={RelativeSource TemplatedParent}}">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="{Binding Path=(hc:TitleElement.TitleWidth), RelativeSource={RelativeSource TemplatedParent}}" />
+                <ColumnDefinition />
+            </Grid.ColumnDefinitions>
+            <DockPanel LastChildFill="True"
+                       IsHitTestVisible="False"
+                       IsVisible="{Binding Path=(hc:TitleElement.Title), RelativeSource={RelativeSource TemplatedParent},Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                       HorizontalAlignment="{Binding Path=(hc:TitleElement.HorizontalAlignment), RelativeSource={RelativeSource TemplatedParent}}"
+                       VerticalAlignment="{Binding Path=(hc:TitleElement.VerticalAlignment), RelativeSource={RelativeSource TemplatedParent}}"
+                       Margin="{Binding Path=(hc:TitleElement.MarginOnTheLeft), RelativeSource={RelativeSource TemplatedParent}}">
+                <ContentPresenter DockPanel.Dock="Right"
+                                  TextElement.Foreground="{DynamicResource DangerBrush}"
+                                  Margin="4,0,0,0"
+                                  Content="{Binding Path=(hc:InfoElement.Symbol), RelativeSource={RelativeSource TemplatedParent}}"
+                                  IsVisible="{Binding Path=(hc:InfoElement.Necessary), RelativeSource={RelativeSource TemplatedParent}}" />
+                <TextBlock TextWrapping="NoWrap"
+                           TextTrimming="CharacterEllipsis"
+                           Text="{Binding Path=(hc:TitleElement.Title), RelativeSource={RelativeSource TemplatedParent}}" />
+            </DockPanel>
+            <DataValidationErrors Grid.Column="1">
+                <ButtonSpinner Name="PART_Spinner"
+                               HorizontalContentAlignment="Stretch"
+                               VerticalContentAlignment="Stretch"
+                               IsTabStop="False"
+                               Padding="{TemplateBinding Padding}"
+                               MinHeight="{TemplateBinding MinHeight}"
+                               MinWidth="0"
+                               AllowSpin="{TemplateBinding AllowSpin}"
+                               Background="{TemplateBinding Background}"
+                               BorderBrush="{TemplateBinding BorderBrush}"
+                               BorderThickness="{TemplateBinding BorderThickness}"
+                               ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}"
+                               CornerRadius="{TemplateBinding CornerRadius}"
+                               ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}">
+                    <DockPanel>
+                        <Button HorizontalAlignment="Right"
+                                VerticalAlignment="Stretch"
+                                hc:IconElement.Width="14"
+                                Width="{x:Static system:Double.NaN}"
+                                Command="{Binding Clear, ElementName=PART_TextBox}"
+                                Name="ButtonClear"
+                                Focusable="False"
+                                DockPanel.Dock="Right"
+                                Theme="{StaticResource ButtonIcon}"
+                                Padding="0"
+                                hc:IconElement.Geometry="{StaticResource DeleteFillCircleGeometry}"
+                                Foreground="{Binding BorderBrush,ElementName=PART_Spinner}">
+                            <Button.IsVisible>
+                                <MultiBinding Converter="{x:Static BoolConverters.And}">
+                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
+                                             Path="IsPointerOver" />
+                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
+                                             Path="(hc:InfoElement.ShowClearButton)" />
+                                    <Binding RelativeSource="{RelativeSource TemplatedParent}"
+                                             Path="IsReadOnly"
+                                             Converter="{x:Static BoolConverters.Not}" />
+                                </MultiBinding>
+                            </Button.IsVisible>
+                        </Button>
+                        <TextBox Name="PART_TextBox"
+                                 Background="Transparent"
+                                 BorderBrush="Transparent"
+                                 BorderThickness="0"
+                                 Padding="0"
+                                 MinWidth="0"
+                                 MinHeight="{TemplateBinding MinHeight}"
+                                 Foreground="{TemplateBinding Foreground}"
+                                 Watermark="{TemplateBinding Watermark}"
+                                 IsReadOnly="{TemplateBinding IsReadOnly}"
+                                 VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                 HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                 Text="{TemplateBinding Text}"
+                                 TextAlignment="{TemplateBinding TextAlignment}"
+                                 AcceptsReturn="False"
+                                 TextWrapping="NoWrap" />
+                    </DockPanel>
+                </ButtonSpinner>
+            </DataValidationErrors>
+        </Grid>
+    </ControlTemplate>
+
+    <ControlTheme x:Key="NumericUpDownExtendBaseStyle"
+                  BasedOn="{StaticResource NumericUpDownBaseStyle}"
+                  TargetType="NumericUpDown">
+        <Setter Property="hc:InfoElement.ContentHeight"
+                Value="{x:Static system:Double.NaN}" />
+        <Setter Property="hc:InfoElement.MinContentHeight"
+                Value="{StaticResource DefaultControlHeight}" />
+        <Setter Property="Template"
+                Value="{StaticResource NumericUpDownExtendTopTemplate}" />
+
+        <Style Selector="^[(hc|TitleElement.TitlePlacement)=Left]">
+            <Setter Property="Template"
+                    Value="{StaticResource NumericUpDownExtendLeftTemplate}" />
+        </Style>
+    </ControlTheme>
+
     <ControlTheme x:Key="{x:Type NumericUpDown}"
                   BasedOn="{StaticResource NumericUpDownBaseStyle}"
                   TargetType="NumericUpDown" />
 
+    <ControlTheme x:Key="NumericUpDown.Small"
+                  BasedOn="{StaticResource NumericUpDownBaseStyle}"
+                  TargetType="NumericUpDown">
+        <Setter Property="MinHeight"
+                Value="20" />
+        <Setter Property="Padding"
+                Value="6,0" />
+    </ControlTheme>
+
+    <ControlTheme x:Key="NumericUpDownExtend"
+                  BasedOn="{StaticResource NumericUpDownExtendBaseStyle}"
+                  TargetType="NumericUpDown" />
+
+    <ControlTheme x:Key="NumericUpDownExtend.Small"
+                  BasedOn="{StaticResource NumericUpDownExtend}"
+                  TargetType="NumericUpDown">
+        <Setter Property="hc:InfoElement.MinContentHeight"
+                Value="20" />
+        <Setter Property="hc:InfoElement.ContentHeight"
+                Value="20" />
+        <Setter Property="hc:TitleElement.MarginOnTheLeft"
+                Value="0,3,6,0" />
+        <Setter Property="hc:TitleElement.MarginOnTheTop"
+                Value="6,0,0,1" />
+        <Setter Property="Padding"
+                Value="6,0" />
+        <Setter Property="MinHeight"
+                Value="20" />
+    </ControlTheme>
+
 </ResourceDictionary>