Padrão de design de duas páginas

Aproveitando a metáfora skeuomorphic de um livro, o padrão de duas páginas tende naturalmente a fornecer uma experiência de paging semelhante a um livro. Você pode usar o marco de delimitação natural para mostrar vários itens de uma coleção, como páginas ou imagens, o que, de outra forma, talvez exigiria que o usuário exibisse um de cada vez.

Dependendo do aplicativo, você poderia optar por paginar a cada duas páginas ou avançar uma página por vez.

Duas páginas

Práticas recomendadas

Aqui estão alguns cenários que ajudarão a orientá-lo ao aplicar esse padrão de design:

Mostrar duas páginas lado a lado, como um livro

O que fazer O que não fazer
Use duas telas para ter duas exibições de página completamente separadas. Não exibir a página em duas telas passando sob a dobradiça.

Não desenhar itens na dobradiça

O que fazer O que não fazer
Use o formato de duas páginas para exibir itens ativos para seu conteúdo de integração/instrução. Não exibir itens ativos em duas telas passando sob a dobradiça.

Expanda cada página individual para assumir as duas telas no modo paisagem dupla, mas verifique se o usuário pode ver todo o conteúdo

O que fazer O que não fazer
Exibe o conteúdo como uma única página quando o dispositivo é girado em um cenário duplo. Não bloqueie a orientação do dispositivo. Permitir que o usuário gire o dispositivo para exibir o conteúdo com uma tela maior.

Use um espaço reservado ou outro elemento na segunda tela se não houver conteúdo

O que fazer O que não fazer
Use uma ilustração ou indicador visual na segunda tela se o conteúdo precisar apenas de uma tela. Não abranger uma única página em duas telas para preencher o espaço.

Tipos de aplicativos que podem se beneficiar desse padrão

  • Aplicativo orientado a documentos
  • Aplicativos com conteúdo paginado
  • Aplicativos feitos para leitura
  • Aplicativos com uma tela itemizada; por exemplo, observações, placas de arte, etc.

Exemplos de código

Esses projetos mostram uma implementação simples de duas páginas que você pode usar em seus aplicativos: