How to change selected tab title color in Xamarin

Issue

I am working on xamarin forms TabbedPage. I have to make only selected Tab Title to different color.

This is my code

<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:local="clr-namespace:go.Models" 
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            x:Class="Bite2.ViewsForN.SubsView">
    <!--Tab 1 starts here-->
    <ContentPage Title="Buy Subscriptions">
        <StackLayout>
        </StackLayout>
    </ContentPage>
    
    <!--Tab 2 starts here-->
    <ContentPage Title="My Subscriptions">
        <StackLayout>
        </StackLayout>
        
    </ContentPage>
</TabbedPage>

In customrender, I am setting tab text color gray. I need Black for selected tab and gray for unselected tab.

  protected override void SetTabIconImageSource(Google.Android.Material.Tabs.TabLayout.Tab tab, Drawable icon)
    {
        base.SetTabIconImageSource(tab, icon);
        tab.SetCustomView(Resource.Layout.subscriptionsTabLayout);
        var title = tab.CustomView.FindViewById<TextView>(Resource.Id.tv);
        title.Text = tab.Text;
        ColorStateList csl = ColorStateList.ValueOf(Android.Graphics.Color.Gray);
        title.SetTextColor(csl);
    }

How can I do this?

Solution

I need Black for selected tab and gray for unselected tab.

You don't need to use CustomRender to achieve this. You can just use properties UnselectedTabColor and SelectedTabColor of TabbedPage .

Please refer to the following code:

<?xml version="1.0" encoding="UTF-8"?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
            xmlns:local="clr-namespace:TabbedPageWithNavigationPage;assembly=TabbedPageWithNavigationPage" 
            x:Class="TabbedPageWithNavigationPage.MainPage"
            UnselectedTabColor="Gray"
            SelectedTabColor="Black"
            >
    
</TabbedPage>

Answered By - Jessie Zhang -MSFT