Resumo do Capítulo 25. Variedades de página

  • Artigo

Baixar exemplo Baixar o exemplo

Observação

Este livro foi publicado na primavera de 2016, e não foi atualizado desde então. Há muito no livro que permanece valioso, mas parte do material está desatualizado, e alguns tópicos não estão mais totalmente corretos ou concluídos.

Até agora, você viu duas classes derivadas de Page: ContentPage e NavigationPage. Este capítulo apresenta outros dois:

  • MasterDetailPagegerencia duas páginas, um master e um detalhe
  • TabbedPage gerencia várias páginas filho acessadas por meio de guias

Esses tipos de página fornecem opções de navegação mais sofisticadas do que as NavagationPage discutidas no Capítulo 24. Navegação de página.

Mestre e Detalhes

O MasterDetailPage define duas propriedades do tipo Page: Master e Detail. Geralmente, você define cada uma dessas propriedades como um ContentPage. O MasterDetailPage exibe e alterna entre essas duas páginas.

Há duas maneiras fundamentais de alternar entre essas duas páginas:

  • dividir onde os master e os detalhes estão lado a lado
  • popover em que a página de detalhes abrange ou cobre parcialmente a página master

Há várias variações da abordagem popover (slide, sobreposição e troca), mas elas geralmente dependem da plataforma. Você pode definir a MasterDetailBehavior propriedade de MasterDetailPage como um membro da MasterBehavior enumeração:

No entanto, essa propriedade não tem efeito nos telefones. Os telefones sempre têm um comportamento de popover. Somente tablets e janelas da área de trabalho podem ter um comportamento de divisão.

Explorando os comportamentos

O exemplo MasterDetailBehaviors permite que você experimente o comportamento padrão em dispositivos diferentes. O programa contém dois derivados separados ContentPage para o master e detalhes (com uma Title propriedade definida em ambos) e outra classe que deriva de MasterDetailPage que os combina. A página de detalhes é colocada em um NavigationPage porque o programa UWP não funcionaria sem ele.

As plataformas Windows 8.1 e Windows Phone 8.1 exigem que um bitmap seja definido como a Icon propriedade da página master.

De volta à escola

O exemplo SchoolAndDetail adota uma abordagem um pouco diferente para construir o programa para exibir os alunos da biblioteca SchoolOfFineArt .

As Master propriedades e Detail são definidas com árvores visuais no arquivo SchoolAndDetailPage.xaml , que deriva de MasterDetailPage. Essa disposição permite que as associações de dados sejam definidas entre as páginas de master e detalhes.

Esse arquivo XAML também define a IsPresented propriedade de MasterDetailPage como True. Isso faz com que a página master seja exibida na inicialização; por padrão, a página de detalhes é exibida. O arquivo SchoolAndDetailPage.xaml.cs define IsPresentedfalse como quando um item é selecionado ListView na página master. Em seguida, a página de detalhes é exibida:

captura de tela tripla masterDetailPage da

Sua própria interface do usuário

Embora forneça Xamarin.Forms uma interface do usuário para alternar entre as exibições de master e detalhes, você pode fornecer sua própria. Para fazer isso:

  • Definir a IsGestureEnabled propriedade como false para desabilitar o deswiping
  • Substitua o ShouldShowToolbarButton método e retorne false para ocultar os botões da barra de ferramentas em Windows 8.1 e Windows Phone 8.1.

Em seguida, você deve fornecer um meio para alternar entre o master e as páginas de detalhes, como demonstrado pelo exemplo ColorsDetail.

O exemplo MasterDetailTaps demonstra outra abordagem usando uma TapGestureRecognizer nas páginas de master e detalhes.

TabbedPage

O TabbedPage é uma coleção de páginas que você pode alternar entre as guias de uso. Ele deriva de MultiPage<Page> e não define nenhuma propriedade pública ou métodos próprios. MultiPage<T>, no entanto, define uma propriedade:

Você preenche essa Children coleção com objetos de página.

Outra abordagem permite que você defina os TabbedPage filhos muito parecidos com um ListView usando essas duas propriedades que geram as páginas com guias automaticamente:

No entanto, essa abordagem não funciona bem no iOS quando a coleção contém mais de alguns itens.

MultiPage<T> define mais duas propriedades que permitem manter o controle de qual página está visualizada no momento:

  • CurrentPage do tipo T, referindo-se à página
  • SelectedItem do tipo Object, referindo-se ao objeto na ItemsSource coleção

MultiPage<T> também define dois eventos:

Páginas de guias discretas

O exemplo DiscreteTabbedColors consiste em três páginas com guias que exibem cores de três maneiras diferentes. Cada guia é derivada ContentPage e, em seguida, a TabbedPage derivada DiscreteTabbedColorsPage.xaml combina as três páginas.

Para cada página que aparece em um TabbedPage, a Title propriedade é necessária para especificar o texto na guia e a Apple Store exige que um ícone também seja usado, de modo que a Icon propriedade seja definida para iOS:

Captura de tela tripla de de cores com guias discretos

O exemplo StudentNotes tem uma home page que lista todos os alunos. Quando um aluno é tocado, isso navega para um TabbedPage derivado, StudentNotesDataPage, que incorpora três ContentPage objetos em sua árvore visual, um dos quais permite inserir algumas anotações para esse aluno.

Usando um ItemTemplate

O exemplo MultiTabbedColor usa a NamedColor classe na Xamarin.Formsbiblioteca Book.Toolkit . O arquivo MultiTabbedColorsPage.xaml define a DataTemplate propriedade de TabbedPage como uma árvore visual começando com ContentPage que contém associações a propriedades de NamedColor (incluindo uma associação à Title propriedade).

No entanto, isso é problemático no iOS. Apenas alguns dos itens podem ser exibidos e não há uma boa maneira de fornecer ícones a eles.