Added RealClock and fixed a bug with ClockPicker reseting

Directory.Build.props

@@ -71,10 +71,10 @@
 
     <GalleryTargetFramework>$(DebugShaderAndGalleryTargetFramework)</GalleryTargetFramework>
 
-    <TargetFrameworks Condition=" '$(Configuration)' == 'Release' And $(MSBuildProjectName) != $(GalleryAppName) ">net8.0-windows10.0.19041.0;net9.0-windows10.0.19041.0;net10.0-windows10.0.19041.0</TargetFrameworks>
+    <TargetFrameworks Condition=" '$(Configuration)' == 'Release' And $(MSBuildProjectName) != $(GalleryAppName) ">$(DebugTargetFramework)</TargetFrameworks>
     <TargetFrameworks Condition=" '$(Configuration)' == 'Debug' And $(MSBuildProjectName) != $(GalleryAppName)">$(DebugTargetFramework)</TargetFrameworks>
 
-    <TargetFrameworks Condition=" '$(Configuration)' == 'Release' And $(MSBuildProjectName) == $(ShaderLibName) ">net8.0-windows10.0.22621.0;net9.0-windows10.0.22621.0;net10.0-windows10.0.22621.0</TargetFrameworks>
+    <TargetFrameworks Condition=" '$(Configuration)' == 'Release' And $(MSBuildProjectName) == $(ShaderLibName) ">$(DebugShaderAndGalleryTargetFramework)</TargetFrameworks>
     <TargetFrameworks Condition=" '$(Configuration)' == 'Debug' And $(MSBuildProjectName) == $(ShaderLibName)">$(DebugShaderAndGalleryTargetFramework)</TargetFrameworks>
 
     <TargetPlatformMinVersion>10.0.17763.0</TargetPlatformMinVersion>

dev/DevWinUI.Gallery/Assets/NavViewMenu/AppData.json

@@ -595,6 +595,12 @@
           "Subtitle": "Analog Clock",
           "ImagePath": "ms-appx:///Assets/Fluent/Clock.png"
         },
+        {
+          "UniqueId": "DevWinUIGallery.Views.RealClockPage",
+          "Title": "Real Clock",
+          "Subtitle": "A non-interactive analog clock that shows the actual time, with time zone support",
+          "ImagePath": "ms-appx:///Assets/Fluent/Clock.png"
+        },
         {
           "UniqueId": "DevWinUIGallery.Views.DateTimePickerPage",
           "Title": "Date Time Picker",

dev/DevWinUI.Gallery/Views/Pages/Features/RealClockPage.xaml

@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<Page x:Class="DevWinUIGallery.Views.RealClockPage"
+      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+      xmlns:dev="using:DevWinUI"
+      xmlns:local="using:DevWinUIGallery"
+      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+      mc:Ignorable="d">
+
+    <ScrollViewer>
+        <StackPanel Margin="10" dev:PanelAttach.ChildrenTransitions="Default" Spacing="10">
+            <local:ControlExample HeaderText="Real Clock (Local Time)">
+                <local:ControlExample.Xaml>
+                    <x:String>&lt;dev:RealClock /&gt;</x:String>
+                </local:ControlExample.Xaml>
+                <local:ControlExample.Pane>
+                    <StackPanel>
+                        <TextBox x:Name="TxtTimeFormat1" Header="TimeFormat" Text="HH:mm" />
+                    </StackPanel>
+                </local:ControlExample.Pane>
+                <dev:RealClock HorizontalAlignment="Left" TimeFormat="{x:Bind TxtTimeFormat1.Text, Mode=OneWay}" />
+            </local:ControlExample>
+            <local:ControlExample HeaderText="Real Clock with a different Time Zone">
+                <local:ControlExample.Xaml>
+                    <x:String>&lt;dev:RealClock TimeZoneId="Tokyo Standard Time" /&gt;</x:String>
+                </local:ControlExample.Xaml>
+                <local:ControlExample.Pane>
+                    <StackPanel>
+                        <TextBox x:Name="TxtTimeZoneId" Header="TimeZoneId" Text="Tokyo Standard Time" />
+                    </StackPanel>
+                </local:ControlExample.Pane>
+                <dev:RealClock HorizontalAlignment="Left" TimeZoneId="{x:Bind TxtTimeZoneId.Text, Mode=OneWay}" />
+            </local:ControlExample>
+        </StackPanel>
+    </ScrollViewer>
+</Page>

dev/DevWinUI.Gallery/Views/Pages/Features/RealClockPage.xaml.cs

@@ -0,0 +1,9 @@
+namespace DevWinUIGallery.Views;
+
+public sealed partial class RealClockPage : Page
+{
+    public RealClockPage()
+    {
+        this.InitializeComponent();
+    }
+}

dev/DevWinUI/Controls/Native/Date/CalendarWithClock/CalendarWithClock.Property.cs

@@ -41,7 +41,7 @@ public TimeSpan? SelectedTime
     }
 
     public static readonly DependencyProperty SelectedTimeProperty =
-        DependencyProperty.Register(nameof(SelectedTime), typeof(TimeSpan?), typeof(CalendarWithClock), new PropertyMetadata(TimeNow, OnSelectedTimeChanged));
+        DependencyProperty.Register(nameof(SelectedTime), typeof(TimeSpan?), typeof(CalendarWithClock), new PropertyMetadata(null, OnSelectedTimeChanged));
 
     private static void OnSelectedTimeChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
     {

dev/DevWinUI/Controls/Native/Date/CalendarWithClock/CalendarWithClock.cs

@@ -59,6 +59,11 @@ protected override void OnApplyTemplate()
 
         UpdateTemplate();
 
+        if (SelectedTime == null)
+        {
+            SelectedTime = TimeNow;
+        }
+
         rootGrid = GetTemplateChild(PART_Root) as Grid;
         timePicker = GetTemplateChild(PART_TimePicker) as TimePicker;
         clock = GetTemplateChild(PART_Clock) as Clock;

dev/DevWinUI/Controls/Native/Date/Clock/Clock.Property.cs

@@ -27,6 +27,11 @@ private static void OnSelectedTimeChanged(DependencyObject d, DependencyProperty
 
     private void OnSelectedTimeChanged(DateTime dateTime)
     {
+        //Refresh the visuals when SelectedTime is set externally; Update() sets SelectedTime itself, so guard against re-entrancy.
+        if (!_isUpdatingSelectedTime)
+        {
+            Update(dateTime);
+        }
         SelectedTimeChanged?.Invoke(this, dateTime);
     }