Customization Of Navigation Bar In Xamarin.Forms

'NavigationPage.TitleView' tag enables us to set the title of the page in multiple lines. Also, with the help of it, we can add a label to the navigation bar to give the name of the title.

If we want to customize a navigation bar in a page, such as we want to add 'Entry' or 'Label' or 'Image' to it or we want to add toolbar items in the left of the navigation bar, it's very difficult. To overcome this type of problem, the latest version of Xamarin Forms, i.e., Xamarin.Forms v3.2, has introduced a new tag called 'NavigationPage.TitleView'. By using this tag, we can customize the navigation bar and add any control to the navigation bar. Here is the sample code for adding an entry to the navigation bar.

 

SampleCode

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="NavigationPageTitleView.TitleViewPage">
    <NavigationPage.TitleView>
        <Entry x:Name="SampleEntry" HorizontalOptions="FillAndExpand" VerticalOptions="StartAndExpand">
    </NavigationPage.TitleView>
</ContentPage>

By using the above code, we are able to add any Xamarin.Forms control to our navigation bar. Here, if you write the code in a portable class, it will work on all platforms, like Android, iOS, and UWP. By using 'NavigationPage.TitleView' tag, we can set the title of the page in multiple lines.