Visão geral do Shell do .NET MAUI

Visualizar amostra. Visualizar a amostra

O Shell da interface do usuário de aplicativo multiplataforma do .NET (.NET MAUI) reduz a complexidade do desenvolvimento de aplicativos, fornecendo os recursos fundamentais necessários para a maioria dos aplicativos, incluindo:

  • Um único lugar para descrever a hierarquia visual de um aplicativo.
  • Uma experiência comum do usuário de navegação.
  • Um esquema de navegação baseado em URI que permite a navegação em qualquer página do aplicativo.
  • Um manipulador de pesquisa integrado.

Hierarquia visual do aplicativo

Em um aplicativo .NET MAUI Shell, a hierarquia visual do aplicativo é descrita em uma classe que subclasse a Shell classe. Essa classe pode consistir em três objetos hierárquicos principais:

  1. FlyoutItem ou TabBar. Um FlyoutItem representa um ou mais itens no submenu e deve ser usado quando o padrão de navegação do aplicativo requer um submenu. Um TabBar representa a barra de abas inferior e deve ser usado quando o padrão de navegação do aplicativo começa com abas inferiores e não requer um menu deslizante. Para obter mais informações sobre itens de menu suspenso, consulte o menu suspenso do .NET MAUI Shell. Para obter mais informações sobre barras de guias, consulte as guias shell do .NET MAUI.
  2. Tab, que representa o conteúdo agrupado, acessado por abas inferiores. Para obter mais informações, consulte as guias shell do .NET MAUI.
  3. ShellContent, que representa os objetos ContentPage para cada guia. Para obter mais informações, consulte as páginas do .NET MAUI Shell.

Esses objetos não representam nenhuma interface do usuário, mas sim a organização da hierarquia visual do aplicativo. O Shell pegará esses objetos e produzirá a interface do usuário de navegação para o conteúdo.

Observação

As páginas são criadas sob demanda em aplicativos Shell, em resposta à navegação.

Para obter mais informações, consulte Criar um aplicativo .NET MAUI Shell.

A experiência de navegação fornecida pelo .NET MAUI Shell é baseada em submenus e guias. O nível superior de navegação em um app Shell é um menu deslizante ou uma barra de guias inferior, dependendo dos requisitos de navegação do app. O exemplo a seguir mostra um aplicativo em que o nível superior de navegação é um menu deslizante:

Captura de tela de um submenu shell.

Neste exemplo, alguns itens de submenu são duplicados como itens de barra de tabulação. No entanto, também há itens que só podem ser acessados do submenu. Selecionar um item de submenu resulta na guia inferior que representa o item que está sendo selecionado e exibido:

Captura de tela das guias inferiores do Shell.

Observação

Quando o submenu não está aberto, a barra de guias inferior pode ser considerada o nível superior de navegação no aplicativo.

Cada guia na barra de guias exibe um ContentPage. No entanto, se uma guia inferior contiver mais de uma página, as páginas serão navegáveis pela barra de guias superior:

Captura de tela das guias superiores do Shell.

Em cada guia, é possível navegar para objetos adicionais ContentPage conhecidos como páginas de detalhes.

Captura de tela da navegação de página do Shell.

O Shell usa uma experiência de navegação baseada em URI que usa rotas para navegar até qualquer página do aplicativo, sem precisar seguir uma hierarquia de navegação definida. Além disso, também oferece a capacidade de navegar para trás sem a necessidade de visitar todas as páginas na pilha de navegação. Para obter mais informações, consulte a navegação do Shell do .NET MAUI.

O Shell do .NET MAUI inclui a funcionalidade de pesquisa integrada fornecida pela SearchHandler classe. A funcionalidade de pesquisa pode ser adicionada a uma página adicionando um objeto subclasse SearchHandler a ela. Isso resulta em uma caixa de pesquisa sendo adicionada na parte superior da página. Quando os dados são inseridos na caixa de pesquisa, a área de sugestões de pesquisa é preenchida com dados:

Captura de tela da pesquisa do Shell.

Em seguida, quando um resultado é selecionado na área de sugestões de pesquisa, a lógica personalizada pode ser executada, como navegar até uma página de detalhes.

Para obter mais informações, consulte o recurso de pesquisa da Shell do .NET MAUI.