[iOS/Catalyst] Fix Shell TitleView rendering issues on iOS 16 (#12834) …

…Fixes #10128 Fixes #11309 * Fix the issue * Added a sample in the Gallery * Added Device Test * Fix test * Update src/Controls/src/Core/Compatibility/Handlers/Shell/iOS/ShellPageRendererTracker.cs Co-authored-by: Manuel de la Pena <mandel@microsoft.com> --------- Co-authored-by: Rui Marinho <me@ruimarinho.net> Co-authored-by: Manuel de la Pena <mandel@microsoft.com>
dotnet · Feb 10, 2023 · 13fbb99 · 13fbb99
1 parent 5a01dbe
commit 13fbb99
Show file tree

Hide file tree

Showing 4 changed files with 73 additions and 8 deletions.
diff --git a/src/Controls/samples/Controls.Sample/Pages/AppShell.xaml b/src/Controls/samples/Controls.Sample/Pages/AppShell.xaml
@@ -6,8 +6,36 @@
     xmlns:pages="using:Maui.Controls.Sample.Pages"
     xmlns:shellPages="clr-namespace:Maui.Controls.Sample.Pages.ShellGalleries"
     FlyoutBackground="{AppThemeBinding Dark=Black, Light=White}"
-    Title="Welcome to Shell"
-    >
+    Title="{Binding ShellTitle}">
+    <Shell.TitleView>
+        <Grid
+            BackgroundColor="Red"
+            VerticalOptions="Center"
+            HeightRequest="44">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+            <Label 
+                FontSize="Large"
+                FontAttributes="Bold"
+                HorizontalTextAlignment="Center"
+                VerticalTextAlignment="Center"
+                Text="TitleView" />
+            <HorizontalStackLayout
+                Grid.Column="1"
+                Padding="6">
+                <Label
+                    FontSize="Small"
+                    HorizontalTextAlignment="Center"
+                    VerticalTextAlignment="Center"
+                    Text="{Binding ShellTitle}"/>
+                <Button
+                    Text="Change TabBar BackgroundColor"
+                    Clicked="OnChangeTabBarBackgroundColor" />
+            </HorizontalStackLayout>
+        </Grid>
+    </Shell.TitleView>
     <Shell.FlyoutHeader>
         <Image Source="dotnet_bot.png"></Image>
     </Shell.FlyoutHeader>

diff --git a/src/Controls/samples/Controls.Sample/Pages/AppShell.xaml.cs b/src/Controls/samples/Controls.Sample/Pages/AppShell.xaml.cs
@@ -12,8 +12,18 @@ public partial class AppShell
 		public AppShell()
 		{
 			InitializeComponent();
+			BindingContext = this;
 			SetTabBarBackgroundColor(this, Color.FromRgba(3, 169, 244, 255));
 		}
+
+		public string ShellTitle { get; set; } = "Welcome to Shell";
+
+		void OnChangeTabBarBackgroundColor(object sender, EventArgs e)
+		{
+			var random = new Random();
+
+			SetTabBarBackgroundColor(this, Color.FromRgb(random.Next(0, 255), random.Next(0, 255), random.Next(0, 255)));
+		}
 	}
 
 	public class PageSearchHandler : SearchHandler

diff --git a/src/Controls/src/Core/Compatibility/Handlers/Shell/iOS/ShellPageRendererTracker.cs b/src/Controls/src/Core/Compatibility/Handlers/Shell/iOS/ShellPageRendererTracker.cs
@@ -1,4 +1,4 @@
-#nullable disable
+#nullable disable
 using System;
 using System.Collections.Generic;
 using System.Collections.Specialized;
@@ -551,7 +551,7 @@ public override void WillMoveToSuperview(UIView newSuper)
 
 			void UpdateFrame(UIView newSuper)
 			{
-				if (newSuper != null)
+				if (newSuper is not null && newSuper.Bounds != CGRect.Empty)
 				{
 					if (!(OperatingSystem.IsIOSVersionAtLeast(11) || OperatingSystem.IsTvOSVersionAtLeast(11)))
 						Frame = new CGRect(Frame.X, newSuper.Bounds.Y, Frame.Width, newSuper.Bounds.Height);

diff --git a/src/Controls/tests/DeviceTests/Elements/Shell/ShellTests.iOS.cs b/src/Controls/tests/DeviceTests/Elements/Shell/ShellTests.iOS.cs
@@ -4,22 +4,20 @@
 using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
+using CoreGraphics;
 using Foundation;
 using Microsoft.Maui.Controls;
 using Microsoft.Maui.Controls.Handlers.Compatibility;
 using Microsoft.Maui.Controls.Platform;
 using Microsoft.Maui.Controls.Platform.Compatibility;
 using Microsoft.Maui.Controls.PlatformConfiguration;
 using Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;
+using Microsoft.Maui.Graphics;
 using Microsoft.Maui.Platform;
 using UIKit;
 using Xunit;
 using UIModalPresentationStyle = Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific.UIModalPresentationStyle;
-using CoreGraphics;
-
-#if ANDROID || IOS || MACCATALYST
 using ShellHandler = Microsoft.Maui.Controls.Handlers.Compatibility.ShellRenderer;
-#endif
 
 namespace Microsoft.Maui.DeviceTests
 {
@@ -203,6 +201,35 @@ void ShellNavigating(object sender, ShellNavigatingEventArgs e)
 			});
 		}
 
+		[Fact(DisplayName = "TitleView renders correctly")]
+		public async Task TitleViewRendersCorrectly()
+		{
+			SetupBuilder();
+
+			var expected = Colors.Red;
+
+			var shellTitleView = new VerticalStackLayout { BackgroundColor = expected };
+			var titleViewContent = new Label { Text = "TitleView" };
+			shellTitleView.Children.Add(titleViewContent);
+
+			var shell = await CreateShellAsync(shell =>
+			{
+				Shell.SetTitleView(shell, shellTitleView);
+
+				shell.CurrentItem = new ContentPage();
+			});
+
+			await CreateHandlerAndAddToWindow<ShellHandler>(shell, async (handler) =>
+			{
+				await Task.Delay(100);
+				Assert.NotNull(shell.Handler);
+				var platformShellTitleView = shellTitleView.ToPlatform();
+				Assert.Equal(platformShellTitleView, GetTitleView(handler));
+				Assert.NotEqual(platformShellTitleView.Frame, CGRect.Empty);
+				Assert.Equal(platformShellTitleView.BackgroundColor.ToColor(), expected);
+			});
+		}
+
 		protected async Task OpenFlyout(ShellRenderer shellRenderer, TimeSpan? timeOut = null)
 		{
 			var flyoutView = GetFlyoutPlatformView(shellRenderer);