fix: fix ButtonGroup Height & Padding issue.

demo/Ursa.Demo/Pages/ButtonGroupDemo.axaml

@@ -11,25 +11,37 @@
     x:CompileBindings="True"
     x:DataType="vm:ButtonGroupDemoViewModel"
     mc:Ignorable="d">
-
     <StackPanel Margin="20" Spacing="20">
-        <u:ButtonGroup Classes="Primary Solid" 
-                       CommandBinding="{Binding InvokeCommand}"
-                       ItemsSource="{Binding Items}" >
+        <u:ButtonGroup
+            Classes="Primary Solid"
+            CommandBinding="{Binding InvokeCommand}"
+            ItemsSource="{Binding Items}">
             <u:ButtonGroup.ItemTemplate>
                 <DataTemplate x:DataType="vm:ButtonItem">
                     <TextBlock>
-                        <Run Text="🐼"></Run>
-                        <Run Text="{Binding Name}"></Run>
+                        <Run Text="🐼" />
+                        <Run Text="{Binding Name}" />
                     </TextBlock>
                 </DataTemplate>
             </u:ButtonGroup.ItemTemplate>
         </u:ButtonGroup>
-        
-        <u:ButtonGroup Classes="Primary" 
-                       ContentBinding="{Binding Name}"
-                       CommandBinding="{Binding InvokeCommand}"
-                       ItemsSource="{Binding Items}" >
-        </u:ButtonGroup>
+
+        <u:ButtonGroup
+            Classes="Success"
+            ContentBinding="{Binding Name}"
+            CommandBinding="{Binding InvokeCommand}"
+            ItemsSource="{Binding Items}" />
+
+        <u:ButtonGroup
+            Classes="Warning Small"
+            ContentBinding="{Binding Name}"
+            CommandBinding="{Binding InvokeCommand}"
+            ItemsSource="{Binding Items}" />
+
+        <u:ButtonGroup
+            Classes="Danger Large"
+            ContentBinding="{Binding Name}"
+            CommandBinding="{Binding InvokeCommand}"
+            ItemsSource="{Binding Items}" />
     </StackPanel>
-</UserControl>
+</UserControl>

src/Ursa.Themes.Semi/Controls/ButtonGroup.axaml

@@ -14,7 +14,7 @@
         <Setter Property="VerticalAlignment" Value="Top" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="Background" Value="{DynamicResource ButtonGroupDefaultBackground}" />
-        <Setter Property="CornerRadius" Value="3" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ButtonGroupCornerRadius}" />
         <Setter Property="ClipToBounds" Value="True" />
         <Setter Property="ItemContainerTheme" Value="{DynamicResource ButtonGroupItemTheme}" />
         <Setter Property="ItemsPanel">
@@ -28,9 +28,11 @@
                     Background="{TemplateBinding Background}"
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
-                    ClipToBounds="True"
-                    CornerRadius="{TemplateBinding CornerRadius}">
-                    <ItemsPresenter Name="PART_ItemsPresenter" ItemsPanel="{TemplateBinding ItemsPanel}" />
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    ClipToBounds="True">
+                    <ItemsPresenter
+                        Name="PART_ItemsPresenter"
+                        ItemsPanel="{TemplateBinding ItemsPanel}" />
                 </Border>
             </ControlTemplate>
         </Setter>
@@ -41,6 +43,7 @@
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="Padding" Value="{DynamicResource ButtonGroupDefaultPadding}" />
+        <Setter Property="MinHeight" Value="{DynamicResource ButtonGroupDefaultMinHeight}" />
         <Setter Property="FontWeight" Value="{DynamicResource ButtonGroupDefaultFontWeight}" />
         <Setter Property="Cursor" Value="Hand" />
         <Setter Property="Template">
@@ -48,10 +51,9 @@
                 <DockPanel LastChildFill="True">
                     <Rectangle
                         Name="PART_Separator"
-                        Width="1"
-                        Height="16"
-                        VerticalAlignment="Center"
                         DockPanel.Dock="Right"
+                        Width="1"
+                        Height="{DynamicResource ButtonGroupSeparatorHeight}"
                         Fill="{DynamicResource ButtonGroupSeparatorForeground}" />
                     <Border
                         Background="{TemplateBinding Background}"
@@ -71,4 +73,4 @@
             </ControlTemplate>
         </Setter>
     </ControlTheme>
-</ResourceDictionary>
+</ResourceDictionary>

src/Ursa.Themes.Semi/Styles/ButtonGroup.axaml

@@ -23,9 +23,11 @@
     </Style>
     <Style Selector="u|ButtonGroup.Large Button">
         <Setter Property="Padding" Value="{DynamicResource ButtonGroupLargePadding}" />
+        <Setter Property="MinHeight" Value="{DynamicResource ButtonGroupLargeMinHeight}" />
     </Style>
     <Style Selector="u|ButtonGroup.Small Button">
         <Setter Property="Padding" Value="{DynamicResource ButtonGroupSmallPadding}" />
+        <Setter Property="MinHeight" Value="{DynamicResource ButtonGroupSmallMinHeight}" />
     </Style>
     <Style Selector="u|ButtonGroup Button:pointerover">
         <Setter Property="Background" Value="{DynamicResource ButtonGroupDefaultPointeroverBackground}" />
@@ -125,4 +127,4 @@
         </Style>
     </Style>
 
-</Styles>
+</Styles>

src/Ursa.Themes.Semi/Themes/Shared/ButtonGroup.axaml

@@ -1,10 +1,13 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <!--  Add Resources Here  -->
     <x:Double x:Key="ButtonGroupDefaultFontSize">14</x:Double>
     <FontWeight x:Key="ButtonGroupDefaultFontWeight">600</FontWeight>
     <CornerRadius x:Key="ButtonGroupCornerRadius">3</CornerRadius>
 
-    <Thickness x:Key="ButtonGroupDefaultPadding">12 6</Thickness>
-    <Thickness x:Key="ButtonGroupLargePadding">16 10</Thickness>
-    <Thickness x:Key="ButtonGroupSmallPadding">6 2</Thickness>
-</ResourceDictionary>
+    <x:Double x:Key="ButtonGroupSeparatorHeight">20</x:Double>
+    <Thickness x:Key="ButtonGroupDefaultPadding">12 0</Thickness>
+    <Thickness x:Key="ButtonGroupLargePadding">16 0</Thickness>
+    <Thickness x:Key="ButtonGroupSmallPadding">12 0</Thickness>
+    <x:Double x:Key="ButtonGroupDefaultMinHeight">32</x:Double>
+    <x:Double x:Key="ButtonGroupLargeMinHeight">40</x:Double>
+    <x:Double x:Key="ButtonGroupSmallMinHeight">24</x:Double>
+</ResourceDictionary>