The arrival of Xamarin.Forms 3.1 has brought with it a range of improvements and advancements. Including the ability to create a TabbedPage in the bottom part of the menu.

What does that mean?

Increasingly more mobile apps tend to maintain a unified design among platforms, so the change of users between different devices or operating systems is easier.

One of the differentiating characteristics in IOS and Android apps is the default position of the menu:

IOS

Its normally found in the bottom part of the screen with IOS and the detail area above. If there are more than 5 tabs, a more tab will appear which can be used to access the other tabs.

Android

In Android, the list of tabs appears at the top of the screen and the detail area below. However, thanks to Xamarin.Forms 3.1 the tab list can now be moved to the bottom of the screen using a platform specific.

What does this new release offer us?

Xamarin Forms, in its latest version, offers us important developments that allow us the ability to easily change the position of the menu. Thanks to new platform specifics you’re able to move the TabBar to the position you prefer. Lets have a look!

This what a screen with the menu usually looks like:

 

Using this new functionality we can easily change our menu to the bottom part of the screen, as shown in the image below:

 

Offering this funcionality has never been easy, but thanks to Xamarin.Forms 3.1 release with the TabbedPage and some new Platform Specifics developers can now change the location of their tabs. It’s as easy as that.

But how does it work in our code?

XAML:

<?xml version=”1.0″ encoding=”utf-8″?>

<TabbedPage xmlns=”http://xamarin.com/schemas/2014/forms”

xmlns:android=”clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core”

android:TabbedPage.ToolbarPlacement=”Bottom”

C#:

using Xamarin.Forms.PlatformConfiguration;

using Xamarin.Forms.PlatformConfiguration.AndroidSpecific;

 

On<Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);

 

 What next?

As always, Xamarin Forms continues to advance and continues to offer us new personalisation options for our apps, allowing us to offer them to our clients and adapt to market needs. You can get started with it as soon as you want but for now you can download a sample of the apps code from our GitHub repository following the link below.

Link: https://github.com/WeAreBrintia/BottomNavigationForms

 

Written by: Dario Alonso (@dariovillar)