Olá, neste post irei demonstrar como utilizar o NavigationPage.TitleView em suas aplicações Xamarin.Forms de uma maneira fácil e rápida.
TitleView
Se você já é desenvolvedor Xamarin.Forms a algum tempo, pode ser que já tenha se deparado com a necessidade de customizar o título de navegação, seja para colocar uma imagem, botão ou até mesmo uma SearchBar, como demonstrada na imagem a seguir.
Pensando nesse cenário, a partir da versão 3.2 do Xamarin.Forms, temos o NavigationPage.TitleView, que com ele podemos personalizar o título de navegação.
App
O primeiro passo é na classe App.xaml.cs verificar se está sendo inicializado uma NavigationPage, como demonstrado a seguir.
Xaml
Para utilizar é bem simples, veja no exemplo a seguir que dentro de NavigationPage.TitleView eu coloquei um StackLayout, um Image e um Label, mas poderia ser qualquer controle que você está acostumado a utilizar no Xamarin.Forms.
| <?xml version="1.0" encoding="utf-8"?> | |
| <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" | |
| xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" | |
| xmlns:local="clr-namespace:DemoTitleView" | |
| x:Class="DemoTitleView.MainPage"> | |
| <NavigationPage.TitleView> | |
| <StackLayout Orientation="Horizontal"> | |
| <Image Source="https://goo.gl/xK8MUt" | |
| WidthRequest="40" | |
| HeightRequest="40"/> | |
| <Label Text="Juliano Custodio" VerticalTextAlignment="Center"/> | |
| </StackLayout> | |
| </NavigationPage.TitleView> | |
| </ContentPage> |
Resultado
Android
iOS
Esse e todos os exemplos deste blog encontram-se disponíveis no GitHub.
