Add SplitButtonSpinner theme for ButtonSpinner and NumericUpDown (#776)

* Initial plan

* Add SplitButtonSpinner theme for ButtonSpinner

Co-authored-by: rabbitism <14807942+rabbitism@users.noreply.github.com>
Agent-Logs-Url: https://github.com/irihitech/Semi.Avalonia/sessions/7095fb6c-cdd9-48c0-9076-85a35fa93453

* feat: enhance ButtonSpinner and NumericUpDown with new styles and properties.

* fix: fix Glyph and enlarge icons.

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: rabbitism <14807942+rabbitism@users.noreply.github.com>
Co-authored-by: Dong Bin <popmessiah@hotmail.com>
Co-authored-by: Zhang Dian <54255897+zdpcdt@users.noreply.github.com>
This commit is contained in:
Copilot
2026-03-23 17:20:41 +08:00
committed by GitHub
parent bfb3dd671b
commit 9cf27b3906
5 changed files with 113 additions and 1 deletions

View File

@@ -20,6 +20,7 @@
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Content="{TemplateBinding Content}"
CornerRadius="{TemplateBinding CornerRadius}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
</ControlTemplate>
</Setter>
@@ -92,7 +93,7 @@
</Grid>
</ControlTemplate>
</Setter>
<Style Selector="^[ButtonSpinnerLocation=Left] /template/ Border#ButtonGroup">
<Style Selector="^:left /template/ Border#ButtonGroup">
<Setter Property="Grid.Column" Value="0" />
<Setter Property="Margin" Value="0 0 4 0" />
</Style>
@@ -100,4 +101,70 @@
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSpinnerRepeatButtonPointeroverBorderBrush}" />
</Style>
</ControlTheme>
<ControlTheme x:Key="SplitButtonSpinner" TargetType="ButtonSpinner">
<Setter Property="BorderBrush" Value="{DynamicResource ButtonSpinnerRepeatButtonBorderBrush}" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="MinWidth" Value="200" />
<Setter Property="Template">
<ControlTemplate TargetType="ButtonSpinner">
<Grid ColumnDefinitions="Auto, *, Auto">
<RepeatButton
Name="PART_DecreaseButton"
Grid.Column="0"
VerticalAlignment="Stretch"
Padding="{DynamicResource SplitButtonSpinnerButtonPadding}"
BorderBrush="{DynamicResource ButtonSpinnerRepeatButtonBorderBrush}"
BorderThickness="{DynamicResource ButtonSpinnerButtonGroupBorderThickness}"
CornerRadius="{DynamicResource SplitButtonSpinnerLeftButtonCornerRadius}"
IsVisible="{TemplateBinding ShowButtonSpinner}"
Theme="{StaticResource ButtonSpinnerRepeatButton}">
<PathIcon
Theme="{DynamicResource InnerPathIcon}"
Classes="Small"
Data="{DynamicResource SplitButtonSpinnerDecreaseButtonGlyph}"
Foreground="{DynamicResource ButtonSpinnerRepeatButtonForeground}" />
</RepeatButton>
<Border
Grid.Column="1"
Margin="2 0"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<ContentPresenter
Name="PART_ContentPresenter"
Padding="{TemplateBinding Padding}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
</Border>
<RepeatButton
Name="PART_IncreaseButton"
Grid.Column="2"
VerticalAlignment="Stretch"
Padding="{DynamicResource SplitButtonSpinnerButtonPadding}"
BorderBrush="{DynamicResource ButtonSpinnerRepeatButtonBorderBrush}"
BorderThickness="{DynamicResource ButtonSpinnerButtonGroupBorderThickness}"
CornerRadius="{DynamicResource SplitButtonSpinnerRightButtonCornerRadius}"
IsVisible="{TemplateBinding ShowButtonSpinner}"
Theme="{StaticResource ButtonSpinnerRepeatButton}">
<PathIcon
Theme="{DynamicResource InnerPathIcon}"
Classes="Small"
Data="{DynamicResource SplitButtonSpinnerIncreaseButtonGlyph}"
Foreground="{DynamicResource ButtonSpinnerRepeatButtonForeground}" />
</RepeatButton>
</Grid>
</ControlTemplate>
</Setter>
<Style Selector="^:left /template/ RepeatButton#PART_DecreaseButton">
<Setter Property="Grid.Column" Value="2" />
<Setter Property="CornerRadius" Value="{DynamicResource SplitButtonSpinnerRightButtonCornerRadius}" />
</Style>
<Style Selector="^:left /template/ RepeatButton#PART_IncreaseButton">
<Setter Property="Grid.Column" Value="0" />
<Setter Property="CornerRadius" Value="{DynamicResource SplitButtonSpinnerLeftButtonCornerRadius}" />
</Style>
</ControlTheme>
</ResourceDictionary>

View File

@@ -52,6 +52,15 @@
<Style Selector="^.Small">
<Setter Property="MinHeight" Value="{DynamicResource NumericUpDownSmallHeight}" />
</Style>
<Style Selector="^.Split">
<Style Selector="^ /template/ ButtonSpinner#PART_Spinner">
<Setter Property="Theme" Value="{DynamicResource SplitButtonSpinner}" />
</Style>
<Style Selector="^ /template/ TextBox#PART_TextBox">
<Setter Property="CornerRadius" Value="0" />
</Style>
</Style>
<Style Selector="^:error">
<Style Selector="^ /template/ TextBox#PART_TextBox">

View File

@@ -3,4 +3,10 @@
<StaticResource x:Key="ButtonSpinnerDecreaseButtonGlyph" ResourceKey="SemiIconChevronDown" />
<StaticResource x:Key="ButtonSpinnerButtonGroupCornerRadius" ResourceKey="SemiBorderRadiusSmall" />
<StaticResource x:Key="ButtonSpinnerButtonGroupBorderThickness" ResourceKey="SemiBorderThicknessControl" />
<StaticResource x:Key="SplitButtonSpinnerIncreaseButtonGlyph" ResourceKey="SemiIconPlus" />
<StaticResource x:Key="SplitButtonSpinnerDecreaseButtonGlyph" ResourceKey="SemiIconMinus" />
<CornerRadius x:Key="SplitButtonSpinnerLeftButtonCornerRadius">3 0 0 3</CornerRadius>
<CornerRadius x:Key="SplitButtonSpinnerRightButtonCornerRadius">0 3 3 0</CornerRadius>
<Thickness x:Key="SplitButtonSpinnerButtonPadding">8 0</Thickness>
</ResourceDictionary>