From f1e09e4e319f8e0bc443e5675b384d015a179d60 Mon Sep 17 00:00:00 2001
From: Yoyo <zrt2399@163.com>
Date: Mon, 24 Aug 2026 16:05:45 +0000
Subject: [PATCH] Fix DatePicker and TimePicker separator alignment with
 VerticalContentAlignment (#22023)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Fix DatePicker and TimePicker separator alignment with VerticalContentAlignment

* Fix DatePicker and TimePicker separator alignment in Simple Theme

---------

Co-authored-by: Javier Suárez <javiersuarezruiz@hotmail.com>
---
 src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml | 6 +++++-
 src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml | 6 +++++-
 src/Avalonia.Themes.Simple/Controls/DatePicker.xaml | 7 +++++--
 src/Avalonia.Themes.Simple/Controls/TimePicker.xaml | 6 +++++-
 4 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
index d7bb32fb43..52c63f8e22 100644
--- a/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/DatePicker.xaml
@@ -98,7 +98,7 @@
                     HorizontalAlignment="Stretch"
                     VerticalAlignment="Stretch"
                     TemplatedControl.IsTemplateFocusTarget="True">
-              <Grid Name="PART_ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
+              <Grid Name="PART_ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
                 <TextBlock Name="PART_DayTextBlock" Text="{DynamicResource StringDatePickerDayText}" HorizontalAlignment="Center"
                            Padding="{DynamicResource DatePickerHostPadding}" />
                 <TextBlock Name="PART_MonthTextBlock" Text="{DynamicResource StringDatePickerMonthText}" TextAlignment="Left"
@@ -133,6 +133,10 @@
       <Setter Property="Fill" Value="{DynamicResource DatePickerSpacerFillDisabled}"/>
     </Style>
 
+    <Style Selector="^ /template/ Button#PART_FlyoutButton TextBlock">
+      <Setter Property="VerticalAlignment" Value="{TemplateBinding VerticalContentAlignment}"/>
+    </Style>
+
     <!-- Changes foreground for watermark text when SelectedDate is null-->
     <Style Selector="^:hasnodate /template/ Button#PART_FlyoutButton TextBlock">
       <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
diff --git a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
index 81c31fecda..e5fb28b609 100644
--- a/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/TimePicker.xaml
@@ -97,7 +97,7 @@
                     HorizontalAlignment="Stretch"
                     VerticalAlignment="Stretch">
 
-              <Grid Name="PART_FlyoutButtonContentGrid" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
+              <Grid Name="PART_FlyoutButtonContentGrid">
                 <!--Ignore col defs here, set in code-->
                 <Border x:Name="PART_FirstPickerHost"
                         Grid.Column="0"
@@ -175,6 +175,10 @@
       <Setter Property="Fill" Value="{DynamicResource TimePickerSpacerFillDisabled}"/>
     </Style>
 
+    <Style Selector="^ /template/ Button#PART_FlyoutButton TextBlock">
+      <Setter Property="VerticalAlignment" Value="{TemplateBinding VerticalContentAlignment}"/>
+    </Style>
+
     <Style Selector="^:hasnotime /template/ Button#PART_FlyoutButton TextBlock">
       <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
     </Style>
diff --git a/src/Avalonia.Themes.Simple/Controls/DatePicker.xaml b/src/Avalonia.Themes.Simple/Controls/DatePicker.xaml
index f7cf34d0dc..45d895541d 100644
--- a/src/Avalonia.Themes.Simple/Controls/DatePicker.xaml
+++ b/src/Avalonia.Themes.Simple/Controls/DatePicker.xaml
@@ -106,8 +106,7 @@
                     TemplatedControl.IsTemplateFocusTarget="True"
                     Theme="{StaticResource SimpleDatePickerFlyoutButton}">
               <Grid Name="PART_ButtonContentGrid"
-                    ColumnDefinitions="78*,Auto,132*,Auto,78*"
-                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
+                    ColumnDefinitions="78*,Auto,132*,Auto,78*">
                 <TextBlock Name="PART_DayTextBlock"
                            Padding="{DynamicResource DatePickerHostPadding}"
                            HorizontalAlignment="Center"
@@ -159,6 +158,10 @@
       <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" />
     </Style>
 
+    <Style Selector="^ /template/ Button#PART_FlyoutButton TextBlock">
+      <Setter Property="VerticalAlignment" Value="{TemplateBinding VerticalContentAlignment}"/>
+    </Style>
+
     <!--  Changes foreground for watermark text when SelectedDate is null  -->
     <Style Selector="^:hasnodate /template/ Button#PART_FlyoutButton TextBlock">
       <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundLowBrush}" />
diff --git a/src/Avalonia.Themes.Simple/Controls/TimePicker.xaml b/src/Avalonia.Themes.Simple/Controls/TimePicker.xaml
index 3c95d9f63c..53fa121663 100644
--- a/src/Avalonia.Themes.Simple/Controls/TimePicker.xaml
+++ b/src/Avalonia.Themes.Simple/Controls/TimePicker.xaml
@@ -103,7 +103,7 @@
                     IsEnabled="{TemplateBinding IsEnabled}"
                     Theme="{StaticResource SimpleTimePickerFlyoutButton}">
 
-              <Grid Name="PART_FlyoutButtonContentGrid" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
+              <Grid Name="PART_FlyoutButtonContentGrid">
                 <!--  Ignore col defs here, set in code  -->
                 <Border x:Name="PART_FirstPickerHost"
                         Grid.Column="0"
@@ -192,6 +192,10 @@
     <Style Selector="^:disabled /template/ Rectangle">
       <Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}" />
     </Style>
+    
+    <Style Selector="^ /template/ Button#PART_FlyoutButton TextBlock">
+      <Setter Property="VerticalAlignment" Value="{TemplateBinding VerticalContentAlignment}"/>
+    </Style>
 
     <Style Selector="^:hasnotime /template/ Button#PART_FlyoutButton TextBlock">
       <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundLowBrush}" />