Skip to content

Commit

Permalink
chore: Fix tbi style when using ItemTemplate
Browse files Browse the repository at this point in the history
  • Loading branch information
@eriklimakc
eriklimakc committed Oct 9, 2024
1 parent f425504 commit 78ed3eb
Show file tree
Hide file tree
Showing 2 changed files with 101 additions and 28 deletions.
125 changes: 100 additions & 25 deletions ...les/Uno.Toolkit.Samples/Uno.Toolkit.Samples.Shared/Content/Controls/TabBarSamplePage.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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}" />

Expand Down Expand Up @@ -106,7 +106,7 @@
Text="{Binding Data.Tab3Count}" />
</TextBlock>

<!-- Colored TabBar Style -->
<!-- Colored TabBar Style -->
<TextBlock Text="Top TabBar Colored Style"
Style="{StaticResource MaterialHeadline6}" />

Expand Down Expand Up @@ -182,7 +182,7 @@
</TextBlock>


<!-- Bottom TabBar Style -->
<!-- Bottom TabBar Style -->
<TextBlock Text="Bottom TabBar Style"
Style="{StaticResource MaterialHeadline6}" />

Expand Down Expand Up @@ -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"
Expand Down Expand Up @@ -349,6 +338,7 @@
</utu:TabBar.Items>
</utu:TabBar>
</ContentControl>

<TextBlock HorizontalAlignment="Center"
Style="{StaticResource LabelSmall}">
<Run Text="Tab 1 clicked count:" />
Expand All @@ -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}" />

Expand Down Expand Up @@ -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}" />

Expand Down Expand Up @@ -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}" />

Expand Down Expand Up @@ -689,6 +736,7 @@
</utu:TabBar.Items>
</utu:TabBar>
</ContentControl>

<TextBlock HorizontalAlignment="Center"
Style="{StaticResource LabelSmall}">
<Run Text="Tab 1 clicked count:" />
Expand Down Expand Up @@ -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>
Expand All @@ -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}" />

Expand Down
4 changes: 1 addition & 3 deletions src/Uno.Toolkit.UI/Controls/TabBar/TabBar.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
}
Expand Down

0 comments on commit 78ed3eb

Please sign in to comment.