Visão geral do Shell do .NET MAUI

Browse sample. Navegue pelo exemplo

O Shell do .NET MAUI (NET Multi-platform App UI) reduz a complexidade do desenvolvimento de aplicativos fornecendo os recursos fundamentais que a maioria dos aplicativos exige, incluindo:

  • Um só local para descrever a hierarquia visual de um aplicativo.
  • Uma experiência de navegação comum para o usuário.
  • Um esquema de navegação baseado em URI que permite a navegação para qualquer página no 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 subclassifica a Shell classe. Essa classe pode ser composta por 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. Uma TabBar representa a barra de guias inferior e deve ser usada quando o padrão de navegação para o aplicativo começa com guias inferiores e não exige um submenu. Para obter mais informações sobre itens de submenu, consulte Submenu do Shell do .NET MAUI. Para obter mais informações sobre barras de guias, consulte Guias do Shell do .NET MAUI.
  2. Tab, que representa o conteúdo agrupado, navegável pelas guias inferiores. Para obter mais informações, consulte Guias do Shell do .NET MAUI.
  3. ShellContent, que representa os ContentPage objetos de cada guia. Para obter mais informações, consulte Páginas do Shell do .NET MAUI.

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

Observação

As páginas são criadas sob demanda em aplicativos do 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 aplicativo do Shell é um submenu ou uma barra de guias inferior, dependendo dos requisitos de navegação do aplicativo. O exemplo a seguir mostra um aplicativo em que o nível superior de navegação é um submenu:

Screenshot of a Shell flyout.

Neste exemplo, alguns itens do submenu são duplicados como itens da barra de guias. No entanto, também há itens que só podem ser acessados a partir do submenu. Selecionar um item de submenu faz com que a guia inferior que representa o item seja selecionada e exibida:

Screenshot of Shell bottom tabs.

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 ContentPagearquivo . No entanto, se uma guia inferior contiver mais de uma página, será possível navegar pelas páginas por meio da barra de guias superior:

Screenshot of Shell top tabs.

Dentro de cada guia, objetos adicionais ContentPage que são conhecidos como páginas de detalhes, podem ser navegados para:

Screenshot of Shell page navigation.

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

O .NET MAUI Shell inclui a funcionalidade de pesquisa integrada fornecida pela SearchHandler classe. O recurso de pesquisa pode ser adicionado a uma página adicionando um objeto subclassificado 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:

Screenshot of Shell search.

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 Pesquisa do Shell do .NET MAUI.