Use BottomNavigationView for Android's TabbedPage for a more unified Tab experience on iOS/Android

henningmshenningms NOMember
edited October 21 in Xamarin.Forms Evolution

Summary

The BottomNavigationView (can't post links yet. Google it) that's available in the Android Support Library is the new and preferred way of using tabs in an Android project. Using BNV will create a better out-of-the-box experience for users wanting to use Xamarin Forms for their app development.

Switching to BNV for Android will allow us to introduce Badges as well which will help in simplify XF developers targeting Android and iOS. UWP as far as I know does not have a concept of badges out-of-the-box for Pivot.

API Changes

We already can specify the Title and the Icon from iOS, but with BNV and the UITabBar we could specify the background color, selected tint color and unselected tint color:

tabbedPage.BackgroundColor = Colors.Gray; // Background for the tab bar
tabbedPage.SelectedTintColor = Colors.Red; // Selected color
tabbedPage.TintColor = Colors.Black; // Default (not-selected) color

We can also add badges for each page in the tabbedpage:

<TabbedPage>
    <ExamplePage Title="Agenda" Icon="ic_agenda" BadgeCount="2" />
</TabbedPage>

BadgeCount will be bindable as well.

Taking it a step further we could introduce platform-specifics for setting Tab-color on specific pages (BNV allows you to do that), as well as badge colors (which works on iOS10+ as well).

Intended use case

Be able to create more modern application for Android that uses the latest best practice from Google itself and also introduce Badges that has been missing. All without using custom renderers or third-party packages.

There might be times where the current implementation of TabbedPage on Android will work best, but I would rather have BottomNavigationView to be the default implementation.

0
0 votes

Open · Last Updated

Sign In or Register to comment.