Avalonia/src/Avalonia.Themes.Default/Controls/SplitButton.xaml

<Styles xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        x:CompileBindings="True"
        xmlns:converters="using:Avalonia.Controls.Converters">

  <!-- This style is heavily based on the Fluent v1 style.
       The base resources are switched out along with a few minor changes such as Padding, CornerRadius. -->

  <Design.PreviewWith>
    <Border Padding="20">
      <SplitButton />
    </Border>
  </Design.PreviewWith>

  <Styles.Resources>
    <x:Double x:Key="SplitButtonPrimaryButtonSize">24</x:Double>
    <x:Double x:Key="SplitButtonSecondaryButtonSize">24</x:Double>
    <x:Double x:Key="SplitButtonSeparatorWidth">1</x:Double>
    <Thickness x:Key="SplitButtonBorderThemeThickness">1</Thickness>

    <converters:MarginMultiplierConverter x:Key="PrimaryButtonBorderMultiplier" Left="True" Top="True" Bottom="True" Indent="1" />
    <converters:MarginMultiplierConverter x:Key="SecondaryButtonBorderMultiplier" Right="True" Top="True" Bottom="True" Indent="1" />
    <converters:MarginMultiplierConverter x:Key="SeparatorBorderMultiplier" Top="True" Bottom="True" Indent="1" />
    <converters:CornerRadiusFilterConverter x:Key="TopCornerRadiusFilterConverter" Filter="TopLeft, TopRight"/>
    <converters:CornerRadiusFilterConverter x:Key="RightCornerRadiusFilterConverter" Filter="TopRight, BottomRight"/>
    <converters:CornerRadiusFilterConverter x:Key="BottomCornerRadiusFilterConverter" Filter="BottomLeft, BottomRight"/>
    <converters:CornerRadiusFilterConverter x:Key="LeftCornerRadiusFilterConverter" Filter="TopLeft, BottomLeft"/>

    <SolidColorBrush x:Key="SplitButtonBackground" Color="{DynamicResource ThemeControlMidColor}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundPointerOver" Color="{DynamicResource ThemeControlMidColor}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundPressed" Color="{DynamicResource ThemeBorderHighColor}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundDisabled" Color="{DynamicResource ThemeControlMidColor}" Opacity="{DynamicResource ThemeDisabledOpacity}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundChecked" Color="{DynamicResource ThemeBorderHighColor}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundCheckedPointerOver" Color="{DynamicResource ThemeBorderHighColor}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundCheckedPressed" Color="{DynamicResource ThemeBorderHighColor}" />
    <SolidColorBrush x:Key="SplitButtonBackgroundCheckedDisabled" Color="{DynamicResource ThemeControlHighColor}" Opacity="{DynamicResource ThemeDisabledOpacity}" />

    <SolidColorBrush x:Key="SplitButtonForeground" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundPointerOver" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundPressed" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundDisabled" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundChecked" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundCheckedPointerOver" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundCheckedPressed" Color="{DynamicResource ThemeForegroundColor}" />
    <SolidColorBrush x:Key="SplitButtonForegroundCheckedDisabled" Color="{DynamicResource ThemeForegroundColor}" />

    <SolidColorBrush x:Key="SplitButtonBorderBrush" Color="{DynamicResource ThemeBorderLowColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushPointerOver" Color="{DynamicResource ThemeBorderMidColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushPressed" Color="{DynamicResource ThemeBorderLowColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushDisabled" Color="{DynamicResource ThemeBorderLowColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushChecked" Color="{DynamicResource ThemeBorderMidColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushCheckedPointerOver" Color="{DynamicResource ThemeBorderMidColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushCheckedPressed" Color="{DynamicResource ThemeControlHighColor}" />
    <SolidColorBrush x:Key="SplitButtonBorderBrushCheckedDisabled" Color="{DynamicResource ThemeControlMidColor}" Opacity="{DynamicResource ThemeDisabledOpacity}" />
  </Styles.Resources>

  <Style Selector="SplitButton">
    <Setter Property="Background" Value="{DynamicResource SplitButtonBackground}" />
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForeground}" />
    <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrush}" />
    <Setter Property="BorderThickness" Value="{DynamicResource SplitButtonBorderThemeThickness}" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <!--<Setter Property="UseSystemFocusVisuals" Value="True" />
    <Setter Property="FocusVisualMargin" Value="-3" />-->
    <Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
    <Setter Property="Focusable" Value="True" />
    <Setter Property="Padding" Value="4" />
    <Setter Property="CornerRadius" Value="0" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate>
          <Grid>
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="*" />
              <ColumnDefinition Width="Auto" />
              <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <Button x:Name="PART_PrimaryButton"
                    Grid.Column="0"
                    MinWidth="{DynamicResource SplitButtonPrimaryButtonSize}"
                    Foreground="{TemplateBinding Foreground}"
                    Background="{TemplateBinding Background}"
                    BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource PrimaryButtonBorderMultiplier}}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Content="{TemplateBinding Content}"
                    ContentTemplate="{TemplateBinding ContentTemplate}"
                    Command="{TemplateBinding Command}"
                    CommandParameter="{TemplateBinding CommandParameter}"
                    FontFamily="{TemplateBinding FontFamily}"
                    FontSize="{TemplateBinding FontSize}"
                    FontWeight="{TemplateBinding FontWeight}"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                    Padding="{TemplateBinding Padding}"
                    Focusable="False"
                    KeyboardNavigation.IsTabStop="False" />

            <Border x:Name="SeparatorBorder"
                    Grid.Column="1"
                    Background="Transparent"
                    Width="{DynamicResource SplitButtonSeparatorWidth}"
                    BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SeparatorBorderMultiplier}}"
                    BorderBrush="{TemplateBinding BorderBrush}" />

            <Button x:Name="PART_SecondaryButton"
                    Grid.Column="2"
                    MinWidth="{DynamicResource SplitButtonSecondaryButtonSize}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Foreground="{TemplateBinding Foreground}"
                    Background="{TemplateBinding Background}"
                    BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SecondaryButtonBorderMultiplier}}"
                    Padding="0"
                    HorizontalContentAlignment="Center"
                    VerticalContentAlignment="Center"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    Focusable="False"
                    KeyboardNavigation.IsTabStop="False" />
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <!-- Default overridable styles -->
  <Style Selector="SplitButton /template/ Button#PART_PrimaryButton">
    <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
  </Style>
  <Style Selector="SplitButton /template/ Button#PART_SecondaryButton">
    <Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius, Converter={StaticResource RightCornerRadiusFilterConverter}}" />
    <Setter Property="Content">
      <Template>
        <PathIcon Height="12"
                  Width="12"
                  Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
      </Template>
    </Setter>
  </Style>

  <!-- Primary and Secondary buttons PointerOver State -->
  <Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter,
         SplitButton /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPointerOver}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPointerOver}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" />
  </Style>
  <Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pointerover PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" />
  </Style>

  <!-- Primary and Secondary buttons Pressed State -->
  <Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter,
         SplitButton /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
  </Style>
  <Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pressed PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
  </Style>

  <!-- SplitButton Pressed State -->
  <Style Selector="SplitButton:pressed /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:pressed /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:pressed /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
  </Style>
  <Style Selector="SplitButton:pressed /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
  </Style>

  <!-- Primary and Secondary buttons Flyout Open State -->
  <Style Selector="SplitButton:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:flyout-open /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
  </Style>
  <Style Selector="SplitButton:flyout-open /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
  </Style>

  <!-- Disabled State -->
  <Style Selector="SplitButton:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:disabled /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundDisabled}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushDisabled}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" />
  </Style>
  <Style Selector="SplitButton:disabled /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" />
  </Style>

  <!-- Checked State -->
  <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:checked /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundChecked}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushChecked}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" />
  </Style>
  <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" />
  </Style>

  <!-- Checked PointerOver State -->
  <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter,
         SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPointerOver}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPointerOver}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" />
  </Style>
  <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" />
  </Style>

  <!-- Checked Pressed State -->
  <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter,
         SplitButton:checked /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
  </Style>
  <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pressed PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
  </Style>

  <!-- SplitButton Checked Pressed State -->
  <Style Selector="SplitButton:pressed:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:pressed:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:pressed:checked /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
  </Style>
  <Style Selector="SplitButton:pressed:checked /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
  </Style>

  <!-- Checked Flyout Open State -->
  <Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:checked:flyout-open /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
  </Style>
  <Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
  </Style>

  <!-- Disabled Checked State -->
  <Style Selector="SplitButton:checked:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
         SplitButton:checked:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
         SplitButton:checked:disabled /template/ Border#SeparatorBorder">
    <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedDisabled}" />
    <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedDisabled}" />
    <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" />
  </Style>
  <Style Selector="SplitButton:checked:disabled /template/ Button#PART_SecondaryButton PathIcon">
    <Setter Property="Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" />
  </Style>
</Styles>