Merge pull request #487 from gehongyan/combobox-selectionbox

feat: ComboBox should respect SelectionBoxItemTemplate

demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml

@@ -27,6 +27,15 @@
         <ComboBox Classes="Small" />
         <ComboBox Classes="Bordered" />
         <ComboBox Classes="Bordered" IsEnabled="False" />
+        <ComboBox>
+          <ComboBox.SelectionBoxItemTemplate>
+            <DataTemplate DataType="x:String">
+              <ContentControl BorderThickness="1"
+                              BorderBrush="Gold"
+                              Content="{Binding}" />
+            </DataTemplate>
+          </ComboBox.SelectionBoxItemTemplate>
+        </ComboBox>
 
         <StackPanel Orientation="Horizontal">
             <ComboBox Width="100" Classes="Large" PlaceholderText="Large" />

demo/Semi.Avalonia.Demo/Pages/ToggleSwitchDemo.axaml

@@ -8,22 +8,23 @@
     d:DesignWidth="800"
     mc:Ignorable="d">
     <StackPanel Spacing="8" Margin="20">
-        <ToggleSwitch
+        <StackPanel Orientation="Horizontal">
-            Content="Content"
+            <StackPanel>
-            OffContent="OffContent"
+                <ToggleSwitch />
-            OnContent="OnContent" />
+                <ToggleSwitch IsChecked="True" />
-        <ToggleSwitch
+            </StackPanel>
-            Content="Content"
+            <StackPanel>
-            IsChecked="True"
+                <ToggleSwitch IsEnabled="False" />
-            IsEnabled="False"
+                <ToggleSwitch IsChecked="True" IsEnabled="False" />
-            OffContent="OffContent"
+            </StackPanel>
-            OnContent="OnContent" />
+        </StackPanel>
-        <ToggleSwitch
+        <StackPanel Orientation="Horizontal">
-            Content="Content"
+            <ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" />
-            IsChecked="False"
+            <ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" IsChecked="True"/>
-            IsEnabled="False"
+            <ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" IsEnabled="False" />
-            OffContent="OffContent"
+            <ToggleSwitch Content="Switch" OnContent="Yes" OffContent="No" IsEnabled="False" IsChecked="True" />
-            OnContent="OnContent" />
+        </StackPanel>
+
         <StackPanel Orientation="Horizontal">
             <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small" />
             <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small" IsChecked="True" />
@@ -44,8 +45,8 @@
         </StackPanel>
 
         <StackPanel Orientation="Horizontal">
-            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开"/>
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" />
-            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜"/>
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" />
         </StackPanel>
         <StackPanel Orientation="Horizontal">
             <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" IsChecked="True" />
@@ -60,21 +61,35 @@
             <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" Classes="Large" IsChecked="True" />
         </StackPanel>
 
-        <ToggleSwitch Theme="{DynamicResource ButtonToggleSwitch}">
+        <StackPanel Orientation="Horizontal">
-            <ToggleSwitch.OnContent>
+            <ToggleSwitch
-                <PathIcon
+                HorizontalAlignment="Left"
-                    Width="16"
+                Padding="8"
-                    Height="16"
+                Theme="{DynamicResource ButtonToggleSwitch}"
-                    Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
+                Foreground="{DynamicResource ButtonDefaultTertiaryForeground}">
-                    Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
+                <ToggleSwitch.Content>
-            </ToggleSwitch.OnContent>
+                    <PathIcon
-            <ToggleSwitch.OffContent>
+                        Theme="{DynamicResource InnerPathIcon}"
-                <PathIcon
+                        Data="M5 2H19C20.6569 2 22 3.34315 22 5V19C22 20.6569 20.6569 22 19 22H5C3.34315 22 2 20.6569 2 19V5C2 3.34315 3.34315 2 5 2ZM6 4C5.44772 4 5 4.44772 5 5V19C5 19.5523 5.44772 20 6 20H9C9.55229 20 10 19.5523 10 19V5C10 4.44772 9.55229 4 9 4H6Z" />
-                    Width="16"
+                </ToggleSwitch.Content>
-                    Height="16"
+            </ToggleSwitch>
-                    Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z"
+            <ToggleSwitch
-                    Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
+                HorizontalAlignment="Left"
-            </ToggleSwitch.OffContent>
+                Padding="8"
-        </ToggleSwitch>
+                Theme="{DynamicResource ButtonToggleSwitch}"
+                Foreground="{DynamicResource ButtonDefaultTertiaryForeground}">
+                <ToggleSwitch.OnContent>
+                    <PathIcon
+                        Theme="{DynamicResource InnerPathIcon}"
+                        Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13" />
+                </ToggleSwitch.OnContent>
+                <ToggleSwitch.OffContent>
+                    <PathIcon
+                        Theme="{DynamicResource InnerPathIcon}"
+                        Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z" />
+                </ToggleSwitch.OffContent>
+            </ToggleSwitch>
+        </StackPanel>
+
     </StackPanel>
 </UserControl>

demo/Semi.Avalonia.Demo/Themes/ToggleSwitch.axaml

@@ -1,67 +1,31 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="ThemeToggleSwitch" TargetType="ToggleSwitch">
+    <ControlTheme x:Key="ThemeToggleSwitch"
-        <Setter Property="HorizontalAlignment" Value="Center" />
+                  BasedOn="{StaticResource ButtonToggleSwitch}"
-        <Setter Property="VerticalAlignment" Value="Center" />
+                  TargetType="ToggleSwitch">
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="Padding" Value="8" />
-        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="OnContent" Value="{Binding $self.Content}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="OnContentTemplate">
             <DataTemplate>
                 <PathIcon Theme="{StaticResource InnerPathIcon}" Data="{Binding}" />
             </DataTemplate>
         </Setter>
+        <Setter Property="OffContent" Value="{Binding $self.Content}" />
         <Setter Property="OffContentTemplate">
             <DataTemplate>
                 <PathIcon Theme="{StaticResource InnerPathIcon}" Data="{Binding}" />
             </DataTemplate>
         </Setter>
-        <Setter Property="Template">
+        <Setter Property="ContentTemplate">
-            <ControlTemplate TargetType="ToggleSwitch">
+            <DataTemplate>
-                <Border
+                <PathIcon Theme="{StaticResource InnerPathIcon}" Data="{Binding}" />
-                    Name="Background"
+            </DataTemplate>
-                    Padding="{TemplateBinding Padding}"
-                    Background="{TemplateBinding Background}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}">
-                    <Panel>
-                        <Panel Name="PART_SwitchKnob" />
-                        <Panel Name="PART_MovingKnobs" />
-                        <ContentPresenter
-                            Name="PART_OnContentPresenter"
-                            IsVisible="{TemplateBinding IsChecked}"
-                            Content="{TemplateBinding OnContent}"
-                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
-                        <ContentPresenter
-                            Name="PART_OffContentPresenter"
-                            IsVisible="{TemplateBinding IsChecked, Converter={x:Static BoolConverters.Not}}"
-                            Content="{TemplateBinding OffContent}"
-                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
-                    </Panel>
-                </Border>
-            </ControlTemplate>
         </Setter>
-
-        <Style Selector="^:pointerover">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
-        </Style>
-        <Style Selector="^:pressed">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
-        </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="SplitViewToggleSwitch"
                   BasedOn="{StaticResource ThemeToggleSwitch}"
                   TargetType="ToggleSwitch">
-        <Setter Property="Width" Value="32" />
+        <Setter Property="Content"
-        <Setter Property="Height" Value="32" />
-        <Setter Property="OnContent"
                 Value="M5 2H19C20.6569 2 22 3.34315 22 5V19C22 20.6569 20.6569 22 19 22H5C3.34315 22 2 20.6569 2 19V5C2 3.34315 3.34315 2 5 2ZM6 4C5.44772 4 5 4.44772 5 5V19C5 19.5523 5.44772 20 6 20H9C9.55229 20 10 19.5523 10 19V5C10 4.44772 9.55229 4 9 4H6Z" />
-        <Setter Property="OffContent" Value="{Binding $self.OnContent}" />
     </ControlTheme>
 </ResourceDictionary>

demo/Semi.Avalonia.Demo/Views/MainView.axaml

@@ -52,14 +52,11 @@
                     <StackPanel.Styles>
                         <Style Selector="Button">
                             <Setter Property="Theme" Value="{DynamicResource BorderlessButton}" />
-                            <Setter Property="Width" Value="32" />
+                            <Setter Property="Padding" Value="8" />
-                            <Setter Property="Height" Value="32" />
                             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultTertiaryForeground}" />
                         </Style>
                         <Style Selector="ToggleSwitch">
                             <Setter Property="Theme" Value="{DynamicResource ThemeToggleSwitch}" />
-                            <Setter Property="Width" Value="32" />
-                            <Setter Property="Height" Value="32" />
                             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultTertiaryForeground}" />
                         </Style>
                         <Style Selector="PathIcon">

src/Semi.Avalonia/Controls/AutoCompleteBox.axaml

@@ -27,28 +27,25 @@
                             Watermark="{TemplateBinding Watermark}" />
                         <Popup
                             Name="PART_Popup"
-                            MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                             MaxHeight="{TemplateBinding MaxDropDownHeight}"
                             IsLightDismissEnabled="True"
                             PlacementTarget="{TemplateBinding}">
                             <Border
+                                MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                                 Margin="{DynamicResource AutoCompleteBoxPopupMargin}"
+                                Padding="{DynamicResource AutoCompleteBoxPopupPadding}"
                                 HorizontalAlignment="Stretch"
                                 Background="{DynamicResource AutoCompleteBoxPopupBackground}"
                                 BorderBrush="{DynamicResource AutoCompleteBoxPopupBorderBrush}"
                                 BorderThickness="{DynamicResource AutoCompleteBoxPopupBorderThickness}"
                                 BoxShadow="{DynamicResource AutoCompleteBoxPopupBoxShadow}"
                                 CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}">
-                                <Border
+                                <ListBox
-                                    CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}"
+                                    Name="PART_SelectingItemsControl"
-                                    ClipToBounds="True">
+                                    Foreground="{TemplateBinding Foreground}"
-                                    <ListBox
+                                    ItemTemplate="{TemplateBinding ItemTemplate}"
-                                        Name="PART_SelectingItemsControl"
+                                    ScrollViewer.HorizontalScrollBarVisibility="Auto"
-                                        Foreground="{TemplateBinding Foreground}"
+                                    ScrollViewer.VerticalScrollBarVisibility="Auto" />
-                                        ItemTemplate="{TemplateBinding ItemTemplate}"
-                                        ScrollViewer.HorizontalScrollBarVisibility="Auto"
-                                        ScrollViewer.VerticalScrollBarVisibility="Auto" />
-                                </Border>
                             </Border>
                         </Popup>
                     </Panel>
@@ -69,28 +66,25 @@
                             Watermark="{TemplateBinding Watermark}" />
                         <Popup
                             Name="PART_Popup"
-                            MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                             MaxHeight="{TemplateBinding MaxDropDownHeight}"
                             IsLightDismissEnabled="True"
                             PlacementTarget="{TemplateBinding}">
                             <Border
+                                MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                                 Margin="{DynamicResource AutoCompleteBoxPopupMargin}"
+                                Padding="{DynamicResource AutoCompleteBoxPopupPadding}"
                                 HorizontalAlignment="Stretch"
                                 Background="{DynamicResource AutoCompleteBoxPopupBackground}"
                                 BorderBrush="{DynamicResource AutoCompleteBoxPopupBorderBrush}"
                                 BorderThickness="{DynamicResource AutoCompleteBoxPopupBorderThickness}"
                                 BoxShadow="{DynamicResource AutoCompleteBoxPopupBoxShadow}"
                                 CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}">
-                                <Border
-                                    CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}"
-                                    ClipToBounds="True">
                                     <ListBox
                                         Name="PART_SelectingItemsControl"
                                         Foreground="{TemplateBinding Foreground}"
                                         ItemTemplate="{TemplateBinding ItemTemplate}"
                                         ScrollViewer.HorizontalScrollBarVisibility="Auto"
                                         ScrollViewer.VerticalScrollBarVisibility="Auto" />
-                                </Border>
                             </Border>
                         </Popup>
                     </Panel>

src/Semi.Avalonia/Controls/Calendar.axaml

@@ -95,7 +95,8 @@
                             Name="PART_MonthView"
                             Grid.Row="1"
                             HorizontalAlignment="Stretch"
-                            IsVisible="False">
+                            IsVisible="False"
+                            ColumnDefinitions="*,*,*,*,*,*,*">
                             <Grid.RowDefinitions>
                                 <RowDefinition Height="{DynamicResource CalendarItemWeekDayNameHeight}" />
                                 <RowDefinition Height="*" />
@@ -105,33 +106,14 @@
                                 <RowDefinition Height="*" />
                                 <RowDefinition Height="*" />
                             </Grid.RowDefinitions>
-                            <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                            </Grid.ColumnDefinitions>
                         </Grid>
                         <Grid
                             Name="PART_YearView"
                             Grid.Row="1"
                             Background="{TemplateBinding Background}"
-                            IsVisible="False">
+                            IsVisible="False"
-                            <Grid.RowDefinitions>
+                            ColumnDefinitions="*,*,*,*"
-                                <RowDefinition Height="*" />
+                            RowDefinitions="*,*,*" />
-                                <RowDefinition Height="*" />
-                                <RowDefinition Height="*" />
-                            </Grid.RowDefinitions>
-                            <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                                <ColumnDefinition Width="*" />
-                            </Grid.ColumnDefinitions>
-                        </Grid>
                     </Grid>
                 </Border>
             </ControlTemplate>
@@ -151,6 +133,7 @@
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="HorizontalAlignment" Value="Stretch" />
         <Setter Property="VerticalAlignment" Value="Stretch" />
+        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CalendarButton">
                 <ContentControl
@@ -211,6 +194,7 @@
         <Setter Property="VerticalAlignment" Value="Stretch" />
         <Setter Property="HorizontalContentAlignment" Value="Center" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CalendarDayButton">
                 <ContentControl

src/Semi.Avalonia/Controls/CalendarDatePicker.axaml

@@ -3,8 +3,8 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
     <Design.PreviewWith>
-        <StackPanel Margin="20" Width="300" Height="400">
+        <StackPanel Margin="20" Width="800" Height="400">
-            <CalendarDatePicker Classes="ClearButton" />
+            <CalendarDatePicker HorizontalAlignment="Center" Classes="ClearButton" />
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type CalendarDatePicker}" TargetType="CalendarDatePicker">
@@ -96,25 +96,22 @@
                             <Popup
                                 Name="PART_Popup"
                                 Grid.Column="0"
-                                HorizontalOffset="-8"
                                 IsLightDismissEnabled="True"
-                                PlacementTarget="{TemplateBinding}"
+                                Placement="BottomEdgeAlignedLeft"
-                                VerticalOffset="-4">
+                                PlacementTarget="{TemplateBinding}">
                                 <Border
-                                    Margin="8"
+                                    Margin="4"
-                                    Background="Transparent"
                                     BoxShadow="{DynamicResource CalendarDatePickerPopupBoxShadows}"
                                     CornerRadius="{DynamicResource CalendarCornerRadius}">
                                     <Calendar
                                         Name="PART_Calendar"
-                                        CornerRadius="{Binding $parent[Border].CornerRadius}"
+                                        BorderThickness="0"
                                         DisplayDate="{TemplateBinding DisplayDate}"
                                         DisplayDateEnd="{TemplateBinding DisplayDateEnd}"
                                         DisplayDateStart="{TemplateBinding DisplayDateStart}"
                                         FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}"
                                         IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}"
-                                        SelectedDate="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedDate, Mode=TwoWay}">
+                                        SelectedDate="{TemplateBinding SelectedDate, Mode=TwoWay}" />
-                                    </Calendar>
                                 </Border>
                             </Popup>
                         </Grid>

src/Semi.Avalonia/Controls/ComboBox.axaml

@@ -76,7 +76,7 @@
                             HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                             VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                             Content="{TemplateBinding SelectionBoxItem}"
-                            ContentTemplate="{TemplateBinding ItemTemplate}" />
+                            ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" />
                         <Button
                             Name="ClearButton"
                             Grid.Column="1"
@@ -100,9 +100,7 @@
                         <Popup
                             Name="PART_Popup"
                             Grid.Column="0"
-                            MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                             MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                            ClipToBounds="False"
                             InheritsTransform="True"
                             IsLightDismissEnabled="True"
                             IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
@@ -111,24 +109,22 @@
                             <Border
                                 Name="PopupBorder"
                                 HorizontalAlignment="Stretch"
+                                MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
                                 Margin="{DynamicResource ComboBoxPopupBorderMargin}"
+                                Padding="{DynamicResource ComboBoxPopupBorderPadding}"
                                 Background="{DynamicResource ComboBoxPopupBackground}"
                                 BorderBrush="{DynamicResource ComboBoxPopupBorderBrush}"
                                 BorderThickness="{DynamicResource ComboBoxPopupBorderThickness}"
                                 BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
                                 CornerRadius="{DynamicResource ComboBoxPopupBoxCornerRadius}">
-                                <Border
+                                <ScrollViewer
-                                    CornerRadius="{DynamicResource ComboBoxPopupBoxCornerRadius}"
+                                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                                    ClipToBounds="True">
+                                    IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
-                                    <ScrollViewer
+                                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-                                        HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                                    <ItemsPresenter
-                                        IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
+                                        Name="PART_ItemsPresenter"
-                                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+                                        ItemsPanel="{TemplateBinding ItemsPanel}" />
-                                        <ItemsPresenter
+                                </ScrollViewer>
-                                            Name="PART_ItemsPresenter"
-                                            ItemsPanel="{TemplateBinding ItemsPanel}" />
-                                    </ScrollViewer>
-                                </Border>
                             </Border>
                         </Popup>
                     </Grid>

src/Semi.Avalonia/Controls/Menu.axaml

@@ -10,81 +10,77 @@
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="Template">
             <ControlTemplate TargetType="ScrollViewer">
-                <Border 
+                <DockPanel>
-                    ClipToBounds="True"
+                    <DockPanel.Styles>
-                    CornerRadius="{TemplateBinding CornerRadius}">
+                        <Style Selector="RepeatButton:pressed">
-                    <DockPanel>
+                            <Setter Property="RenderTransform" Value="{x:Null}" />
-                        <DockPanel.Styles>
+                        </Style>
-                            <Style Selector="RepeatButton:pressed">
+                    </DockPanel.Styles>
-                                <Setter Property="RenderTransform" Value="{x:Null}" />
+                    <RepeatButton
-                            </Style>
+                        HorizontalAlignment="Stretch"
-                        </DockPanel.Styles>
+                        HorizontalContentAlignment="Center"
-                        <RepeatButton
+                        Background="Transparent"
-                            HorizontalAlignment="Stretch"
+                        BorderThickness="0"
-                            HorizontalContentAlignment="Center"
+                        Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}"
-                            Background="Transparent"
+                        CornerRadius="0"
-                            BorderThickness="0"
+                        DockPanel.Dock="Top"
-                            Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}"
+                        RenderTransform="{x:Null}">
-                            CornerRadius="0"
+                        <RepeatButton.IsVisible>
-                            DockPanel.Dock="Top"
+                            <MultiBinding
-                            RenderTransform="{x:Null}">
+                                Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
-                            <RepeatButton.IsVisible>
+                                ConverterParameter="0">
-                                <MultiBinding
+                                <Binding Path="VerticalScrollBarVisibility"
-                                    Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
+                                         RelativeSource="{RelativeSource TemplatedParent}" />
-                                    ConverterParameter="0">
+                                <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
-                                    <Binding Path="VerticalScrollBarVisibility"
+                                <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                                             RelativeSource="{RelativeSource TemplatedParent}" />
+                                <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                                    <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
+                            </MultiBinding>
-                                    <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                        </RepeatButton.IsVisible>
-                                    <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                        <PathIcon
-                                </MultiBinding>
+                            Theme="{DynamicResource InnerPathIcon}"
-                            </RepeatButton.IsVisible>
+                            Data="{DynamicResource MenuScrollViewerUpButtonGlyph}"
-                            <PathIcon
+                            Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
-                                Theme="{DynamicResource InnerPathIcon}"
+                    </RepeatButton>
-                                Data="{DynamicResource MenuScrollViewerUpButtonGlyph}"
+                    <RepeatButton
-                                Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
+                        HorizontalAlignment="Stretch"
-                        </RepeatButton>
+                        HorizontalContentAlignment="Center"
-                        <RepeatButton
+                        Background="Transparent"
-                            HorizontalAlignment="Stretch"
+                        BorderThickness="0"
-                            HorizontalContentAlignment="Center"
+                        Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}"
-                            Background="Transparent"
+                        CornerRadius="0"
-                            BorderThickness="0"
+                        DockPanel.Dock="Bottom"
-                            Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}"
+                        RenderTransform="{x:Null}">
-                            CornerRadius="0"
+                        <RepeatButton.IsVisible>
-                            DockPanel.Dock="Bottom"
+                            <MultiBinding
-                            RenderTransform="{x:Null}">
+                                Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
-                            <RepeatButton.IsVisible>
+                                ConverterParameter="100">
-                                <MultiBinding
+                                <Binding Path="VerticalScrollBarVisibility"
-                                    Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
+                                         RelativeSource="{RelativeSource TemplatedParent}" />
-                                    ConverterParameter="100">
+                                <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
-                                    <Binding Path="VerticalScrollBarVisibility"
+                                <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                                             RelativeSource="{RelativeSource TemplatedParent}" />
+                                <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                                    <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
+                            </MultiBinding>
-                                    <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                        </RepeatButton.IsVisible>
-                                    <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                        <PathIcon
-                                </MultiBinding>
+                            Theme="{DynamicResource InnerPathIcon}"
-                            </RepeatButton.IsVisible>
+                            Data="{DynamicResource MenuScrollViewerDownButtonGlyph}"
-                            <PathIcon
+                            Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
-                                Theme="{DynamicResource InnerPathIcon}"
+                    </RepeatButton>
-                                Data="{DynamicResource MenuScrollViewerDownButtonGlyph}"
+                    <ScrollContentPresenter
-                                Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
+                        Name="PART_ContentPresenter"
-                        </RepeatButton>
+                        Margin="{TemplateBinding Padding}"
-                        <ScrollContentPresenter
+                        HorizontalSnapPointsAlignment="{TemplateBinding HorizontalSnapPointsAlignment}"
-                            Name="PART_ContentPresenter"
+                        HorizontalSnapPointsType="{TemplateBinding HorizontalSnapPointsType}"
-                            Margin="{TemplateBinding Padding}"
+                        VerticalSnapPointsAlignment="{TemplateBinding VerticalSnapPointsAlignment}"
-                            HorizontalSnapPointsAlignment="{TemplateBinding HorizontalSnapPointsAlignment}"
+                        VerticalSnapPointsType="{TemplateBinding VerticalSnapPointsType}">
-                            HorizontalSnapPointsType="{TemplateBinding HorizontalSnapPointsType}"
+                        <ScrollContentPresenter.GestureRecognizers>
-                            VerticalSnapPointsAlignment="{TemplateBinding VerticalSnapPointsAlignment}"
+                            <ScrollGestureRecognizer
-                            VerticalSnapPointsType="{TemplateBinding VerticalSnapPointsType}">
+                                CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
-                            <ScrollContentPresenter.GestureRecognizers>
+                                CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}"
-                                <ScrollGestureRecognizer
+                                IsScrollInertiaEnabled="{Binding IsScrollInertiaEnabled, RelativeSource={RelativeSource TemplatedParent}}" />
-                                    CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
+                        </ScrollContentPresenter.GestureRecognizers>
-                                    CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}"
+                    </ScrollContentPresenter>
-                                    IsScrollInertiaEnabled="{Binding IsScrollInertiaEnabled, RelativeSource={RelativeSource TemplatedParent}}" />
+                </DockPanel>
-                            </ScrollContentPresenter.GestureRecognizers>
-                        </ScrollContentPresenter>
-                    </DockPanel>
-                </Border>
             </ControlTemplate>
         </Setter>
     </ControlTheme>
@@ -113,7 +109,6 @@
     <ControlTheme x:Key="{x:Type MenuItem}" TargetType="MenuItem">
         <Setter Property="Background" Value="{DynamicResource MenuItemBackground}" />
         <Setter Property="Foreground" Value="{DynamicResource MenuItemForeground}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource MenuItemCornerRadius}" />
         <Setter Property="Cursor" Value="Hand" />
         <!--  Narrow padding should be used for mouse input, when non-narrow one should be used for touch input in future.  -->
         <Setter Property="Padding" Value="{DynamicResource MenuItemPadding}" />

src/Semi.Avalonia/Controls/ToggleSwitch.axaml

@@ -3,22 +3,45 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
     <Design.PreviewWith>
-        <StackPanel Margin="20">
+        <ThemeVariantScope RequestedThemeVariant="Dark">
-            <ToggleSwitch
+            <StackPanel Spacing="8" Background="{DynamicResource SemiBackground0Color}">
-                Content="Content"
+                <StackPanel Orientation="Horizontal">
-                OffContent="OffContent"
+                    <ToggleSwitch Classes="Small" />
-                OnContent="OnContent" />
+                    <ToggleSwitch Classes="Small" IsChecked="True" />
-        </StackPanel>
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <ToggleSwitch />
+                    <ToggleSwitch IsChecked="True" />
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <ToggleSwitch Classes="Large" />
+                    <ToggleSwitch Classes="Large" IsChecked="True" />
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}" OnContent="是" OffContent="否" Classes="Small" />
+                    <ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}" OnContent="是" OffContent="否" Classes="Small" IsChecked="True" />
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}" OnContent="是" OffContent="否" />
+                    <ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}" OnContent="是" OffContent="否" IsChecked="True" />
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}" OnContent="是" OffContent="否" Classes="Large" />
+                    <ToggleSwitch Theme="{DynamicResource SimpleToggleSwitch}" OnContent="是" OffContent="否" Classes="Large" IsChecked="True" />
+                </StackPanel>
+            </StackPanel>
+        </ThemeVariantScope>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type ToggleSwitch}" TargetType="ToggleSwitch">
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="FocusAdorner">
             <FocusAdornerTemplate>
                 <Border Theme="{DynamicResource AdornerLayerBorder}"
-                        CornerRadius="{DynamicResource ToggleSwitchIndicatorCornerRadius}"/>
+                        CornerRadius="{DynamicResource ToggleSwitchIndicatorCornerRadius}" />
             </FocusAdornerTemplate>
         </Setter>
         <Setter Property="KnobTransitions">
@@ -32,9 +55,7 @@
         <Setter Property="Template">
             <ControlTemplate TargetType="ToggleSwitch">
                 <Grid
-                    Background="{TemplateBinding Background}"
+                    RowDefinitions="Auto, *"
-                    Cursor="Hand"
-                    RowDefinitions="Auto,*"
                     ColumnDefinitions="Auto, *">
                     <ContentPresenter
                         Name="PART_ContentPresenter"
@@ -53,9 +74,10 @@
                         TemplatedControl.IsTemplateFocusTarget="True"
                         Width="{DynamicResource ToggleSwitchDefaultWidth}"
                         Height="{DynamicResource ToggleSwitchDefaultHeight}"
+                        BackgroundSizing="OuterBorderEdge"
                         BorderBrush="{DynamicResource ToggleSwitchDefaultBorderBrush}"
-                        BorderThickness="1"
+                        BorderThickness="{DynamicResource ToggleSwitchDefaultBorderThickness}"
-                        CornerRadius="{DynamicResource ToggleSwitchIndicatorCornerRadius}">
+                        CornerRadius="{DynamicResource ToggleSwitchDefaultCornerRadius}">
                         <Border.Transitions>
                             <Transitions>
                                 <BrushTransition Property="Background" Duration="0:0:0.2" />
@@ -66,7 +88,7 @@
                             Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                             Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                             HorizontalAlignment="Left">
-                            <Grid
+                            <Panel
                                 Name="PART_MovingKnobs"
                                 Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                                 Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
@@ -79,7 +101,7 @@
                                 <Arc
                                     Name="SwitchKnobLoadingIndicator"
                                     IsVisible="False"
-                                    StrokeThickness="2"
+                                    StrokeThickness="{DynamicResource ToggleSwitchLoadingIndicatorDefaultStrokeThickness}"
                                     StartAngle="0"
                                     SweepAngle="140"
                                     StrokeJoin="Round"
@@ -107,7 +129,7 @@
                                         </Style>
                                     </Arc.Styles>
                                 </Arc>
-                            </Grid>
+                            </Panel>
                         </Canvas>
                     </Border>
 
@@ -156,7 +178,6 @@
             <Style Selector="^:disabled /template/ Border#SwitchBackgroundBorder">
                 <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedDisabledBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchContainerUnCheckedDisabledBorderBrush}" />
-                <Setter Property="BorderThickness" Value="1" />
             </Style>
         </Style>
 
@@ -200,15 +221,16 @@
             <Style Selector="^ /template/ Border#SwitchBackgroundBorder">
                 <Setter Property="Width" Value="{DynamicResource ToggleSwitchSmallWidth}" />
                 <Setter Property="Height" Value="{DynamicResource ToggleSwitchSmallHeight}" />
+                <Setter Property="CornerRadius" Value="{DynamicResource ToggleSwitchSmallCornerRadius}" />
             </Style>
             <Style Selector="^ /template/ Canvas#PART_SwitchKnob">
                 <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
                 <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
             </Style>
-            <Style Selector="^ /template/ Grid#PART_MovingKnobs">
+            <Style Selector="^ /template/ Panel#PART_MovingKnobs">
                 <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
                 <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
-                <Setter Property="Margin" Value="{DynamicResource ToggleSwitchIndicatorSmallMargin}"/>
+                <Setter Property="Margin" Value="{DynamicResource ToggleSwitchIndicatorSmallMargin}" />
             </Style>
             <Style Selector="^ /template/ Arc#SwitchKnobLoadingIndicator">
                 <Setter Property="StrokeThickness" Value="{DynamicResource ToggleSwitchLoadingIndicatorSmallStrokeThickness}" />
@@ -218,15 +240,16 @@
             <Style Selector="^ /template/ Border#SwitchBackgroundBorder">
                 <Setter Property="Width" Value="{DynamicResource ToggleSwitchLargeWidth}" />
                 <Setter Property="Height" Value="{DynamicResource ToggleSwitchLargeHeight}" />
+                <Setter Property="CornerRadius" Value="{DynamicResource ToggleSwitchLargeCornerRadius}" />
             </Style>
             <Style Selector="^ /template/ Canvas#PART_SwitchKnob">
                 <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
                 <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
             </Style>
-            <Style Selector="^ /template/ Grid#PART_MovingKnobs">
+            <Style Selector="^ /template/ Panel#PART_MovingKnobs">
                 <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
                 <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
-                <Setter Property="Margin" Value="{DynamicResource ToggleSwitchIndicatorLargeMargin}"/>
+                <Setter Property="Margin" Value="{DynamicResource ToggleSwitchIndicatorLargeMargin}" />
             </Style>
             <Style Selector="^ /template/ Arc#SwitchKnobLoadingIndicator">
                 <Setter Property="StrokeThickness" Value="{DynamicResource ToggleSwitchLoadingIndicatorLargeStrokeThickness}" />
@@ -234,69 +257,25 @@
         </Style>
     </ControlTheme>
 
-    <ControlTheme
-        x:Key="ButtonToggleSwitch"
-        BasedOn="{StaticResource {x:Type ToggleSwitch}}"
-        TargetType="ToggleSwitch">
-        <Setter Property="Padding" Value="8" />
-        <Setter Property="CornerRadius" Value="3" />
-        <Setter Property="Background" Value="Transparent" />
-        <Setter Property="FocusAdorner">
-            <FocusAdornerTemplate>
-                <Border Theme="{StaticResource AdornerLayerBorder}" />
-            </FocusAdornerTemplate>
-        </Setter>
-        <Setter Property="Template">
-            <ControlTemplate TargetType="ToggleSwitch">
-                <Border
-                    Name="Background"
-                    Padding="{TemplateBinding Padding}"
-                    Background="{TemplateBinding Background}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    Cursor="Hand">
-                    <Panel>
-                        <Panel Name="PART_SwitchKnob" />
-                        <Panel Name="PART_MovingKnobs" />
-                        <ContentPresenter
-                            Name="PART_OnContentPresenter"
-                            Margin="{DynamicResource ToggleSwitchOnContentMargin}"
-                            Content="{TemplateBinding OnContent}"
-                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
-                        <ContentPresenter
-                            Name="PART_OffContentPresenter"
-                            Margin="{DynamicResource ToggleSwitchOnContentMargin}"
-                            Content="{TemplateBinding OffContent}"
-                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
-                    </Panel>
-                </Border>
-            </ControlTemplate>
-        </Setter>
-        <Style Selector="^:pointerover">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
-        </Style>
-        <Style Selector="^:pressed">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
-        </Style>
-    </ControlTheme>
-
     <ControlTheme
         x:Key="SimpleToggleSwitch"
         BasedOn="{StaticResource {x:Type ToggleSwitch}}"
         TargetType="ToggleSwitch">
         <Setter Property="OnContent" Value="{x:Null}" />
         <Setter Property="OffContent" Value="{x:Null}" />
+        <Setter Property="Content" Value="{x:Null}" />
         <Setter Property="FontSize" Value="{DynamicResource SimpleToggleSwitchFontSize}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="ToggleSwitch">
                 <Border
                     Name="SwitchBackgroundBorder"
                     Background="{TemplateBinding Background}"
-                    Cursor="Hand"
                     Width="{DynamicResource ToggleSwitchDefaultWidth}"
                     Height="{DynamicResource ToggleSwitchDefaultHeight}"
+                    BackgroundSizing="OuterBorderEdge"
                     BorderBrush="{DynamicResource ToggleSwitchDefaultBorderBrush}"
-                    BorderThickness="1"
+                    BorderThickness="{DynamicResource ToggleSwitchDefaultBorderThickness}"
-                    CornerRadius="{DynamicResource ToggleSwitchIndicatorCornerRadius}">
+                    CornerRadius="{DynamicResource ToggleSwitchDefaultCornerRadius}">
                     <Border.Transitions>
                         <Transitions>
                             <BrushTransition Property="Background" Duration="0:0:0.2" />
@@ -311,7 +290,7 @@
                             Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                             Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                             HorizontalAlignment="Left">
-                            <Grid
+                            <Panel
                                 Name="PART_MovingKnobs"
                                 Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                                 Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
@@ -324,7 +303,7 @@
                                 <Arc
                                     Name="SwitchKnobLoadingIndicator"
                                     IsVisible="False"
-                                    StrokeThickness="2"
+                                    StrokeThickness="{DynamicResource ToggleSwitchLoadingIndicatorDefaultStrokeThickness}"
                                     StartAngle="0"
                                     SweepAngle="140"
                                     StrokeJoin="Round"
@@ -352,7 +331,7 @@
                                         </Style>
                                     </Arc.Styles>
                                 </Arc>
-                            </Grid>
+                            </Panel>
                         </Canvas>
                         <ContentPresenter
                             Name="PART_OnContentPresenter"
@@ -391,4 +370,105 @@
             </Style>
         </Style>
     </ControlTheme>
+
+    <ControlTheme x:Key="ButtonToggleSwitch" TargetType="ToggleSwitch">
+        <Setter Property="HorizontalAlignment" Value="Center" />
+        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
+        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
+        <Setter Property="Cursor" Value="Hand" />
+        <Setter Property="OnContent" Value="{x:Null}" />
+        <Setter Property="OffContent" Value="{x:Null}" />
+        <Setter Property="Content" Value="{x:Null}" />
+        <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
+        <Setter Property="FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
+        <Setter Property="FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
+        <Setter Property="Template">
+            <ControlTemplate TargetType="ToggleSwitch">
+                <Border
+                    Name="Background"
+                    Padding="{TemplateBinding Padding}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <Panel>
+                        <Panel Name="PART_SwitchKnob" />
+                        <Panel Name="PART_MovingKnobs" />
+                        <ContentPresenter
+                            Name="PART_OnContentPresenter"
+                            IsVisible="{TemplateBinding IsChecked}"
+                            Content="{TemplateBinding OnContent}"
+                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
+                        <ContentPresenter
+                            Name="PART_OffContentPresenter"
+                            IsVisible="{TemplateBinding IsChecked, Converter={x:Static BoolConverters.Not}}"
+                            Content="{TemplateBinding OffContent}"
+                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
+                        <ContentPresenter
+                            Name="PART_ContentPresenter"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}">
+                            <ContentPresenter.IsVisible>
+                                <MultiBinding Converter="{x:Static BoolConverters.And}">
+                                    <TemplateBinding Property="Content" Converter="{x:Static ObjectConverters.IsNotNull}" />
+                                    <TemplateBinding Property="OnContent" Converter="{x:Static ObjectConverters.IsNull}" />
+                                    <TemplateBinding Property="OffContent" Converter="{x:Static ObjectConverters.IsNull}" />
+                                </MultiBinding>
+                            </ContentPresenter.IsVisible>
+                        </ContentPresenter>
+                    </Panel>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^:pressed">
+            <Setter Property="RenderTransform" Value="scale(0.98)" />
+        </Style>
+
+        <Style Selector="^ /template/ Border#Background">
+            <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
+            <Setter Property="Background" Value="{TemplateBinding Background}" />
+        </Style>
+
+        <Style Selector="^:pointerover /template/ Border#Background">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
+        </Style>
+
+        <Style Selector="^:pressed /template/ Border#Background">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
+        </Style>
+
+        <Style Selector="^:disabled /template/ Border#Background">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
+            <!-- <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" /> -->
+        </Style>
+
+        <Style Selector="^.Large">
+            <Setter Property="MinHeight" Value="{DynamicResource ButtonLargeHeight}" />
+            <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="MinHeight" Value="{DynamicResource ButtonSmallHeight}" />
+            <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
+        </Style>
+
+        <Style Selector="^ /template/ Border#Background">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderlessBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonBorderlessBackground}" />
+        </Style>
+        <Style Selector="^:disabled /template/ Border#Background">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderlessBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonBorderlessBackground}" />
+            <!-- <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" /> -->
+        </Style>
+    </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Shared/AutoCompleteBox.axaml

@@ -1,6 +1,7 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
+    <Thickness x:Key="AutoCompleteBoxPopupPadding">0 4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
     <x:Double x:Key="AutoCompleteBoxDefaultHeight">32</x:Double>
     <x:Double x:Key="AutoCompleteBoxSmallHeight">24</x:Double>

src/Semi.Avalonia/Themes/Shared/ComboBox.axaml

@@ -14,6 +14,7 @@
         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
     </StreamGeometry>
     <Thickness x:Key="ComboBoxPopupBorderMargin">4</Thickness>
+    <Thickness x:Key="ComboBoxPopupBorderPadding">0 4</Thickness>
 
     <x:Double x:Key="ComboBoxDefaultHeight">32</x:Double>
     <x:Double x:Key="ComboBoxSmallHeight">24</x:Double>

src/Semi.Avalonia/Themes/Shared/ListBox.axaml

@@ -1,6 +1,6 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!-- ListBox -->
     <Thickness x:Key="ListBoxItemDefaultPadding">12 8</Thickness>
-    <CornerRadius x:Key="ListBoxItemCornerRadius">3</CornerRadius>
+    <CornerRadius x:Key="ListBoxItemCornerRadius">0</CornerRadius>
 
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Shared/Menu.axaml

@@ -6,7 +6,7 @@
 
     <!--  MenuFlyout  -->
     <Thickness x:Key="MenuFlyoutBorderThickness">1</Thickness>
-    <Thickness x:Key="MenuFlyoutPadding">0</Thickness>
+    <Thickness x:Key="MenuFlyoutPadding">0 4</Thickness>
     <CornerRadius x:Key="MenuFlyoutCornerRadius">6</CornerRadius>
     <x:Double x:Key="MenuFlyoutMinHeight">16</x:Double>
     <x:Double x:Key="MenuFlyoutMinWidth">100</x:Double>

src/Semi.Avalonia/Themes/Shared/ToggleSwitch.axaml

@@ -5,13 +5,18 @@
     <x:Double x:Key="ToggleSwitchDefaultWidth">40</x:Double>
     <x:Double x:Key="ToggleSwitchSmallWidth">26</x:Double>
     <x:Double x:Key="ToggleSwitchLargeWidth">54</x:Double>
+    <Thickness x:Key="ToggleSwitchDefaultBorderThickness">1</Thickness>
+    <CornerRadius x:Key="ToggleSwitchDefaultCornerRadius">12</CornerRadius>
+    <CornerRadius x:Key="ToggleSwitchSmallCornerRadius">8</CornerRadius>
+    <CornerRadius x:Key="ToggleSwitchLargeCornerRadius">16</CornerRadius>
     <CornerRadius x:Key="ToggleSwitchIndicatorCornerRadius">100</CornerRadius>
     <x:Double x:Key="ToggleSwitchIndicatorDefaultWidth">18</x:Double>
     <x:Double x:Key="ToggleSwitchIndicatorSmallWidth">12</x:Double>
     <x:Double x:Key="ToggleSwitchIndicatorLargeWidth">24</x:Double>
-    <Thickness x:Key="ToggleSwitchIndicatorDefaultMargin">2 0 0 0</Thickness>
+    <Thickness x:Key="ToggleSwitchIndicatorDefaultMargin">1 0 0 0</Thickness>
-    <Thickness x:Key="ToggleSwitchIndicatorSmallMargin">1 0 0 0</Thickness>
+    <Thickness x:Key="ToggleSwitchIndicatorSmallMargin">0</Thickness>
-    <Thickness x:Key="ToggleSwitchIndicatorLargeMargin">3 0 0 0</Thickness>
+    <Thickness x:Key="ToggleSwitchIndicatorLargeMargin">2 0 0 0</Thickness>
+    <x:Double x:Key="ToggleSwitchLoadingIndicatorDefaultStrokeThickness">2</x:Double>
     <x:Double x:Key="ToggleSwitchLoadingIndicatorSmallStrokeThickness">1</x:Double>
     <x:Double x:Key="ToggleSwitchLoadingIndicatorLargeStrokeThickness">3</x:Double>