eddy
eddy

Reputation: 103

Custom renderer for TabbedPage hides Tabbar

I'm currently trying to use a custom renderer for my TabbedPage.

I actually want to use the renderer to change the font of the tabs. Unfortunately the Tabbar is not visible when I'm using the renderer. Without the renderer the Tabbar is shown.

Did I forget something?

My Page:

<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
        xmlns:d="http://xamarin.com/schemas/2014/forms/design"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        xmlns:views="clr-namespace:***.Views"
        x:Class="***.Views.MainPage"
        xmlns:utils="clr-namespace:***.Utils"
        BarBackgroundColor="Black" BarTextColor="White"
        xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
        android:TabbedPage.ToolbarPlacement="Bottom"
        android:TabbedPage.BarTextColor="White"
        android:TabbedPage.BarItemColor="Gray"
        android:TabbedPage.BarSelectedItemColor="White"
        android:TabbedPage.IsSwipePagingEnabled="False"
        CurrentPageChanged="changeTab"
        x:Name="mainTabbedView">

<TabbedPage.Children>
    <NavigationPage Title="1" HeightRequest="20">
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource" >
                <On Platform="iOS" Value="pic1"/>
                <On Platform="Android" Value="pic1"/>
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <views:NewPage />
        </x:Arguments>
    </NavigationPage>

    <NavigationPage Title="2">
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="iOS" Value="pic2"/>
                <On Platform="Android" Value="pic2"/>
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <views:OtherPage />
        </x:Arguments>
    </NavigationPage>

    <NavigationPage Title="3">
        <NavigationPage.Icon>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="iOS" Value="pic3"/>
                <On Platform="Android" Value="pic3"/>
            </OnPlatform>
        </NavigationPage.Icon>
        <x:Arguments>
            <views:LastPage />
        </x:Arguments>
    </NavigationPage>
</TabbedPage.Children>

And the Renderer:

using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using ***.Droid;
using Android.Content;


[assembly: ExportRenderer(typeof(TabbedPage), typeof(CustomTabbedPageRenderer))]

namespace ***.Droid
{
    class CustomTabbedPageRenderer : TabbedRenderer
    {
        public CustomTabbedPageRenderer(Context context) : base(context)
        {
        }
    }
}

Upvotes: 1

Views: 233

Answers (1)

deczaloth
deczaloth

Reputation: 7475

I hope that after all you fixed your problem, if not:

The Solution

In your renderer, in the Android Project, you will have to inherit from TabbedPageRenderer instead of from TabbedRenderer, as follows

...
public class CustomTabbedPageRenderer : TabbedPageRenderer
{
  public CustomTabbedPageRenderer(Context context) : base(context)
  {
  }
}
...

Note

A similar question can be found here.

Upvotes: 1

Related Questions