feat(): selected tab text color

added ability to specify selected tab text color for BottomTabItem. Closes #71
roubachof · Feb 11, 2023 · 59cdbf0 · 59cdbf0
1 parent c535e50
commit 59cdbf0
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 1 deletion.
diff --git a/MauiSample/Presentation/Views/TabA.xaml b/MauiSample/Presentation/Views/TabA.xaml
@@ -11,6 +11,7 @@
 
             <Style x:Key="MaterialTabStyle" TargetType="tabs:MaterialUnderlinedTabItem">
                 <Setter Property="SelectedTabColor" Value="{StaticResource Primary}" />
+                <Setter Property="SelectedTabTextColor" Value="{StaticResource Secondary}" />
                 <Setter Property="IconSize" Value="24" />
                 <Setter Property="FontFamily" Value="OpenSansRegular" />
                 <Setter Property="LabelSize" Value="14" />

diff --git a/README.md b/README.md
@@ -474,6 +474,10 @@ If you like your bottom bar items without text:
   <img src="Docs/tab_bottom_notext.png" width="250" />
 </p>
 
+### SelectedTabColor and SelectedTabTextColor
+
+You can set a color for the selected tab via `SelectedTabColor`. 
+If you want to have a *different* color for the text, you can specify `SelectedTabTextColor`.
 
 ### Styling
 

diff --git a/Tabs/Tabs/BottomTabItem.xaml.cs b/Tabs/Tabs/BottomTabItem.xaml.cs
@@ -33,6 +33,12 @@ public partial class BottomTabItem : TabTextItem
             typeof(BottomTabItem),
             defaultValue: true);
 
+        public static readonly BindableProperty SelectedTabTextColorProperty = BindableProperty.Create(
+            propertyName: nameof(SelectedTabTextColor),
+            returnType: typeof(Color),
+            declaringType: typeof(TabTextItem),
+            defaultValue: null);
+
         private readonly bool _isInitialized = false;
 
         public BottomTabItem()
@@ -71,6 +77,12 @@ public bool IsTextVisible
             set => SetValue(IsTextVisibleProperty, value);
         }
 
+        public Color SelectedTabTextColor
+        {
+            get => (Color)GetValue(SelectedTabTextColorProperty);
+            set => SetValue(SelectedTabTextColorProperty, value);
+        }
+
         protected override void OnPropertyChanged([CallerMemberName] string propertyName = null)
         {
             base.OnPropertyChanged(propertyName);
@@ -143,7 +155,9 @@ private void UpdateIconVisibility()
 
         private void UpdateColors()
         {
-            IconText.TextColor = IsSelectable ? IsSelected ? SelectedTabColor : UnselectedLabelColor : DisabledLabelColor;
+            IconText.TextColor = IsSelectable
+                ? IsSelected ? SelectedTabTextColor ?? SelectedTabColor : UnselectedLabelColor
+                : DisabledLabelColor;
             ImageEffect.SetTintColor(Icon, IsSelected ? SelectedTabColor : UnselectedIconColor);
         }
     }