feat: change layout WIP

src/Ursa/Controls/DateTimePicker/Calendar.cs

@@ -13,8 +13,8 @@ namespace Ursa.Controls;
 [TemplatePart(PART_PreviousButton, typeof(Button))]
 [TemplatePart(PART_HeaderButton, typeof(Button))]
 [TemplatePart(PART_BackButton, typeof(Button))]
-[TemplatePart(PART_MonthView, typeof(Panel))]
-[TemplatePart(PART_YearView, typeof(Panel))]
+[TemplatePart(PART_MonthView, typeof(CalendarMonthView))]
+[TemplatePart(PART_YearView, typeof(CalendarYearView))]
 public class Calendar: TemplatedControl
 {
     public const string PART_NextYearButton = "PART_NextYearButton";
@@ -25,6 +25,8 @@ public class Calendar: TemplatedControl
     public const string PART_BackButton = "PART_BackButton";
     public const string PART_MonthView = "PART_MonthView";
     public const string PART_YearView = "PART_YearView";
+
+    private Grid? _monthGrid;
     
     
     public static readonly StyledProperty<DateTime> SelectedDateProperty = AvaloniaProperty.Register<Calendar, DateTime>(nameof(SelectedDate), DateTime.Now);
@@ -68,4 +70,18 @@ public class Calendar: TemplatedControl
         get => GetValue(BlackoutDateRuleProperty);
         set => SetValue(BlackoutDateRuleProperty, value);
     }
+
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        base.OnApplyTemplate(e);
+        _monthGrid = e.NameScope.Find<Grid>(PART_MonthView);
+    }
+
+    private void InitializeGrid()
+    {
+        if (_monthGrid is not null)
+        {
+            
+        }
+    }
 }

src/Ursa/Controls/DateTimePicker/CalendarMonthView.cs

@@ -0,0 +1,49 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Metadata;
+using Avalonia.Controls.Primitives;
+
+namespace Ursa.Controls;
+
+/// <summary>
+/// Show days in a month. 
+/// </summary>
+[TemplatePart(PART_Grid, typeof(Grid))]
+public class CalendarMonthView: TemplatedControl
+{
+    public const string PART_Grid = "PART_Grid";
+    
+    private Grid? _grid;
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        base.OnApplyTemplate(e);
+        _grid = e.NameScope.Find<Grid>(PART_Grid);
+        // GenerateGridElements();
+    }
+    
+    private int _month;
+    public int Month
+    {
+        get => _month;
+        set
+        {
+            _month = value;
+            // Update();
+        }
+    }
+
+    public static readonly StyledProperty<DayOfWeek> FirstDayOfWeekProperty = AvaloniaProperty.Register<CalendarMonthView, DayOfWeek>(
+        nameof(FirstDayOfWeek));
+
+    public DayOfWeek FirstDayOfWeek
+    {
+        get => GetValue(FirstDayOfWeekProperty);
+        set => SetValue(FirstDayOfWeekProperty, value);
+    }
+
+    private void GenerateGridElements()
+    {
+        // Generate Day titles (Sun, Mon, Tue, Wed, Thu, Fri, Sat) based on FirstDayOfWeek and culture.
+        
+    }
+}

src/Ursa/Controls/DateTimePicker/CalendarYearView.cs

@@ -0,0 +1,12 @@
+namespace Ursa.Controls;
+
+/// <summary>
+/// Three modes:
+/// 1. show 12 months in a year
+/// 2. show 12 years, one year per button (but only 10 buttons clickable)
+/// 3. show 120 years, ten year per button (but only 10 buttons clickable)
+/// </summary>
+public class CalendarYearView
+{
+    
+}