Condividi tramite


Panoramica della shell di .NET MAUI

Browse sample. Esplorare l'esempio

.NET Multi-Platform App UI (.NET MAUI) Shell riduce la complessità legata allo sviluppo delle app fornendo le funzionalità fondamentali richieste dalla maggior parte delle app, tra cui:

  • Un'unica posizione per descrivere la gerarchia visiva di un'app.
  • Un'esperienza utente di navigazione comune.
  • Uno schema di spostamento basato su URI che consente la navigazione in qualsiasi pagina dell'app.
  • Un gestore di ricerca integrato.

Gerarchia visiva dell'app

In un'app shell MAUI .NET la gerarchia visiva dell'app viene descritta in una classe che sottoclassa la Shell classe . Questa classe può essere costituita da tre oggetti gerarchici principali:

  1. FlyoutItem o TabBar. Un elemento FlyoutItem rappresenta uno o più elementi del riquadro a comparsa e deve essere usato quando il modello di spostamento per l'app richiede un riquadro a comparsa. Un elemento TabBar rappresenta la barra delle schede inferiore e deve essere usato quando il modello di spostamento per l'app inizia con le schede inferiori e non richiede un riquadro a comparsa. Per altre informazioni sugli elementi del riquadro a comparsa, vedere riquadro a comparsa della shell MAUI .NET. Per altre informazioni sulle barre delle schede, vedere schede della shell MAUI .NET.
  2. Tab, che rappresenta contenuto raggruppato, in cui è possibile spostarsi tramite le schede inferiori. Per altre informazioni, vedere schede della shell MAUI .NET.
  3. ShellContent, che rappresenta gli ContentPage oggetti per ogni scheda. Per altre informazioni, vedere Pagine della shell MAUI .NET.

Questi oggetti non rappresentano un'interfaccia utente, ma l'organizzazione della gerarchia visiva dell'app. Shell prenderà questi oggetti e genererà l'interfaccia utente di spostamento per il contenuto.

Nota

Le pagine vengono create su richiesta nelle app shell, in risposta allo spostamento.

Per altre informazioni, vedere Creare un'app shell MAUI .NET.

L'esperienza di spostamento fornita da .NET MAUI Shell si basa su riquadri a comparsa e schede. Il livello di spostamento principale in un'app Shell è un riquadro a comparsa o una barra delle schede inferiore, a seconda dei requisiti di spostamento dell'app. L'esempio seguente mostra un'app in cui il livello di spostamento principale è un riquadro a comparsa:

Screenshot of a Shell flyout.

In questo esempio alcuni elementi del riquadro a comparsa vengono duplicati come elementi della barra delle schede. Tuttavia, sono disponibili anche elementi accessibili solo dal riquadro a comparsa. Selezionando un elemento del riquadro a comparsa, la scheda inferiore che rappresenta l'elemento viene selezionata e visualizzata:

Screenshot of Shell bottom tabs.

Nota

Quando il riquadro a comparsa non è aperto, la barra delle schede inferiore può essere considerata il livello di spostamento principale nell'app.

Ogni scheda sulla barra delle schede visualizza un oggetto ContentPage. Se tuttavia una scheda inferiore contiene più di una pagina, è possibile spostarsi tra le pagine tramite la barra delle schede superiore:

Screenshot of Shell top tabs.

All'interno di ogni scheda, è possibile passare a oggetti aggiuntivi ContentPage noti come pagine di dettaglio:

Screenshot of Shell page navigation.

Shell usa un'esperienza di navigazione basata su URI che usa le route per passare a qualsiasi pagina nell'app, senza dover seguire una gerarchia di navigazione impostata. La shell offre anche la possibilità di spostarsi all'indietro senza dover visitare tutte le pagine dello stack di spostamento. Per altre informazioni, vedere Spostamento della shell MAUI di .NET.

.NET MAUI Shell include funzionalità di ricerca integrate fornite dalla SearchHandler classe . La funzionalità di ricerca può essere aggiunta a una pagina aggiungendo un oggetto sottoclassato SearchHandler . Ciò comporta l'aggiunta di una casella di ricerca nella parte superiore della pagina. Quando i dati vengono immessi nella casella di ricerca, l'area dei suggerimenti di ricerca viene popolata con i dati:

Screenshot of Shell search.

Quindi, quando un risultato viene selezionato nell'area dei suggerimenti di ricerca, è possibile eseguire logica personalizzata, ad esempio passando a una pagina di dettaglio.

Per altre informazioni, vedere Ricerca della shell MAUI .NET.