From 823b4938ad48478d9c3025b4ef43da78bd06063a Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Tue, 8 Oct 2024 14:29:27 +0100
Subject: [PATCH 01/12] fix: Use proper container for TabBar ItemTemplate

---
 .../Content/Controls/TabBarSamplePage.xaml    | 28 +++++++++----
 .../Content/Controls/TabBarSamplePage.xaml.cs |  5 ++-
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs  | 42 ++++++++++++++++---
 3 files changed, 61 insertions(+), 14 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
index 1cf9d13a5..8e48b436f 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
@@ -265,8 +265,20 @@
 			<DataTemplate>
 				<StackPanel Padding="0,20"
 							Spacing="20">
+					<utu:TabBar SelectedIndex="0"
+								ItemsSource="{Binding Data.Items}"
+								Style="{StaticResource TopTabBarStyle}">
+						<utu:TabBar.ItemTemplate>
+							<DataTemplate>
+								<!-- Style="{StaticResource MaterialTopTabBarItemStyle}" -->
+								<utu:TabBarItem Background="Red"
+												Content="{Binding}" />
+								<!--<TextBlock Text="{Binding}" />-->
+							</DataTemplate>
+						</utu:TabBar.ItemTemplate>
+					</utu:TabBar>
 					<!--#region TopTabBarStyle-->
-					<TextBlock Text="Standard TabBar Style"
+					<!--<TextBlock Text="Standard TabBar Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
 					<Button Content="Show Top TabBar Sample"
@@ -352,9 +364,9 @@
 							 AutomationProperties.AutomationId="M3_Tab3_Count"
 							 Text="{Binding Data.Tab3Count}" />
 					</TextBlock>
-					<!--#endregion-->
+					--><!--#endregion-->
 
-					<!--#region ColoredTopTabBarStyle-->
+					<!--#region ColoredTopTabBarStyle--><!--
 					<TextBlock Text="Top TabBar Colored Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
@@ -438,9 +450,9 @@
 							 AutomationProperties.AutomationId="M3_Colored_Tab3_Count"
 							 Text="{Binding Data.Tab3Count}" />
 					</TextBlock>
-					<!--#endregion-->
+					--><!--#endregion-->
 
-					<!--#region BottomTabBarStyle-->
+					<!--#region BottomTabBarStyle--><!--
 					<TextBlock Text="Bottom TabBar Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
@@ -591,9 +603,9 @@
 							</utu:TabBar.Items>
 						</utu:TabBar>
 					</ContentControl>
-					<!--#endregion-->
+					--><!--#endregion-->
 
-					<!--#region VerticalTabBarStyle-->
+					<!--#region VerticalTabBarStyle--><!--
 					<TextBlock Text="Vertical TabBar Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
@@ -746,7 +758,7 @@
 								</utu:TabBarItem>
 							</utu:TabBar.Items>
 						</utu:TabBar>
-					</ContentControl>
+					</ContentControl>-->
 					<!--#endregion-->
 
 				</StackPanel>
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs
index c34d65c20..0e2aa35c0 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs
@@ -8,6 +8,7 @@
 using Uno.Toolkit.Samples.Content.NestedSamples;
 using Uno.Toolkit.Samples.Entities;
 using Uno.Toolkit.Samples.ViewModels;
+using Uno.Toolkit.UI;
 using Windows.Foundation;
 using Windows.Foundation.Collections;
 
@@ -91,6 +92,7 @@ public class TabBarViewModel : ViewModelBase
         public int CupertinoBottomTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
 
         public List<string> Items { get => GetProperty<List<string>>(); set => SetProperty(value); }
+        public List<TabBarItem> ItemsTb { get => GetProperty<List<TabBarItem>>(); set => SetProperty(value); }
 
         public ICommand Tab1CountCommand => new Command(_ => Tab1Count++);
         public ICommand Tab2CountCommand => new Command(_ => Tab2Count++);
@@ -110,7 +112,8 @@ public class TabBarViewModel : ViewModelBase
 
         public TabBarViewModel()
 		{
-            Items = new List<string> { "Tab 1", "Tab 2", "Tab 3" };
+			Items = new List<string> { "Tab 1", "Tab 2", "Tab 3" };
+			ItemsTb = new List<TabBarItem> { new TabBarItem() { Content = "Tab 1" }, new TabBarItem() { Content = "Tab 2" }, new TabBarItem() { Content = "Tab 3" } };
 		}
 	}
 }
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index 215320638..96f7f9d82 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -59,17 +59,49 @@ protected override void OnApplyTemplate()
 
 		protected override bool IsItemItsOwnContainerOverride(object item) => item is TabBarItem;
 
-		protected override DependencyObject GetContainerForItemOverride() => new TabBarItem();
+		protected override DependencyObject GetContainerForItemOverride()
+		{
+			if (ItemTemplate != null)
+			{
+				var templateContent = ItemTemplate.LoadContent();
+
+				if (templateContent is TabBarItem)
+				{
+					return new ContentPresenter();
+				}
+			}
+
+			return new TabBarItem();
+		}
 
 		protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
 		{
 			base.PrepareContainerForItemOverride(element, item);
 
+			void SetupTabBarItem(TabBarItem item)
+			{
+				item.IsSelected = IsSelected(IndexFromContainer(element));
+				item.Click += OnTabBarItemClick;
+				item.IsSelectedChanged += OnTabBarIsSelectedChanged;
+			}
+
 			if (element is TabBarItem container)
-			{	
-				container.IsSelected = IsSelected(IndexFromContainer(element));
-				container.Click += OnTabBarItemClick;
-				container.IsSelectedChanged += OnTabBarIsSelectedChanged;
+			{
+				SetupTabBarItem(container);
+			}
+			else if (element is ContentPresenter contentPresenter)
+			{
+				var contentTemplate = contentPresenter.ContentTemplate.LoadContent();
+				if (contentTemplate is TabBarItem tabBarItem)
+				{
+					contentPresenter.ContentTemplate = null;
+
+					SetupTabBarItem(tabBarItem);
+
+					tabBarItem.DataContext = item;
+					
+					contentPresenter.Content = tabBarItem;
+				}
 			}
 		}
 

From 8d5e9674ba17e0ce9b3349539e077d977fea6442 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Tue, 8 Oct 2024 12:32:12 -0400
Subject: [PATCH 02/12] chore: fix tabbar selection when using template with
 TBI

---
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs | 24 ++++++++++++--------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index 96f7f9d82..29bb1f538 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -41,6 +41,7 @@ public partial class TabBar : ItemsControl
 		private object? _previouslySelectedItem;
 		private bool _isLoaded;
 		private bool _isUpdatingSelectedItem;
+		private bool _isUsingOwnContainerAsTemplateRoot;
 
 		public TabBar()
 		{
@@ -57,18 +58,13 @@ protected override void OnApplyTemplate()
 			UpdateIndicatorPlacement();
 		}
 
-		protected override bool IsItemItsOwnContainerOverride(object item) => item is TabBarItem;
+		protected override bool IsItemItsOwnContainerOverride(object? item) => item is TabBarItem;
 
 		protected override DependencyObject GetContainerForItemOverride()
 		{
-			if (ItemTemplate != null)
+			if (_isUsingOwnContainerAsTemplateRoot)
 			{
-				var templateContent = ItemTemplate.LoadContent();
-
-				if (templateContent is TabBarItem)
-				{
-					return new ContentPresenter();
-				}
+				return new ContentPresenter();
 			}
 
 			return new TabBarItem();
@@ -259,6 +255,13 @@ private void OnItemsSourceChanged()
 			SynchronizeInitialSelection();
 		}
 
+		protected override void OnItemTemplateChanged(DataTemplate oldItemTemplate, DataTemplate newItemTemplate)
+		{
+			base.OnItemTemplateChanged(oldItemTemplate, newItemTemplate);
+
+			_isUsingOwnContainerAsTemplateRoot = IsItemItsOwnContainerOverride(newItemTemplate?.LoadContent());
+		}
+
 		private void OnSelectedItemChanged(DependencyPropertyChangedEventArgs? args)
 		{
 			if (_isSynchronizingSelection)
@@ -333,7 +336,10 @@ private void SynchronizeSelection(TabBarItem? item)
 			{
 				_isSynchronizingSelection = true;
 
-				foreach (var container in this.GetItemContainers<TabBarItem>())
+				var containers = !_isUsingOwnContainerAsTemplateRoot
+					? this.GetItemContainers<TabBarItem>()
+					: this.GetItemContainers<ContentPresenter>().Select(x => x.Content).OfType<TabBarItem>();
+				foreach (var container in containers)
 				{
 					if (!container.IsSelected)
 					{

From 4eb4df9f2168dd79e499132498eca0df6fe98076 Mon Sep 17 00:00:00 2001
From: xiaoy312 <xiaoyao312@gmail.com>
Date: Tue, 8 Oct 2024 14:24:39 -0400
Subject: [PATCH 03/12] chore: fix tabbar selection indicator

---
 .../Tests/TabBarTests.cs                      | 13 +--
 .../Behaviors/TabBarSelectorBehaviorState.cs  | 14 ++--
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs  | 83 ++++++++++++++-----
 .../TabBarSelectionIndicatorPresenter.cs      | 17 ++--
 4 files changed, 85 insertions(+), 42 deletions(-)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
index 04e22e9f5..1a4347f56 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
@@ -259,7 +259,7 @@ public async Task Verify_Padding(
 
 			await UnitTestUIContentHelperEx.SetContentAndWait(rootGrid);
 
-		
+
 			var c = GetMinCalculatedDimen();
 			var expectedDimen = Math.Max(c, minDimen);
 			double actualDimen = orientation switch
@@ -311,19 +311,20 @@ public async Task Verify_Indicator_Display_On_Selection()
 
 			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
 
-		
+
 
 			for (int i = 0; i < NumItems; i++)
 			{
 				SUT.SelectedIndex = i;
 				await UnitTestsUIContentHelper.WaitForIdle();
 
-				var selectedItem = SUT.ContainerFromItem(SUT.SelectedItem) as TabBarItem;
+				var container = SUT.ContainerFromItem(SUT.SelectedItem);
+				var selectedItem = SUT.GetInnerContainer(container);
 				Assert.IsNotNull(selectedItem);
 
 				var renderer = await SUT.TakeScreenshot();
 				var centerPoint = selectedItem!.TransformToVisual(SUT).TransformPoint(new Point(selectedItem.ActualWidth / 2, selectedItem.ActualHeight / 2));
-				
+
 				await renderer.AssertColorAt(Colors.Red, (int)centerPoint.X, (int)centerPoint.Y);
 
 				foreach (var nonSelected in SUT.Items.Cast<TabBarItem>().Where(x => !x.IsSelected))
@@ -380,10 +381,10 @@ public async Task Verify_Indicator_Placement(IndicatorPlacement placement)
 			var abovePresenter = VisualTreeHelperEx
 				.GetFirstDescendant<TabBarSelectionIndicatorPresenter>(SUT, x => x.Name == "AboveSelectionIndicatorPresenter");
 
-			
+
 			var renderer = await SUT.TakeScreenshot();
 			var centerPoint = item.TransformToVisual(SUT).TransformPoint(new Point(item.ActualWidth / 2, item.ActualHeight / 2));
-			
+
 
 			if (placement == IndicatorPlacement.Above)
 			{
diff --git a/src/Uno.Toolkit.UI/Behaviors/TabBarSelectorBehaviorState.cs b/src/Uno.Toolkit.UI/Behaviors/TabBarSelectorBehaviorState.cs
index e7a9130fe..54fe9c7ed 100644
--- a/src/Uno.Toolkit.UI/Behaviors/TabBarSelectorBehaviorState.cs
+++ b/src/Uno.Toolkit.UI/Behaviors/TabBarSelectorBehaviorState.cs
@@ -53,7 +53,7 @@ public void Connect()
 		partial void ConnectPartial();
 
 		public void Disconnect()
-		{ 
+		{
 			if (Selector != null)
 			{
 				Selector.SelectionChanged -= OnSelectorSelectionChanged;
@@ -74,7 +74,7 @@ public void Disconnect()
 			int unselectableCount = 0;
 			for (int i = 0; i < index; i++)
 			{
-				if (TabBar.ContainerFromIndex(i) is TabBarItem { IsSelectable: false })
+				if (TabBar.InnerContainerFromIndex(i) is TabBarItem { IsSelectable: false })
 				{
 					unselectableCount++;
 				}
@@ -88,7 +88,7 @@ public void Disconnect()
 			int skipped = 0;
 			for (int i = 0; i < TabBar.Items.Count; i++)
 			{
-				if (TabBar.ContainerFromIndex(i) is TabBarItem { IsSelectable: true })
+				if (TabBar.InnerContainerFromIndex(i) is TabBarItem { IsSelectable: true })
 				{
 					if (skipped == index)
 					{
@@ -151,8 +151,8 @@ public void UpdateOffset(int position, double progress, double totalOffset)
 				return;
 			}
 
-			var selectedTabBarItem = TabBar.ContainerFromIndex(previousIndex.Value) as TabBarItem;
-			var nextTabBarItem = TabBar.ContainerFromIndex(nextTabIndex.Value) as TabBarItem;
+			var selectedTabBarItem = TabBar.InnerContainerFromIndex(previousIndex.Value) as TabBarItem;
+			var nextTabBarItem = TabBar.InnerContainerFromIndex(nextTabIndex.Value) as TabBarItem;
 
 			var currentX = GetRelativeX(selectedTabBarItem);
 			var nextX = GetRelativeX(nextTabBarItem);
@@ -162,7 +162,7 @@ public void UpdateOffset(int position, double progress, double totalOffset)
 			var indicatorPosition = currentX + ((selectedTabBarItem?.ActualWidth ?? 0) / 2) - (selectionIndicator.ActualSize.X / 2);
 
 			SelectorExtensions.SetSelectionOffset(
-				TabBar, 
+				TabBar,
 				toRight
 				? indicatorPosition + (progress * distance)
 				: indicatorPosition - ((1 - progress) * distance)
@@ -173,7 +173,7 @@ private void UpdateOffsetToPosition(int position, UIElement selectionIndicator)
 		{
 			if (MapIndexToTabBar(position) is { } index && index >= 0 && index < TabBar.Items.Count)
 			{
-				var tabItem = TabBar.ContainerFromIndex(index) as TabBarItem;
+				var tabItem = TabBar.InnerContainerFromIndex(index) as TabBarItem;
 				SelectorExtensions.SetSelectionOffset(TabBar, GetRelativeX(tabItem) + ((tabItem?.ActualWidth ?? 0) / 2) - (selectionIndicator.ActualSize.X / 2));
 			}
 		}
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index 29bb1f538..1d2dfc975 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -37,11 +37,12 @@ public partial class TabBar : ItemsControl
 	{
 		private const string TabBarGridName = "TabBarGrid";
 
+		internal bool IsUsingOwnContainerAsTemplateRoot { get; private set; }
+
 		private bool _isSynchronizingSelection;
 		private object? _previouslySelectedItem;
 		private bool _isLoaded;
 		private bool _isUpdatingSelectedItem;
-		private bool _isUsingOwnContainerAsTemplateRoot;
 
 		public TabBar()
 		{
@@ -62,7 +63,7 @@ protected override void OnApplyTemplate()
 
 		protected override DependencyObject GetContainerForItemOverride()
 		{
-			if (_isUsingOwnContainerAsTemplateRoot)
+			if (IsUsingOwnContainerAsTemplateRoot)
 			{
 				return new ContentPresenter();
 			}
@@ -85,18 +86,19 @@ void SetupTabBarItem(TabBarItem item)
 			{
 				SetupTabBarItem(container);
 			}
-			else if (element is ContentPresenter contentPresenter)
+			else if (IsUsingOwnContainerAsTemplateRoot &&
+				element is ContentPresenter outerContainer)
 			{
-				var contentTemplate = contentPresenter.ContentTemplate.LoadContent();
-				if (contentTemplate is TabBarItem tabBarItem)
+				var templateRoot = outerContainer.ContentTemplate.LoadContent();
+				if (templateRoot is TabBarItem tabBarItem)
 				{
-					contentPresenter.ContentTemplate = null;
+					outerContainer.ContentTemplate = null;
 
 					SetupTabBarItem(tabBarItem);
 
 					tabBarItem.DataContext = item;
-					
-					contentPresenter.Content = tabBarItem;
+
+					outerContainer.Content = tabBarItem;
 				}
 			}
 		}
@@ -110,11 +112,28 @@ protected override void ClearContainerForItemOverride(DependencyObject element,
 		{
 			base.ClearContainerForItemOverride(element, item);
 
+			void TearDownTabBarItem(TabBarItem item)
+			{
+				item.Click -= OnTabBarItemClick;
+				item.IsSelectedChanged -= OnTabBarIsSelectedChanged;
+				if (!IsUsingOwnContainerAsTemplateRoot)
+				{
+					item.Style = null;
+				}
+			}
 			if (element is TabBarItem container)
 			{
-				container.Click -= OnTabBarItemClick;
-				container.IsSelectedChanged -= OnTabBarIsSelectedChanged;
-				container.Style = null;
+				TearDownTabBarItem(container);
+			}
+			else if (IsUsingOwnContainerAsTemplateRoot &&
+				element is ContentPresenter outerContainer)
+			{
+				if (outerContainer.Content is TabBarItem innerContainer)
+				{
+					TearDownTabBarItem(innerContainer);
+					innerContainer.DataContext = null;
+				}
+				outerContainer.Content = null;
 			}
 		}
 
@@ -131,9 +150,9 @@ e is IVectorChangedEventArgs iVCE
 				{
 					var item = Items[(int)iVCE.Index];
 
-					if (item is TabBarItem tabBarItem && tabBarItem.IsSelected)
+					if (GetInnerContainer(item as DependencyObject) is { IsSelected: true } selected)
 					{
-						SelectedItem = tabBarItem;
+						SelectedItem = selected;
 					}
 				}
 				else if (iVCE.CollectionChange == CollectionChange.ItemRemoved)
@@ -164,7 +183,7 @@ private void SynchronizeInitialSelection()
 			if (SelectedItem != null)
 			{
 				OnSelectedItemChanged(null);
-			} 
+			}
 			else if (SelectedIndex >= 0)
 			{
 				OnSelectedIndexChanged(null);
@@ -259,7 +278,7 @@ protected override void OnItemTemplateChanged(DataTemplate oldItemTemplate, Data
 		{
 			base.OnItemTemplateChanged(oldItemTemplate, newItemTemplate);
 
-			_isUsingOwnContainerAsTemplateRoot = IsItemItsOwnContainerOverride(newItemTemplate?.LoadContent());
+			IsUsingOwnContainerAsTemplateRoot = IsItemItsOwnContainerOverride(newItemTemplate?.LoadContent());
 		}
 
 		private void OnSelectedItemChanged(DependencyPropertyChangedEventArgs? args)
@@ -336,19 +355,20 @@ private void SynchronizeSelection(TabBarItem? item)
 			{
 				_isSynchronizingSelection = true;
 
-				var containers = !_isUsingOwnContainerAsTemplateRoot
-					? this.GetItemContainers<TabBarItem>()
-					: this.GetItemContainers<ContentPresenter>().Select(x => x.Content).OfType<TabBarItem>();
+				var containers = this.GetItemContainers<UIElement>();
 				foreach (var container in containers)
 				{
-					if (!container.IsSelected)
+					var tbi = GetInnerContainer(container);
+					if (tbi is not { }) continue;
+
+					if (!tbi.IsSelected)
 					{
 						continue;
 					}
 
-					if (container != item)
+					if (tbi != item)
 					{
-						container.IsSelected = false;
+						tbi.IsSelected = false;
 					}
 					else
 					{
@@ -390,6 +410,27 @@ private void RaiseSelectionChangedEvent(object? prevItem, object? nextItem)
 			SelectionChanged?.Invoke(this, eventArgs);
 		}
 
+		internal TabBarItem? GetInnerContainer(DependencyObject? container)
+		{
+			if (IsUsingOwnContainerAsTemplateRoot)
+			{
+				return (container as ContentPresenter)?.Content as TabBarItem;
+			}
+
+			return container as TabBarItem;
+		}
+
+		internal DependencyObject? InnerContainerFromIndex(int index)
+		{
+			var container = ContainerFromIndex(index);
+			if (IsUsingOwnContainerAsTemplateRoot)
+			{
+				container = (container as ContentPresenter)?.Content as DependencyObject;
+			}
+
+			return container;
+		}
+
 		private bool IsReady => _isLoaded && HasItems;
 
 		private bool HasItems => this.GetItems().Any();
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs
index 1dbaffe44..b8a300444 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs
@@ -224,23 +224,24 @@ private void UpdateSelectionIndicatorMaxSize()
 			if (Owner is { } tabBar
 				&& GetSelectionIndicator() is { } indicator)
 			{
-				var tabBarItems = tabBar.GetItemContainers<TabBarItem>().Where(tbi => tbi.Visibility == Visibility.Visible);
-				if (tabBarItems.None())
+				var tabBarItems =tabBar.GetItemContainers<UIElement>()
+					.Select(tabBar.GetInnerContainer)
+					.OfType<TabBarItem>();
+				var visibleItems = tabBarItems.Count(x => x.Visibility == Visibility.Visible);
+				if (visibleItems is 0)
 				{
 					return;
 				}
 
 				var maxSize = new Size();
-				var numItems = tabBarItems.Count();
-
 				if (tabBar.Orientation == Orientation.Vertical)
 				{
-					maxSize.Height = tabBar.ActualHeight / numItems;
+					maxSize.Height = tabBar.ActualHeight / visibleItems;
 					maxSize.Width = tabBar.ActualWidth;
 				}
 				else
 				{
-					maxSize.Width = tabBar.ActualWidth / numItems;
+					maxSize.Width = tabBar.ActualWidth / visibleItems;
 					maxSize.Height = tabBar.ActualHeight;
 				}
 
@@ -297,7 +298,7 @@ private void SynchronizeSelection()
 				return;
 			}
 
-			if (tabBar.ContainerFromIndex(tabBar.SelectedIndex) is TabBarItem newSelectedItem)
+			if (tabBar.InnerContainerFromIndex(tabBar.SelectedIndex) is TabBarItem newSelectedItem)
 			{
 				newSelectedItem.SizeChanged += OnSelectedTabBarItemSizeChanged;
 				_tabBarItemSizeChangedRevoker.Disposable = Disposable.Create(() => newSelectedItem.SizeChanged -= OnSelectedTabBarItemSizeChanged);
@@ -331,7 +332,7 @@ private void UpdateSelectionIndicatorPosition(Point? destination = null)
 
 			if (destination == null && tabBar.SelectedIndex != -1)
 			{
-				destination = GetRelativePosition(tabBar.ContainerFromIndex(tabBar.SelectedIndex) as TabBarItem);
+				destination = GetRelativePosition(tabBar.InnerContainerFromIndex(tabBar.SelectedIndex) as TabBarItem);
 			}
 
 			if (destination == null ||

From f425504ec55e312bec99330f04f6f1b5e5a665f4 Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Wed, 9 Oct 2024 14:07:43 +0100
Subject: [PATCH 04/12] chore: fix SelectedIndexChanged when using tbi template

---
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index 1d2dfc975..5362a21aa 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -310,10 +310,10 @@ private void OnSelectedIndexChanged(DependencyPropertyChangedEventArgs? args)
 			TabBarItem? oldItem = null;
 			if (args?.OldValue is int oldIndex && oldIndex != -1)
 			{
-				oldItem = this.ContainerFromIndexSafe<TabBarItem>(oldIndex);
+				oldItem = this.InnerContainerFromIndexSafe(oldIndex);
 			}
 
-			var newItem = this.ContainerFromIndexSafe<TabBarItem>(SelectedIndex);
+			var newItem = this.InnerContainerFromIndexSafe(SelectedIndex);
 
 			if (TryUpdateTabBarItemSelectedState(oldItem, newItem))
 			{
@@ -431,6 +431,16 @@ private void RaiseSelectionChangedEvent(object? prevItem, object? nextItem)
 			return container;
 		}
 
+		private TabBarItem? InnerContainerFromIndexSafe(int index)
+		{
+			if (index >= 0 && index < Items.Count)
+			{
+				return InnerContainerFromIndex(index) as TabBarItem;
+			}
+
+			return null;
+		}
+
 		private bool IsReady => _isLoaded && HasItems;
 
 		private bool HasItems => this.GetItems().Any();

From 78ed3ebe7b0a80a796ac3b3bb19641f2b5ac41de Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Wed, 9 Oct 2024 18:23:32 +0100
Subject: [PATCH 05/12] chore: Fix tbi style when using ItemTemplate

---
 .../Content/Controls/TabBarSamplePage.xaml    | 125 ++++++++++++++----
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs  |   4 +-
 2 files changed, 101 insertions(+), 28 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
index 8e48b436f..059b2bdba 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
@@ -27,7 +27,7 @@
 			<DataTemplate>
 				<StackPanel Padding="0,20"
 							Spacing="20">
-					<!--  Standard TabBar Style  -->
+					<!-- Standard TabBar Style -->
 					<TextBlock Text="Top TabBar Style"
 							   Style="{StaticResource MaterialHeadline6}" />
 
@@ -106,7 +106,7 @@
 							 Text="{Binding Data.Tab3Count}" />
 					</TextBlock>
 
-					<!--  Colored TabBar Style  -->
+					<!-- Colored TabBar Style -->
 					<TextBlock Text="Top TabBar Colored Style"
 							   Style="{StaticResource MaterialHeadline6}" />
 
@@ -182,7 +182,7 @@
 					</TextBlock>
 
 
-					<!--  Bottom TabBar Style  -->
+					<!-- Bottom TabBar Style -->
 					<TextBlock Text="Bottom TabBar Style"
 							   Style="{StaticResource MaterialHeadline6}" />
 
@@ -265,20 +265,9 @@
 			<DataTemplate>
 				<StackPanel Padding="0,20"
 							Spacing="20">
-					<utu:TabBar SelectedIndex="0"
-								ItemsSource="{Binding Data.Items}"
-								Style="{StaticResource TopTabBarStyle}">
-						<utu:TabBar.ItemTemplate>
-							<DataTemplate>
-								<!-- Style="{StaticResource MaterialTopTabBarItemStyle}" -->
-								<utu:TabBarItem Background="Red"
-												Content="{Binding}" />
-								<!--<TextBlock Text="{Binding}" />-->
-							</DataTemplate>
-						</utu:TabBar.ItemTemplate>
-					</utu:TabBar>
+
 					<!--#region TopTabBarStyle-->
-					<!--<TextBlock Text="Standard TabBar Style"
+					<TextBlock Text="Standard TabBar Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
 					<Button Content="Show Top TabBar Sample"
@@ -349,6 +338,7 @@
 							</utu:TabBar.Items>
 						</utu:TabBar>
 					</ContentControl>
+
 					<TextBlock HorizontalAlignment="Center"
 							   Style="{StaticResource LabelSmall}">
 						<Run Text="Tab 1 clicked count:" />
@@ -364,9 +354,37 @@
 							 AutomationProperties.AutomationId="M3_Tab3_Count"
 							 Text="{Binding Data.Tab3Count}" />
 					</TextBlock>
-					--><!--#endregion-->
 
-					<!--#region ColoredTopTabBarStyle--><!--
+					<TextBlock Text="ItemTemplate with TabBarItem" />
+					<ContentControl Height="130"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar SelectedIndex="0"
+									ItemsSource="{Binding Data.Items}"
+									Style="{StaticResource TopTabBarStyle}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<utu:TabBarItem Content="{Binding}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
+
+					<TextBlock Text="ItemTemplate with TextBlock" />
+					<ContentControl Height="130"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar SelectedIndex="0"
+									ItemsSource="{Binding Data.Items}"
+									Style="{StaticResource TopTabBarStyle}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<TextBlock Text="{Binding}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
+					<!--#endregion-->
+
+					<!--#region ColoredTopTabBarStyle-->
 					<TextBlock Text="Top TabBar Colored Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
@@ -450,9 +468,9 @@
 							 AutomationProperties.AutomationId="M3_Colored_Tab3_Count"
 							 Text="{Binding Data.Tab3Count}" />
 					</TextBlock>
-					--><!--#endregion-->
+					<!--#endregion-->
 
-					<!--#region BottomTabBarStyle--><!--
+					<!--#region BottomTabBarStyle-->
 					<TextBlock Text="Bottom TabBar Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
@@ -603,9 +621,38 @@
 							</utu:TabBar.Items>
 						</utu:TabBar>
 					</ContentControl>
-					--><!--#endregion-->
 
-					<!--#region VerticalTabBarStyle--><!--
+					<TextBlock Text="ItemTemplate with TabBarItem" />
+					<ContentControl Height="130"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar SelectedIndex="0"
+									ItemsSource="{Binding Data.Items}"
+									Style="{StaticResource BottomTabBarStyle}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<utu:TabBarItem Content="{Binding}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
+
+					<TextBlock Text="ItemTemplate with TextBlock" />
+					<ContentControl Height="130"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar SelectedIndex="0"
+									ItemsSource="{Binding Data.Items}"
+									Style="{StaticResource BottomTabBarStyle}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<TextBlock Text="{Binding}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
+
+					<!--#endregion-->
+
+					<!--#region VerticalTabBarStyle-->
 					<TextBlock Text="Vertical TabBar Style"
 							   Style="{StaticResource HeadlineSmall}" />
 
@@ -689,6 +736,7 @@
 							</utu:TabBar.Items>
 						</utu:TabBar>
 					</ContentControl>
+
 					<TextBlock HorizontalAlignment="Center"
 							   Style="{StaticResource LabelSmall}">
 						<Run Text="Tab 1 clicked count:" />
@@ -758,9 +806,36 @@
 								</utu:TabBarItem>
 							</utu:TabBar.Items>
 						</utu:TabBar>
-					</ContentControl>-->
-					<!--#endregion-->
+					</ContentControl>
+
+					<TextBlock Text="ItemTemplate with TabBarItem" />
+					<ContentControl Height="500"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar SelectedIndex="0"
+									ItemsSource="{Binding Data.Items}"
+									Style="{StaticResource VerticalTabBarStyle}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<utu:TabBarItem Content="{Binding}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
 
+					<TextBlock Text="ItemTemplate with TextBlock" />
+					<ContentControl Height="500"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar SelectedIndex="0"
+									ItemsSource="{Binding Data.Items}"
+									Style="{StaticResource VerticalTabBarStyle}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<TextBlock Text="{Binding}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
+					<!--#endregion-->
 				</StackPanel>
 			</DataTemplate>
 		</sample:SamplePageLayout.M3MaterialTemplate>
@@ -769,7 +844,7 @@
 			<DataTemplate>
 				<StackPanel Padding="0,20"
 							Spacing="20">
-					<!--  Bottom TabBar Style  -->
+					<!-- Bottom TabBar Style -->
 					<TextBlock Text="Bottom TabBar Style"
 							   Style="{StaticResource CupertinoHeadline}" />
 
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index 5362a21aa..b901fb697 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -93,11 +93,9 @@ void SetupTabBarItem(TabBarItem item)
 				if (templateRoot is TabBarItem tabBarItem)
 				{
 					outerContainer.ContentTemplate = null;
-
 					SetupTabBarItem(tabBarItem);
-
 					tabBarItem.DataContext = item;
-
+					tabBarItem.Style ??= ItemContainerStyle;
 					outerContainer.Content = tabBarItem;
 				}
 			}

From 61b455f8800ab9a281f1156041afa0aed4d2863e Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Wed, 9 Oct 2024 19:07:51 +0100
Subject: [PATCH 06/12] chore: Add ItemTemplate TabBarItem disabled example

---
 .../Content/Controls/TabBarSamplePage.xaml    | 39 +++++++++++++
 .../Content/Controls/TabBarSamplePage.xaml.cs | 55 ++++++++++---------
 2 files changed, 67 insertions(+), 27 deletions(-)

diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
index 059b2bdba..9693cc9fd 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
@@ -382,6 +382,19 @@
 							</utu:TabBar.ItemTemplate>
 						</utu:TabBar>
 					</ContentControl>
+
+					<TextBlock Text="ItemTemplate with Disabled item" />
+					<ContentControl Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar Style="{StaticResource TopTabBarStyle}"
+									ItemsSource="{Binding Data.MenuItems}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<utu:TabBarItem Content="{Binding Name}"
+													IsEnabled="{Binding IsSelectable}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
 					<!--#endregion-->
 
 					<!--#region ColoredTopTabBarStyle-->
@@ -650,6 +663,18 @@
 						</utu:TabBar>
 					</ContentControl>
 
+					<TextBlock Text="ItemTemplate with Disabled item" />
+					<ContentControl Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar Style="{StaticResource BottomTabBarStyle}"
+									ItemsSource="{Binding Data.MenuItems}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<utu:TabBarItem Content="{Binding Name}"
+													IsEnabled="{Binding IsSelectable}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
 					<!--#endregion-->
 
 					<!--#region VerticalTabBarStyle-->
@@ -835,6 +860,20 @@
 							</utu:TabBar.ItemTemplate>
 						</utu:TabBar>
 					</ContentControl>
+
+					<TextBlock Text="ItemTemplate with Disabled item" />
+					<ContentControl Height="500"
+									Template="{StaticResource TabBarSampleTemplate}">
+						<utu:TabBar Style="{StaticResource VerticalTabBarStyle}"
+									ItemsSource="{Binding Data.MenuItems}">
+							<utu:TabBar.ItemTemplate>
+								<DataTemplate>
+									<utu:TabBarItem Content="{Binding Name}"
+													IsEnabled="{Binding IsSelectable}" />
+								</DataTemplate>
+							</utu:TabBar.ItemTemplate>
+						</utu:TabBar>
+					</ContentControl>
 					<!--#endregion-->
 				</StackPanel>
 			</DataTemplate>
diff --git a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs
index 0e2aa35c0..b8812feb0 100644
--- a/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs
+++ b/samples/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml.cs
@@ -75,45 +75,46 @@ private void ShowM3MaterialVerticalBarSampleInNestedFrame(object sender, RoutedE
 
 	public class TabBarViewModel : ViewModelBase
 	{
-        public int Tab1Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int Tab2Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int Tab3Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int Tab1Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int Tab2Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int Tab3Count { get => GetProperty<int>(); set => SetProperty(value); }
 
-        public int MaterialBottomTab1Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int MaterialBottomTab2Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int MaterialBottomTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int MaterialBottomTab1Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int MaterialBottomTab2Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int MaterialBottomTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
 
 		public int MaterialVerticalTab1Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int MaterialVerticalTab2Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int MaterialVerticalTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int MaterialVerticalTab2Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int MaterialVerticalTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
 
-        public int CupertinoBottomTab1Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int CupertinoBottomTab2Count { get => GetProperty<int>(); set => SetProperty(value); }
-        public int CupertinoBottomTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int CupertinoBottomTab1Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int CupertinoBottomTab2Count { get => GetProperty<int>(); set => SetProperty(value); }
+		public int CupertinoBottomTab3Count { get => GetProperty<int>(); set => SetProperty(value); }
 
-        public List<string> Items { get => GetProperty<List<string>>(); set => SetProperty(value); }
-        public List<TabBarItem> ItemsTb { get => GetProperty<List<TabBarItem>>(); set => SetProperty(value); }
+		public List<string> Items { get => GetProperty<List<string>>(); set => SetProperty(value); }
+		public List<TestRecord> MenuItems { get => GetProperty<List<TestRecord>>(); set => SetProperty(value); }
 
-        public ICommand Tab1CountCommand => new Command(_ => Tab1Count++);
-        public ICommand Tab2CountCommand => new Command(_ => Tab2Count++);
-        public ICommand Tab3CountCommand => new Command(_ => Tab3Count++);
+		public ICommand Tab1CountCommand => new Command(_ => Tab1Count++);
+		public ICommand Tab2CountCommand => new Command(_ => Tab2Count++);
+		public ICommand Tab3CountCommand => new Command(_ => Tab3Count++);
 
-        public ICommand MaterialBottomTab1CountCommand => new Command(_ => MaterialBottomTab1Count++);
-        public ICommand MaterialBottomTab2CountCommand => new Command(_ => MaterialBottomTab2Count++);
-        public ICommand MaterialBottomTab3CountCommand => new Command(_ => MaterialBottomTab3Count++);
+		public ICommand MaterialBottomTab1CountCommand => new Command(_ => MaterialBottomTab1Count++);
+		public ICommand MaterialBottomTab2CountCommand => new Command(_ => MaterialBottomTab2Count++);
+		public ICommand MaterialBottomTab3CountCommand => new Command(_ => MaterialBottomTab3Count++);
 
-        public ICommand MaterialVerticalTab1CountCommand => new Command(_ => MaterialVerticalTab1Count++);
-        public ICommand MaterialVerticalTab2CountCommand => new Command(_ => MaterialVerticalTab2Count++);
-        public ICommand MaterialVerticalTab3CountCommand => new Command(_ => MaterialVerticalTab3Count++);
+		public ICommand MaterialVerticalTab1CountCommand => new Command(_ => MaterialVerticalTab1Count++);
+		public ICommand MaterialVerticalTab2CountCommand => new Command(_ => MaterialVerticalTab2Count++);
+		public ICommand MaterialVerticalTab3CountCommand => new Command(_ => MaterialVerticalTab3Count++);
 
-        public ICommand CupertinoBottomTab1CountCommand => new Command(_ => CupertinoBottomTab1Count++);
-        public ICommand CupertinoBottomTab2CountCommand => new Command(_ => CupertinoBottomTab2Count++);
-        public ICommand CupertinoBottomTab3CountCommand => new Command(_ => CupertinoBottomTab3Count++);
+		public ICommand CupertinoBottomTab1CountCommand => new Command(_ => CupertinoBottomTab1Count++);
+		public ICommand CupertinoBottomTab2CountCommand => new Command(_ => CupertinoBottomTab2Count++);
+		public ICommand CupertinoBottomTab3CountCommand => new Command(_ => CupertinoBottomTab3Count++);
 
-        public TabBarViewModel()
+		public TabBarViewModel()
 		{
 			Items = new List<string> { "Tab 1", "Tab 2", "Tab 3" };
-			ItemsTb = new List<TabBarItem> { new TabBarItem() { Content = "Tab 1" }, new TabBarItem() { Content = "Tab 2" }, new TabBarItem() { Content = "Tab 3" } };
+			MenuItems = [new TestRecord("True", true), new TestRecord("False", false), new TestRecord("True", true)];
 		}
 	}
+	public record TestRecord(string Name, bool IsSelectable);
 }

From 8418378bc942553ba387cffd757902b03046669a Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Thu, 10 Oct 2024 13:50:13 +0100
Subject: [PATCH 07/12] fix: Remove unexistent tbi theme resource

---
 src/library/Uno.Toolkit.Material/Styles/Controls/v2/TabBar.xaml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/library/Uno.Toolkit.Material/Styles/Controls/v2/TabBar.xaml b/src/library/Uno.Toolkit.Material/Styles/Controls/v2/TabBar.xaml
index 153b734b0..7d2c3ec33 100644
--- a/src/library/Uno.Toolkit.Material/Styles/Controls/v2/TabBar.xaml
+++ b/src/library/Uno.Toolkit.Material/Styles/Controls/v2/TabBar.xaml
@@ -805,7 +805,6 @@
                                 <VisualState x:Name="Enabled" />
                                 <VisualState x:Name="Disabled">
                                     <VisualState.Setters>
-                                        <Setter Target="LayoutRoot.Background" Value="{ThemeResource NavigationTabBarBackgroundDisabled}" />
                                         <Setter Target="ActiveIndicator.Background" Value="{ThemeResource NavigationTabBarItemActiveIndicatorBackgroundDisabled}" />
                                         <Setter Target="Icon.Foreground" Value="{ThemeResource NavigationTabBarItemIconForegroundDisabled}" />
                                         <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource NavigationTabBarForegroundDisabled}" />

From b570680c5f5941c186feacf1c6b8c99dfde0e746 Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Thu, 10 Oct 2024 15:18:14 +0100
Subject: [PATCH 08/12] test: Add templated tbi disabled is not selectable

---
 .../Tests/TabBarTests.cs                      | 38 +++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
index 1a4347f56..f26fff441 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
@@ -427,6 +427,41 @@ public async Task Verify_SelectedIndex_Not_Set_Unnecessarily()
 			//Assert.IsNull(SUT.GetBindingExpression(TabBar.SelectedIndexProperty));
 		}
 
+		[TestMethod]
+		public async Task Verify_ItemTemplated_Disabled_Not_Selectable()
+		{
+			var source = new[]
+			{
+				new TestRecord("True", true),
+				new TestRecord("False", false),
+				new TestRecord("True", true)
+			};
+			var SUT = new TabBar
+			{
+				Style = (Style)Application.Current.Resources["TopTabBarStyle"],
+				ItemsSource = source,
+				ItemTemplate = XamlHelper.LoadXaml<DataTemplate>(@"
+					<DataTemplate>
+						<utu:TabBarItem Content=""{Binding Name}"" IsSelectable=""{Binding IsSelectable}"" />
+					</DataTemplate>
+				")
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			Assert.IsNull(SUT.SelectedItem);
+
+			// Make sure the first item is selectable
+			SUT.SelectedIndex = 0;
+			await UnitTestsUIContentHelper.WaitForIdle();
+			Assert.AreSame(SUT.SelectedItem, source[0]);
+
+			SUT.SelectedIndex = 1;
+			await UnitTestsUIContentHelper.WaitForIdle();
+			// Assert the second item is not selected
+			Assert.AreNotSame(SUT.SelectedItem, source[1]);
+		}
+
 		private class SelectedIndexTestViewModel : INotifyPropertyChanged
 		{
 			private int _p;
@@ -442,5 +477,8 @@ public int P
 
 			public event PropertyChangedEventHandler? PropertyChanged;
 		}
+
+		public record TestRecord(string Name, bool IsSelectable);
+
 	}
 }

From 3628d17c595c2dcb9d363a539ff09c502f48c75e Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Thu, 10 Oct 2024 17:15:29 +0100
Subject: [PATCH 09/12] chore: Workaround test to pass on android

---
 .../Tests/TabBarTests.cs                        | 17 +++++++++++------
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs    |  8 ++++----
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
index f26fff441..b99c1d32b 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
@@ -436,15 +436,20 @@ public async Task Verify_ItemTemplated_Disabled_Not_Selectable()
 				new TestRecord("False", false),
 				new TestRecord("True", true)
 			};
-			var SUT = new TabBar
-			{
-				Style = (Style)Application.Current.Resources["TopTabBarStyle"],
-				ItemsSource = source,
-				ItemTemplate = XamlHelper.LoadXaml<DataTemplate>(@"
+
+			var dt = XamlHelper.LoadXaml<DataTemplate>(@"
 					<DataTemplate>
 						<utu:TabBarItem Content=""{Binding Name}"" IsSelectable=""{Binding IsSelectable}"" />
 					</DataTemplate>
-				")
+				");
+
+			var SUT = new TabBar
+			{
+				// If `ItemTemplate` is not set first then the order of
+				// `OnItemTemplateChanged` and `GetContainerForItemOverride` are not correct and test fail on android
+				ItemTemplate = dt,
+				Style = (Style)Application.Current.Resources["TopTabBarStyle"],
+				ItemsSource = source
 			};
 
 			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index b901fb697..ef7d62215 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -410,9 +410,9 @@ private void RaiseSelectionChangedEvent(object? prevItem, object? nextItem)
 
 		internal TabBarItem? GetInnerContainer(DependencyObject? container)
 		{
-			if (IsUsingOwnContainerAsTemplateRoot)
+			if (IsUsingOwnContainerAsTemplateRoot && container is ContentPresenter cp)
 			{
-				return (container as ContentPresenter)?.Content as TabBarItem;
+				return cp.Content as TabBarItem;
 			}
 
 			return container as TabBarItem;
@@ -421,9 +421,9 @@ private void RaiseSelectionChangedEvent(object? prevItem, object? nextItem)
 		internal DependencyObject? InnerContainerFromIndex(int index)
 		{
 			var container = ContainerFromIndex(index);
-			if (IsUsingOwnContainerAsTemplateRoot)
+			if (IsUsingOwnContainerAsTemplateRoot && container is ContentPresenter cp)
 			{
-				container = (container as ContentPresenter)?.Content as DependencyObject;
+				container = cp.Content as DependencyObject;
 			}
 
 			return container;

From 1c4ececde39a6a7f82de0a98e67e42297c0e91f5 Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Fri, 11 Oct 2024 15:41:49 +0100
Subject: [PATCH 10/12] chore: Properly have tbi container applied

---
 src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs | 6 ++----
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs      | 3 +--
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
index b99c1d32b..06d218027 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
@@ -445,11 +445,9 @@ public async Task Verify_ItemTemplated_Disabled_Not_Selectable()
 
 			var SUT = new TabBar
 			{
-				// If `ItemTemplate` is not set first then the order of
-				// `OnItemTemplateChanged` and `GetContainerForItemOverride` are not correct and test fail on android
-				ItemTemplate = dt,
 				Style = (Style)Application.Current.Resources["TopTabBarStyle"],
-				ItemsSource = source
+				ItemsSource = source,
+				ItemTemplate = dt,
 			};
 
 			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index ef7d62215..df31432ac 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -274,9 +274,8 @@ private void OnItemsSourceChanged()
 
 		protected override void OnItemTemplateChanged(DataTemplate oldItemTemplate, DataTemplate newItemTemplate)
 		{
-			base.OnItemTemplateChanged(oldItemTemplate, newItemTemplate);
-
 			IsUsingOwnContainerAsTemplateRoot = IsItemItsOwnContainerOverride(newItemTemplate?.LoadContent());
+			base.OnItemTemplateChanged(oldItemTemplate, newItemTemplate);
 		}
 
 		private void OnSelectedItemChanged(DependencyPropertyChangedEventArgs? args)

From 8b35f42129395a581f4c3d8fddabd5e502423dbf Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Mon, 14 Oct 2024 17:22:52 +0100
Subject: [PATCH 11/12] test: Add tbi vs cp container test

---
 .../Tests/TabBarTests.cs                      | 35 +++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
index 06d218027..217ecc9fe 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
@@ -427,6 +427,41 @@ public async Task Verify_SelectedIndex_Not_Set_Unnecessarily()
 			//Assert.IsNull(SUT.GetBindingExpression(TabBar.SelectedIndexProperty));
 		}
 
+		[TestMethod]
+		public async Task Verify_ItemTemplated_Has_No_Nested_TabBarItem()
+		{
+			var source = new[]
+			{
+				new TestRecord("True", true),
+				new TestRecord("False", false),
+				new TestRecord("True", true)
+			};
+
+			var dt = XamlHelper.LoadXaml<DataTemplate>(@"
+					<DataTemplate>
+						<utu:TabBarItem Content=""{Binding Name}"" IsSelectable=""{Binding IsSelectable}"" />
+					</DataTemplate>
+				");
+
+			var SUT = new TabBar
+			{
+				Style = (Style)Application.Current.Resources["TopTabBarStyle"],
+				ItemsSource = source,
+				ItemTemplate = dt,
+				SelectedIndex = 0
+			};
+
+			await UnitTestUIContentHelperEx.SetContentAndWait(SUT);
+
+			// Ensure the container is a `ContentPresenter` and not a `TabBarItem`
+			var container = SUT.ContainerFromItem(SUT.SelectedItem);
+			Assert.IsInstanceOfType(container, typeof(ContentPresenter));
+
+			// Ensure the inner container is a `TabBarItem`
+			var selectedItem = SUT.GetInnerContainer(container);
+			Assert.IsInstanceOfType(selectedItem, typeof(TabBarItem));
+		}
+
 		[TestMethod]
 		public async Task Verify_ItemTemplated_Disabled_Not_Selectable()
 		{

From af386dd7e1ff3de09951222096f94822fa671377 Mon Sep 17 00:00:00 2001
From: eriklimakc <erik.lima@knowcode.app>
Date: Tue, 15 Oct 2024 15:57:43 +0100
Subject: [PATCH 12/12] chore: Add comments for clarification on TabBar
 GetInnerContainer

---
 .../Tests/TabBarTests.cs                      | 29 ++++++++++---------
 src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs  |  7 +++--
 .../TabBarSelectionIndicatorPresenter.cs      |  4 +--
 3 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
index 217ecc9fe..92f23bf9c 100644
--- a/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
+++ b/src/Uno.Toolkit.RuntimeTests/Tests/TabBarTests.cs
@@ -319,7 +319,8 @@ public async Task Verify_Indicator_Display_On_Selection()
 				await UnitTestsUIContentHelper.WaitForIdle();
 
 				var container = SUT.ContainerFromItem(SUT.SelectedItem);
-				var selectedItem = SUT.GetInnerContainer(container);
+				var selectedItem = SUT.GetInnerContainer(container); // see comment on GetInnerContainer
+
 				Assert.IsNotNull(selectedItem);
 
 				var renderer = await SUT.TakeScreenshot();
@@ -428,7 +429,7 @@ public async Task Verify_SelectedIndex_Not_Set_Unnecessarily()
 		}
 
 		[TestMethod]
-		public async Task Verify_ItemTemplated_Has_No_Nested_TabBarItem()
+		public async Task Verify_ItemTemplate_Has_No_Nested_TabBarItem()
 		{
 			var source = new[]
 			{
@@ -437,11 +438,11 @@ public async Task Verify_ItemTemplated_Has_No_Nested_TabBarItem()
 				new TestRecord("True", true)
 			};
 
-			var dt = XamlHelper.LoadXaml<DataTemplate>(@"
-					<DataTemplate>
-						<utu:TabBarItem Content=""{Binding Name}"" IsSelectable=""{Binding IsSelectable}"" />
-					</DataTemplate>
-				");
+			var dt = XamlHelper.LoadXaml<DataTemplate>("""
+				<DataTemplate>
+					<utu:TabBarItem Content="{Binding Name}" IsSelectable="{Binding IsSelectable}" />
+				</DataTemplate>
+			""");
 
 			var SUT = new TabBar
 			{
@@ -458,12 +459,12 @@ public async Task Verify_ItemTemplated_Has_No_Nested_TabBarItem()
 			Assert.IsInstanceOfType(container, typeof(ContentPresenter));
 
 			// Ensure the inner container is a `TabBarItem`
-			var selectedItem = SUT.GetInnerContainer(container);
+			var selectedItem = SUT.GetInnerContainer(container); // see comment on GetInnerContainer
 			Assert.IsInstanceOfType(selectedItem, typeof(TabBarItem));
 		}
 
 		[TestMethod]
-		public async Task Verify_ItemTemplated_Disabled_Not_Selectable()
+		public async Task Verify_ItemTemplate_Disabled_Not_Selectable()
 		{
 			var source = new[]
 			{
@@ -472,11 +473,11 @@ public async Task Verify_ItemTemplated_Disabled_Not_Selectable()
 				new TestRecord("True", true)
 			};
 
-			var dt = XamlHelper.LoadXaml<DataTemplate>(@"
-					<DataTemplate>
-						<utu:TabBarItem Content=""{Binding Name}"" IsSelectable=""{Binding IsSelectable}"" />
-					</DataTemplate>
-				");
+			var dt = XamlHelper.LoadXaml<DataTemplate>("""
+				<DataTemplate>
+					<utu:TabBarItem Content="{Binding Name}" IsSelectable="{Binding IsSelectable}" />
+				</DataTemplate>
+			""");
 
 			var SUT = new TabBar
 			{
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
index df31432ac..5ed95ec11 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
@@ -148,7 +148,7 @@ e is IVectorChangedEventArgs iVCE
 				{
 					var item = Items[(int)iVCE.Index];
 
-					if (GetInnerContainer(item as DependencyObject) is { IsSelected: true } selected)
+					if (GetInnerContainer(item as DependencyObject) is { IsSelected: true } selected) // see comment on GetInnerContainer
 					{
 						SelectedItem = selected;
 					}
@@ -355,7 +355,7 @@ private void SynchronizeSelection(TabBarItem? item)
 				var containers = this.GetItemContainers<UIElement>();
 				foreach (var container in containers)
 				{
-					var tbi = GetInnerContainer(container);
+					var tbi = GetInnerContainer(container); // see comment on GetInnerContainer
 					if (tbi is not { }) continue;
 
 					if (!tbi.IsSelected)
@@ -407,6 +407,9 @@ private void RaiseSelectionChangedEvent(object? prevItem, object? nextItem)
 			SelectionChanged?.Invoke(this, eventArgs);
 		}
 
+		// When using an `ItemTemplate` with a `TabBarItem`, the container will be a `ContentPresenter` that wraps the `TabBarItem`.
+		// In that case, to access the `ContentPresenter` from a `TabBarItem`, you must first call `ContainerFromItem`.
+		// Afterward, pass the resulting `ContentPresenter` as a parameter to this method.
 		internal TabBarItem? GetInnerContainer(DependencyObject? container)
 		{
 			if (IsUsingOwnContainerAsTemplateRoot && container is ContentPresenter cp)
diff --git a/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs b/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs
index b8a300444..4d5cab44d 100644
--- a/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs
+++ b/src/Uno.Toolkit.UI/Controls/TabBar/TabBarSelectionIndicatorPresenter.cs
@@ -224,8 +224,8 @@ private void UpdateSelectionIndicatorMaxSize()
 			if (Owner is { } tabBar
 				&& GetSelectionIndicator() is { } indicator)
 			{
-				var tabBarItems =tabBar.GetItemContainers<UIElement>()
-					.Select(tabBar.GetInnerContainer)
+				var tabBarItems = tabBar.GetItemContainers<UIElement>()
+					.Select(tabBar.GetInnerContainer) // see comment on GetInnerContainer
 					.OfType<TabBarItem>();
 				var visibleItems = tabBarItems.Count(x => x.Visibility == Visibility.Visible);
 				if (visibleItems is 0)