From 55d03d94d795cd78d261a973658364132e2f2380 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 16:54:15 -0400
Subject: [PATCH 01/11] Add new DropDownButton control

---
 src/Avalonia.Controls/DropDownButton.cs       | 15 +++
 .../Controls/Button.xaml                      |  4 +-
 .../Controls/DropDownButton.xaml              | 95 +++++++++++++++++++
 .../Controls/FluentControls.xaml              |  1 +
 4 files changed, 113 insertions(+), 2 deletions(-)
 create mode 100644 src/Avalonia.Controls/DropDownButton.cs
 create mode 100644 src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml

diff --git a/src/Avalonia.Controls/DropDownButton.cs b/src/Avalonia.Controls/DropDownButton.cs
new file mode 100644
index 0000000000..8dc40f42af
--- /dev/null
+++ b/src/Avalonia.Controls/DropDownButton.cs
@@ -0,0 +1,15 @@
+namespace Avalonia.Controls
+{
+    /// <summary>
+    /// A button with an added drop-down chevron to visually indicate it has a flyout with additional actions.
+    /// </summary>
+    public class DropDownButton : Button
+    {
+        /// <summary>
+        /// Initializes a new instance of the <see cref="DropDownButton"/> class.
+        /// </summary>
+        public DropDownButton()
+        {
+        }
+    }
+}
diff --git a/src/Avalonia.Themes.Fluent/Controls/Button.xaml b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
index 533fabfb44..80343c0e7b 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Button.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
@@ -78,7 +78,7 @@
     <Setter Property="TextBlock.Foreground" Value="{DynamicResource AccentButtonForegroundPressed}" />
   </Style>
 
-  <Style Selector="Button, RepeatButton, ToggleButton">
+  <Style Selector="Button, RepeatButton, ToggleButton, DropDownButton">
     <Setter Property="RenderTransform" Value="none" />
     <Setter Property="Transitions">
       <Transitions>
@@ -87,7 +87,7 @@
     </Setter>
   </Style>
 
-  <Style Selector="Button:pressed, RepeatButton:pressed, ToggleButton:pressed">
+  <Style Selector="Button:pressed, RepeatButton:pressed, ToggleButton:pressed, DropDownButton:pressed">
     <Setter Property="RenderTransform" Value="scale(0.98)" />    
   </Style>
 
diff --git a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
new file mode 100644
index 0000000000..7c3a3a6756
--- /dev/null
+++ b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
@@ -0,0 +1,95 @@
+<Styles xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+        x:CompileBindings="True">
+
+  <Design.PreviewWith>
+    <Border Padding="20">
+      <StackPanel Spacing="20">
+        <DropDownButton Content="Click Me!" />
+        <DropDownButton Content="Disabled" IsEnabled="False" />
+      </StackPanel>
+    </Border>
+  </Design.PreviewWith>
+
+  <Style Selector="DropDownButton">
+    <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
+    <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
+    <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
+    <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+    <Setter Property="HorizontalAlignment" Value="Left" />
+    <Setter Property="VerticalAlignment" Value="Center" />
+    <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
+    <Setter Property="FocusVisualMargin" Value="-3" />-->
+    <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
+    <Setter Property="Template">
+      <Setter.Value>
+        <ControlTemplate>
+          <Border x:Name="RootBorder"
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}">
+            <Grid x:Name="InnerGrid">
+              <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="Auto" />
+              </Grid.ColumnDefinitions>
+
+              <ContentPresenter x:Name="PART_ContentPresenter"
+                                Grid.Column="0"
+                                Content="{TemplateBinding Content}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Padding="{TemplateBinding Padding}"
+                                RecognizesAccessKey="True"
+                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+
+              <PathIcon x:Name="DropDownGlyph"
+                        Grid.Column="1"
+                        UseLayoutRounding="False"
+                        IsHitTestVisible="False"
+                        Height="12"
+                        Width="12"
+                        Margin="0,0,10,0"
+                        HorizontalAlignment="Right"
+                        VerticalAlignment="Center" />
+
+            </Grid>
+          </Border>
+        </ControlTemplate>
+      </Setter.Value>
+    </Setter>
+  </Style>
+
+  <!--  Normal State  -->
+  <Style Selector="DropDownButton /template/ PathIcon#DropDownGlyph">
+    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDropDownGlyphForeground}" />
+    <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+  </Style>
+
+  <!--  PointerOver State  -->
+  <Style Selector="DropDownButton:pointerover /template/ Border#RootBorder">
+    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
+    <Setter Property="TextBlock.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
+  </Style>
+
+  <!--  Pressed State  -->
+  <Style Selector="DropDownButton:pressed  /template/ Border#RootBorder">
+    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
+    <Setter Property="TextBlock.Foreground" Value="{DynamicResource ButtonForegroundPressed}" />
+  </Style>
+
+  <!--  Disabled State  -->
+  <Style Selector="DropDownButton:disabled /template/ Border#RootBorder">
+    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundDisabled}" />
+    <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushDisabled}" />
+    <Setter Property="TextBlock.Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
+  </Style>
+  <Style Selector="DropDownButton:disabled /template/ PathIcon#DropDownGlyph">
+    <Setter Property="Foreground" Value="{DynamicResource ButtonForegroundDisabled}" />
+  </Style>
+
+</Styles>
diff --git a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
index 16a6cc9c14..74acee68ff 100644
--- a/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/FluentControls.xaml
@@ -12,6 +12,7 @@
   <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBox.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ComboBoxItem.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ContentControl.xaml"/>
+  <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/DropDownButton.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/Label.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/GridSplitter.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Fluent/Controls/ItemsControl.xaml"/>

From 25fb47b4eef685107201855d07d440f9335446c3 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 16:54:42 -0400
Subject: [PATCH 02/11] Button style formatting fixes

---
 src/Avalonia.Themes.Fluent/Controls/Button.xaml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Button.xaml b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
index 80343c0e7b..4fb6b9659a 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Button.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
@@ -4,7 +4,7 @@
       <StackPanel Spacing="20">
         <Button Content="Click Me!" />
         <Button Classes="accent" Content="Click Me!" />
-      </StackPanel>      
+      </StackPanel>
     </Border>
   </Design.PreviewWith>
   <Styles.Resources>
@@ -47,13 +47,13 @@
     <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPointerOver}" />
     <Setter Property="TextBlock.Foreground" Value="{DynamicResource ButtonForegroundPointerOver}" />
   </Style>
-  
+
   <Style Selector="Button:pressed  /template/ ContentPresenter#PART_ContentPresenter">
     <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPressed}" />
     <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushPressed}" />
     <Setter Property="TextBlock.Foreground" Value="{DynamicResource ButtonForegroundPressed}" />
   </Style>
-  
+
   <Style Selector="Button:disabled /template/ ContentPresenter#PART_ContentPresenter">
     <Setter Property="Background" Value="{DynamicResource ButtonBackgroundDisabled}" />
     <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrushDisabled}" />

From 318e0005014094ea20e4383fd4a421e9118d36e3 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 16:55:06 -0400
Subject: [PATCH 03/11] Remove setting FontSize/FontWeight in Button style

---
 src/Avalonia.Themes.Fluent/Controls/Button.xaml | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/Button.xaml b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
index 4fb6b9659a..22c8cfe1e9 100644
--- a/src/Avalonia.Themes.Fluent/Controls/Button.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/Button.xaml
@@ -19,9 +19,7 @@
     <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
-    <Setter Property="VerticalAlignment" Value="Center" />    
-    <Setter Property="FontWeight" Value="Normal" />
-    <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
+    <Setter Property="VerticalAlignment" Value="Center" />
     <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
     <Setter Property="FocusVisualMargin" Value="-3" />-->
     <Setter Property="Template">

From 3c2835cab5db7e78ddaeb2a7054f0de5e18c7bb4 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 17:01:04 -0400
Subject: [PATCH 04/11] Add DropDownButton to ControlCatalog

---
 samples/ControlCatalog/Pages/ButtonsPage.xaml | 28 +++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/samples/ControlCatalog/Pages/ButtonsPage.xaml b/samples/ControlCatalog/Pages/ButtonsPage.xaml
index 7de0872eae..85314942a1 100644
--- a/samples/ControlCatalog/Pages/ButtonsPage.xaml
+++ b/samples/ControlCatalog/Pages/ButtonsPage.xaml
@@ -147,6 +147,34 @@
       </StackPanel>
     </Border>
 
+    <!-- DropDownButton -->
+    <Border Classes="header-border">
+      <StackPanel Orientation="Vertical"
+                  Spacing="4">
+        <TextBlock Text="DropDownButton"
+                   Classes="header" />
+        <TextBlock TextWrapping="Wrap">A button with an added drop-down chevron to visually indicate it has a flyout with additional actions.</TextBlock>
+      </StackPanel>
+    </Border>
+
+    <Border Classes="thin"
+            Padding="15">
+      <StackPanel Orientation="Vertical"
+                  Spacing="8">
+        <DropDownButton Flyout="{StaticResource SharedMenuFlyout}">
+          <TextBlock Text="Drop Down Button" />
+        </DropDownButton>
+        <DropDownButton Padding="0,0,8,0">
+          <Border Background="Teal"
+                  HorizontalAlignment="Stretch"
+                  VerticalAlignment="Stretch"
+                  Height="32"
+                  Width="32" />
+        </DropDownButton>
+        <DropDownButton IsEnabled="False">Disabled</DropDownButton>
+      </StackPanel>
+    </Border>
+
     <!-- SplitButton -->
     <Border Classes="header-border">
       <StackPanel Orientation="Vertical"

From 78a90a8340525cc50a6611c187b96671cae08639 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 17:01:50 -0400
Subject: [PATCH 05/11] Add comments for TemplatedControl.OnApplyTemplate()

---
 src/Avalonia.Controls/Primitives/TemplatedControl.cs | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/Avalonia.Controls/Primitives/TemplatedControl.cs b/src/Avalonia.Controls/Primitives/TemplatedControl.cs
index af681d6930..475bd448cc 100644
--- a/src/Avalonia.Controls/Primitives/TemplatedControl.cs
+++ b/src/Avalonia.Controls/Primitives/TemplatedControl.cs
@@ -340,6 +340,11 @@ namespace Avalonia.Controls.Primitives
             base.OnDetachedFromLogicalTree(e);
         }
 
+        /// <summary>
+        /// Called when the control's template is applied.
+        /// In simple terms, this means the method is called just before the control is displayed.
+        /// </summary>
+        /// <param name="e">The event args.</param>
         protected virtual void OnApplyTemplate(TemplateAppliedEventArgs e)
         {
         }

From 485479e6c6b35a21ffc2aa7891e9ea0ba539955a Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 17:06:18 -0400
Subject: [PATCH 06/11] Add flyout pseudoclass and state handling to Button for
 derived controls

---
 src/Avalonia.Controls/Button.cs | 119 ++++++++++++++++++++++++++++++--
 1 file changed, 112 insertions(+), 7 deletions(-)

diff --git a/src/Avalonia.Controls/Button.cs b/src/Avalonia.Controls/Button.cs
index 72495bdcb3..94ff92a2b0 100644
--- a/src/Avalonia.Controls/Button.cs
+++ b/src/Avalonia.Controls/Button.cs
@@ -29,11 +29,14 @@ namespace Avalonia.Controls
     }
 
     /// <summary>
-    /// A button control.
+    /// A standard button control.
     /// </summary>
-    [PseudoClasses(":pressed")]
+    [PseudoClasses(pcFlyoutOpen, pcPressed)]
     public class Button : ContentControl, ICommandSource
     {
+        protected const string pcPressed    = ":pressed";
+        protected const string pcFlyoutOpen = ":flyout-open";
+
         /// <summary>
         /// Defines the <see cref="ClickMode"/> property.
         /// </summary>
@@ -92,6 +95,7 @@ namespace Avalonia.Controls
         private ICommand? _command;
         private bool _commandCanExecute = true;
         private KeyGesture? _hotkey;
+        private bool _isFlyoutOpen = false;
 
         /// <summary>
         /// Initializes static members of the <see cref="Button"/> class.
@@ -107,7 +111,6 @@ namespace Avalonia.Controls
         /// </summary>
         public Button()
         {
-            UpdatePseudoClasses(IsPressed);
         }
 
         /// <summary>
@@ -328,11 +331,30 @@ namespace Avalonia.Controls
             }
         }
 
+        /// <summary>
+        /// Opens the button's flyout.
+        /// </summary>
         protected virtual void OpenFlyout()
         {
             Flyout?.ShowAt(this);
         }
 
+        /// <summary>
+        /// Invoked when the button's flyout is opened.
+        /// </summary>
+        protected virtual void OnFlyoutOpened()
+        {
+            // Available for derived types
+        }
+
+        /// <summary>
+        /// Invoked when the button's flyout is closed.
+        /// </summary>
+        protected virtual void OnFlyoutClosed()
+        {
+            // Available for derived types
+        }
+
         /// <inheritdoc/>
         protected override void OnPointerPressed(PointerPressedEventArgs e)
         {
@@ -382,6 +404,14 @@ namespace Avalonia.Controls
             IsPressed = false;
         }
 
+        /// <inheritdoc/>
+        protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+        {
+            UnregisterFlyoutEvents(Flyout);
+            RegisterFlyoutEvents(Flyout);
+            UpdatePseudoClasses();
+        }
+
         /// <inheritdoc/>
         protected override void OnPropertyChanged<T>(AvaloniaPropertyChangedEventArgs<T> change)
         {
@@ -442,17 +472,26 @@ namespace Avalonia.Controls
             }
             else if (change.Property == IsPressedProperty)
             {
-                UpdatePseudoClasses(change.NewValue.GetValueOrDefault<bool>());
+                UpdatePseudoClasses();
             }
             else if (change.Property == FlyoutProperty)
             {
+                var oldFlyout = change.OldValue.GetValueOrDefault() as FlyoutBase;
+                var newFlyout = change.NewValue.GetValueOrDefault() as FlyoutBase;
+
                 // If flyout is changed while one is already open, make sure we 
                 // close the old one first
-                if (change.OldValue.GetValueOrDefault() is FlyoutBase oldFlyout &&
+                if (oldFlyout != null &&
                     oldFlyout.IsOpen)
                 {
                     oldFlyout.Hide();
                 }
+
+                // Must unregister events here while a reference to the old flyout still exists
+                UnregisterFlyoutEvents(oldFlyout);
+
+                RegisterFlyoutEvents(newFlyout);
+                UpdatePseudoClasses();
             }
         }
 
@@ -493,6 +532,32 @@ namespace Avalonia.Controls
             }
         }
 
+        /// <summary>
+        /// Registers all flyout events.
+        /// </summary>
+        /// <param name="flyout">The flyout to connect events to.</param>
+        private void RegisterFlyoutEvents(FlyoutBase? flyout)
+        {
+            if (flyout != null)
+            {
+                flyout.Opened += Flyout_Opened;
+                flyout.Closed += Flyout_Closed;
+            }
+        }
+
+        /// <summary>
+        /// Explicitly unregisters all flyout events.
+        /// </summary>
+        /// <param name="flyout">The flyout to disconnect events from.</param>
+        private void UnregisterFlyoutEvents(FlyoutBase? flyout)
+        {
+            if (flyout != null)
+            {
+                flyout.Opened -= Flyout_Opened;
+                flyout.Closed -= Flyout_Closed;
+             }
+        }
+
         /// <summary>
         /// Starts listening for the Enter key when the button <see cref="IsDefault"/>.
         /// </summary>
@@ -558,11 +623,51 @@ namespace Avalonia.Controls
         /// <summary>
         /// Updates the visual state of the control by applying latest PseudoClasses.
         /// </summary>
-        private void UpdatePseudoClasses(bool isPressed)
+        private void UpdatePseudoClasses()
         {
-            PseudoClasses.Set(":pressed", isPressed);
+            PseudoClasses.Set(pcFlyoutOpen, _isFlyoutOpen);
+            PseudoClasses.Set(pcPressed, IsPressed);
         }
 
         void ICommandSource.CanExecuteChanged(object sender, EventArgs e) => this.CanExecuteChanged(sender, e);
+
+        /// <summary>
+        /// Event handler for when the button's flyout is opened.
+        /// </summary>
+        private void Flyout_Opened(object? sender, EventArgs e)
+        {
+            var flyout = sender as FlyoutBase;
+
+            // It is possible to share flyouts among multiple controls including Button.
+            // This can cause a problem here since all controls that share a flyout receive
+            // the same Opened/Closed events at the same time.
+            // For Button that means they all would be updating their pseudoclasses accordingly.
+            // In other words, all Buttons with a shared Flyout would have the backgrounds changed together.
+            // To fix this, only continue here if the Flyout target matches this Button instance.
+            if (object.ReferenceEquals(flyout?.Target, this))
+            {
+                _isFlyoutOpen = true;
+                UpdatePseudoClasses();
+
+                OnFlyoutOpened();
+            }
+        }
+
+        /// <summary>
+        /// Event handler for when the button's flyout is closed.
+        /// </summary>
+        private void Flyout_Closed(object? sender, EventArgs e)
+        {
+            var flyout = sender as FlyoutBase;
+
+            // See comments in Flyout_Opened
+            if (object.ReferenceEquals(flyout?.Target, this))
+            {
+                _isFlyoutOpen = false;
+                UpdatePseudoClasses();
+
+                OnFlyoutClosed();
+            }
+        }
     }
 }

From 14e4aec081e619ec9b94cb99b8eea191507b84e7 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 17:06:43 -0400
Subject: [PATCH 07/11] Sync SplitButton with Button changes

---
 .../SplitButton/SplitButton.cs                | 32 +++++++++++++------
 1 file changed, 22 insertions(+), 10 deletions(-)

diff --git a/src/Avalonia.Controls/SplitButton/SplitButton.cs b/src/Avalonia.Controls/SplitButton/SplitButton.cs
index f1d07b2679..2cafba620e 100644
--- a/src/Avalonia.Controls/SplitButton/SplitButton.cs
+++ b/src/Avalonia.Controls/SplitButton/SplitButton.cs
@@ -1,7 +1,6 @@
 using System;
 using System.Windows.Input;
 using Avalonia.Controls.Metadata;
-using Avalonia.Controls.Mixins;
 using Avalonia.Controls.Primitives;
 using Avalonia.Input;
 using Avalonia.Interactivity;
@@ -314,16 +313,9 @@ namespace Avalonia.Controls
                 }
 
                 // Must unregister events here while a reference to the old flyout still exists
-                if (oldFlyout != null)
-                {
-                    UnregisterFlyoutEvents(oldFlyout);
-                }
-
-                if (newFlyout != null)
-                {
-                    RegisterFlyoutEvents(newFlyout);
-                }
+                UnregisterFlyoutEvents(oldFlyout);
 
+                RegisterFlyoutEvents(newFlyout);
                 UpdatePseudoClasses();
             }
 
@@ -415,6 +407,22 @@ namespace Avalonia.Controls
             }
         }
 
+        /// <summary>
+        /// Invoked when the split button's flyout is opened.
+        /// </summary>
+        protected virtual void OnFlyoutOpened()
+        {
+            // Available for derived types
+        }
+
+        /// <summary>
+        /// Invoked when the split button's flyout is closed.
+        /// </summary>
+        protected virtual void OnFlyoutClosed()
+        {
+            // Available for derived types
+        }
+
         ////////////////////////////////////////////////////////////////////////
         // Event Handling
         ////////////////////////////////////////////////////////////////////////
@@ -464,6 +472,8 @@ namespace Avalonia.Controls
             {
                 _isFlyoutOpen = true;
                 UpdatePseudoClasses();
+
+                OnFlyoutOpened();
             }
         }
 
@@ -479,6 +489,8 @@ namespace Avalonia.Controls
             {
                 _isFlyoutOpen = false;
                 UpdatePseudoClasses();
+
+                OnFlyoutClosed();
             }
         }
     }

From a0888ecfecae62da433b9abe106cfd0ffb6696a4 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 17:45:07 -0400
Subject: [PATCH 08/11] Add DefaultTheme for DropDownButton

---
 .../Controls/DropDownButton.xaml              | 67 +++++++++++++++++++
 src/Avalonia.Themes.Default/DefaultTheme.xaml |  1 +
 2 files changed, 68 insertions(+)
 create mode 100644 src/Avalonia.Themes.Default/Controls/DropDownButton.xaml

diff --git a/src/Avalonia.Themes.Default/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Default/Controls/DropDownButton.xaml
new file mode 100644
index 0000000000..662c6379fb
--- /dev/null
+++ b/src/Avalonia.Themes.Default/Controls/DropDownButton.xaml
@@ -0,0 +1,67 @@
+<Styles xmlns="https://github.com/avaloniaui">
+  <Style Selector="DropDownButton">
+    <Setter Property="Background" Value="{DynamicResource ThemeControlMidBrush}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderLowBrush}"/>
+    <Setter Property="BorderThickness" Value="{DynamicResource ThemeBorderThickness}"/>
+    <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundBrush}"/>
+    <Setter Property="HorizontalContentAlignment" Value="Center"/>
+    <Setter Property="VerticalContentAlignment" Value="Center"/>
+    <Setter Property="Padding" Value="4"/>
+    <Setter Property="Template">
+      <Setter.Value>
+        <ControlTemplate>
+          <Border Name="RootBorder"
+                  Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  ClipToBounds="True">
+            <Grid Name="InnerGrid">
+              <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="Auto" />
+              </Grid.ColumnDefinitions>
+
+              <ContentPresenter Name="PART_ContentPresenter"
+                                Grid.Column="0"
+                                Content="{TemplateBinding Content}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Padding="{TemplateBinding Padding}"
+                                RecognizesAccessKey="True"
+                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+
+              <PathIcon Name="DropDownGlyph"
+                        Grid.Column="1"
+                        UseLayoutRounding="False"
+                        IsHitTestVisible="False"
+                        Height="12"
+                        Width="12"
+                        Margin="0,0,10,0"
+                        HorizontalAlignment="Right"
+                        VerticalAlignment="Center" />
+
+            </Grid>
+          </Border>
+        </ControlTemplate>
+      </Setter.Value>
+    </Setter>
+  </Style>
+
+  <Style Selector="DropDownButton /template/ PathIcon#DropDownGlyph">
+    <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundBrush}" />
+    <Setter Property="Data" Value="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+  </Style>
+
+  <Style Selector="DropDownButton:pointerover /template/ Border#RootBorder">
+    <Setter Property="BorderBrush" Value="{DynamicResource ThemeBorderMidBrush}"/>
+  </Style>
+
+  <Style Selector="DropDownButton:pressed  /template/ Border#RootBorder">
+    <Setter Property="Background" Value="{DynamicResource ThemeControlHighBrush}"/>
+  </Style>
+
+  <Style Selector="DropDownButton:disabled">
+    <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}"/>
+  </Style>
+</Styles>
diff --git a/src/Avalonia.Themes.Default/DefaultTheme.xaml b/src/Avalonia.Themes.Default/DefaultTheme.xaml
index 6d2af1de57..9f6a7a700e 100644
--- a/src/Avalonia.Themes.Default/DefaultTheme.xaml
+++ b/src/Avalonia.Themes.Default/DefaultTheme.xaml
@@ -13,6 +13,7 @@
   <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/ComboBox.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/ComboBoxItem.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/ContentControl.xaml"/>
+  <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/DropDownButton.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/Label.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/GridSplitter.xaml"/>
   <StyleInclude Source="avares://Avalonia.Themes.Default/Controls/ItemsControl.xaml"/>

From 50a88536f30efa84a15ed264337018663e0a9c06 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 19:12:21 -0400
Subject: [PATCH 09/11] Add min height for DropDownButton, same as ComboBox

---
 samples/ControlCatalog/Pages/ButtonsPage.xaml           | 4 +++-
 src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml       | 1 +
 src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml | 8 +++++++-
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/samples/ControlCatalog/Pages/ButtonsPage.xaml b/samples/ControlCatalog/Pages/ButtonsPage.xaml
index 85314942a1..059b4d9788 100644
--- a/samples/ControlCatalog/Pages/ButtonsPage.xaml
+++ b/samples/ControlCatalog/Pages/ButtonsPage.xaml
@@ -172,6 +172,7 @@
                   Width="32" />
         </DropDownButton>
         <DropDownButton IsEnabled="False">Disabled</DropDownButton>
+        <DropDownButton />
       </StackPanel>
     </Border>
 
@@ -197,7 +198,8 @@
           <TextBlock Text="Disabled" />
         </SplitButton>
         <SplitButton Flyout="{StaticResource SharedMenuFlyout}"
-                     Content="Re-themed">
+                     Content="Re-themed"
+                     Foreground="White">
           <SplitButton.Styles>
             <Style>
               <Style.Resources>
diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index 7e9f5d9429..1297e5ceac 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -106,6 +106,7 @@
                       Grid.Column="1"
                       UseLayoutRounding="False"
                       IsHitTestVisible="False"
+                      MinHeight="{DynamicResource ComboBoxMinHeight}"
                       Height="12"
                       Width="12"
                       Margin="0,0,10,0"
diff --git a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
index 7c3a3a6756..7299f5ccb5 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
@@ -11,6 +11,10 @@
     </Border>
   </Design.PreviewWith>
 
+  <Styles.Resources>
+    <x:Double x:Key="DropDownButtonMinHeight">32</x:Double>
+  </Styles.Resources>
+  
   <Style Selector="DropDownButton">
     <Setter Property="Background" Value="{DynamicResource ButtonBackground}" />
     <Setter Property="Foreground" Value="{DynamicResource ButtonForeground}" />
@@ -29,7 +33,8 @@
                   Background="{TemplateBinding Background}"
                   BorderBrush="{TemplateBinding BorderBrush}"
                   BorderThickness="{TemplateBinding BorderThickness}"
-                  CornerRadius="{TemplateBinding CornerRadius}">
+                  CornerRadius="{TemplateBinding CornerRadius}"
+                  ClipToBounds="True">
             <Grid x:Name="InnerGrid">
               <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="*" />
@@ -49,6 +54,7 @@
                         Grid.Column="1"
                         UseLayoutRounding="False"
                         IsHitTestVisible="False"
+                        MinHeight="{DynamicResource DropDownButtonMinHeight}"
                         Height="12"
                         Width="12"
                         Margin="0,0,10,0"

From 25afcb4813527e206f450cfc5b1e5324b115cdff Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 19:44:18 -0400
Subject: [PATCH 10/11] Vertically center content in controls with drop-down
 chevrons

This matches ComboBox
---
 src/Avalonia.Themes.Default/Controls/SplitButton.xaml   | 2 ++
 src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml | 2 ++
 src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml    | 2 ++
 3 files changed, 6 insertions(+)

diff --git a/src/Avalonia.Themes.Default/Controls/SplitButton.xaml b/src/Avalonia.Themes.Default/Controls/SplitButton.xaml
index ce20a1a165..40880af1ec 100644
--- a/src/Avalonia.Themes.Default/Controls/SplitButton.xaml
+++ b/src/Avalonia.Themes.Default/Controls/SplitButton.xaml
@@ -61,6 +61,8 @@
     <Setter Property="BorderThickness" Value="{DynamicResource SplitButtonBorderThemeThickness}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
     <!--<Setter Property="UseSystemFocusVisuals" Value="True" />
     <Setter Property="FocusVisualMargin" Value="-3" />-->
     <Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
index 7299f5ccb5..97337c1cbf 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
@@ -23,6 +23,8 @@
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
     <!--<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
     <Setter Property="FocusVisualMargin" Value="-3" />-->
     <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
index e0dd0180b3..ea7a81b802 100644
--- a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
@@ -37,6 +37,8 @@
     <Setter Property="BorderThickness" Value="{DynamicResource SplitButtonBorderThemeThickness}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
+    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
+    <Setter Property="VerticalContentAlignment" Value="Center" />
     <!--<Setter Property="UseSystemFocusVisuals" Value="True" />
     <Setter Property="FocusVisualMargin" Value="-3" />-->
     <Setter Property="KeyboardNavigation.IsTabStop" Value="True" />

From a1e9558c41071499e3fc7f550a12e2ab2daec3d1 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Sat, 19 Mar 2022 20:03:54 -0400
Subject: [PATCH 11/11] Better set MinHeight in controls with drop-down
 chevrons

---
 src/Avalonia.Themes.Default/Controls/SplitButton.xaml   | 2 ++
 src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml       | 2 +-
 src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml | 2 +-
 src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml    | 2 ++
 4 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/Avalonia.Themes.Default/Controls/SplitButton.xaml b/src/Avalonia.Themes.Default/Controls/SplitButton.xaml
index 40880af1ec..d9201b5317 100644
--- a/src/Avalonia.Themes.Default/Controls/SplitButton.xaml
+++ b/src/Avalonia.Themes.Default/Controls/SplitButton.xaml
@@ -16,6 +16,7 @@
     <x:Double x:Key="SplitButtonPrimaryButtonSize">24</x:Double>
     <x:Double x:Key="SplitButtonSecondaryButtonSize">24</x:Double>
     <x:Double x:Key="SplitButtonSeparatorWidth">1</x:Double>
+    <x:Double x:Key="SplitButtonMinHeight">24</x:Double>
     <Thickness x:Key="SplitButtonBorderThemeThickness">1</Thickness>
 
     <converters:MarginMultiplierConverter x:Key="PrimaryButtonBorderMultiplier" Left="True" Top="True" Bottom="True" Indent="1" />
@@ -59,6 +60,7 @@
     <Setter Property="Foreground" Value="{DynamicResource SplitButtonForeground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrush}" />
     <Setter Property="BorderThickness" Value="{DynamicResource SplitButtonBorderThemeThickness}" />
+    <Setter Property="MinHeight" Value="{DynamicResource SplitButtonMinHeight}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
diff --git a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
index 1297e5ceac..81227a9db4 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ComboBox.xaml
@@ -37,6 +37,7 @@
     <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
     <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+    <Setter Property="MinHeight" Value="{DynamicResource ComboBoxMinHeight}" />
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
     <Setter Property="VerticalContentAlignment" Value="Center" />
     <Setter Property="HorizontalAlignment" Value="Left" />
@@ -106,7 +107,6 @@
                       Grid.Column="1"
                       UseLayoutRounding="False"
                       IsHitTestVisible="False"
-                      MinHeight="{DynamicResource ComboBoxMinHeight}"
                       Height="12"
                       Width="12"
                       Margin="0,0,10,0"
diff --git a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
index 97337c1cbf..a51e17db85 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DropDownButton.xaml
@@ -21,6 +21,7 @@
     <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
     <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThemeThickness}" />
     <Setter Property="Padding" Value="{DynamicResource ButtonPadding}" />
+    <Setter Property="MinHeight" Value="{DynamicResource DropDownButtonMinHeight}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />
@@ -56,7 +57,6 @@
                         Grid.Column="1"
                         UseLayoutRounding="False"
                         IsHitTestVisible="False"
-                        MinHeight="{DynamicResource DropDownButtonMinHeight}"
                         Height="12"
                         Width="12"
                         Margin="0,0,10,0"
diff --git a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
index ea7a81b802..97d5453cac 100644
--- a/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
@@ -24,6 +24,7 @@
     <x:Double x:Key="SplitButtonPrimaryButtonSize">32</x:Double>
     <x:Double x:Key="SplitButtonSecondaryButtonSize">32</x:Double>
     <x:Double x:Key="SplitButtonSeparatorWidth">1</x:Double>
+    <x:Double x:Key="SplitButtonMinHeight">32</x:Double>
 
     <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" />
@@ -35,6 +36,7 @@
     <Setter Property="Foreground" Value="{DynamicResource SplitButtonForeground}" />
     <Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrush}" />
     <Setter Property="BorderThickness" Value="{DynamicResource SplitButtonBorderThemeThickness}" />
+    <Setter Property="MinHeight" Value="{DynamicResource SplitButtonMinHeight}" />
     <Setter Property="HorizontalAlignment" Value="Left" />
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="HorizontalContentAlignment" Value="Stretch" />