fix: Safe area at the top is broken

CHANGELOG.md

@@ -11,6 +11,7 @@ Prefix your items with `(Template)` if the change is about the template and not
 - Fixed iOS crash by updating package and configuring the interpreter.
 - Added support for arm64 and x86 cpus in the mobile project.
 - Update Uno packages from 5.2.121 to 5.5.95.
+- Adding workaround for uno safe area issue https://github.com/unoplatform/uno/issues/6218
 
 ## 3.7.X
 - Replacing Appcenter with Firebase app distribution for Android.

src/app/ApplicationTemplate.Mobile/ApplicationTemplate.Mobile.csproj

@@ -32,10 +32,10 @@
 		<PackageReference Include="Uno.Microsoft.Xaml.Behaviors.Interactivity.WinUI" Version="2.4.2" />
 		<PackageReference Include="Uno.Microsoft.Xaml.Behaviors.WinUI.Managed" Version="2.4.2" />
 		<PackageReference Include="Uno.Toolkit.WinUI.Material" Version="6.3.7" />
-		<PackageReference Include="Uno.WinUI" Version="5.5.95" />
-		<PackageReference Include="Uno.WinUI.DevServer" Version="5.5.95" Condition="'$(Configuration)'=='Debug'" />
-		<PackageReference Include="Uno.WinUI.Lottie" Version="5.5.95" />
-		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.5.95" />
+		<PackageReference Include="Uno.WinUI" Version="5.6.30" />
+		<PackageReference Include="Uno.WinUI.DevServer" Version="5.6.30" Condition="'$(Configuration)'=='Debug'" />
+		<PackageReference Include="Uno.WinUI.Lottie" Version="5.6.30" />
+		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.6.30" />
 		<PackageReference Include="Microsoft.Extensions.Logging.Console" Version="9.0.1" />
 		<PackageReference Include="Serilog.Sinks.Xamarin" Version="1.0.0" />
 		<PackageReference Include="Serilog.Sinks.File" Version="6.0.0" />

src/app/ApplicationTemplate.Shared.Views/ApplicationTemplate.Shared.Views.projitems

@@ -12,6 +12,7 @@
     <Compile Include="$(MSBuildThisFileDirectory)App.xaml.cs">
       <DependentUpon>App.xaml</DependentUpon>
     </Compile>
+    <Compile Include="$(MSBuildThisFileDirectory)behaviors\CommandBarSafeAreaBehavior.cs" />
     <Compile Include="$(MSBuildThisFileDirectory)Behaviors\FormattingTextBoxBehavior.Android.cs" />
     <Compile Include="$(MSBuildThisFileDirectory)Behaviors\FormattingTextBoxBehavior.cs" />
     <Compile Include="$(MSBuildThisFileDirectory)Behaviors\FormattingTextBoxBehavior.iOS.cs" />

src/app/ApplicationTemplate.Shared.Views/Behaviors/CommandBarSafeAreaBehavior.cs

@@ -0,0 +1,34 @@
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+
+namespace ApplicationTemplate.Views.Behaviors;
+
+public class CommandBarSafeAreaBehavior
+{
+	public static bool GetApplySafeAreaWorkaround(DependencyObject obj) => (bool)obj.GetValue(ApplySafeAreaWorkaroundProperty);
+
+	public static void SetApplySafeAreaWorkaround(DependencyObject obj, bool value) => obj.SetValue(ApplySafeAreaWorkaroundProperty, value);
+
+	public static readonly DependencyProperty ApplySafeAreaWorkaroundProperty =
+		DependencyProperty.RegisterAttached(
+			"ApplySafeAreaWorkaround",
+			typeof(bool),
+			typeof(CommandBarSafeAreaBehavior),
+			new PropertyMetadata(false, OnPropertyChanged));
+
+	private static void OnPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
+	{
+		if (d is CommandBar commandBar && (bool)e.NewValue)
+		{
+#if ANDROID
+			commandBar.Loaded += (s, args) =>
+			{
+				// We only need to apply the workaround on Android other platforms work well without it.
+				// See this issue:https://github.com/unoplatform/uno/issues/6218
+				var statusBar = Windows.UI.ViewManagement.StatusBar.GetForCurrentView().OccludedRect.Height;
+				commandBar.Margin = new Thickness(0, statusBar, 0, 0);
+			};
+#endif
+		}
+	}
+}

src/app/ApplicationTemplate.Shared.Views/Styles/Controls/CommandBar.xaml

@@ -2,6 +2,7 @@
 					xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 					xmlns:win="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 					xmlns:toolkit="using:Uno.UI.Toolkit"
+					xmlns:behaviors="using:ApplicationTemplate.Views.Behaviors"
 					xmlns:c="using:ApplicationTemplate.Views.Controls">
 
 	<!-- 
@@ -130,6 +131,9 @@
 
 		<Setter Property="toolkit:VisibleBoundsPadding.PaddingMask"
 				Value="Top" />
+
+		<Setter Property="behaviors:CommandBarSafeAreaBehavior.ApplySafeAreaWorkaround"
+				Value="True" />
 	</Style>
 
 	<Style x:Key="TransparentCommandBarStyle"