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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?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.
Juliano Custódio 