Freigeben über

.NET MAUI Shell Übersicht über

  • Artikel

Browse sample.Durchsuchen Sie das Beispiel

Die .NET MAUI-Shell (.NET Multi-Platform App UI) reduziert die Komplexität der App-Entwicklung, indem die grundlegenden Features bereitgestellt werden, die für die meisten Apps erforderlich sind. Hierzu zählen Folgende:

  • Ein zentraler Ort zum Beschreiben der visuellen Hierarchie einer App.
  • Eine gemeinsame Benutzeroberfläche für die Navigation.
  • Ein URI-basiertes Navigationsschema, das die Navigation zu einer beliebigen Seite in der App zulässt.
  • Ein integrierter Suchhandler.

App visuell Hierarchie

In einer .NET MAUI Shell-App wird die visuelle Hierarchie der App in einer Klasse beschrieben, die der Klasse Shell untergeordnet ist. Diese Klasse kann aus drei hierarchischen Hauptobjekten bestehen:

  1. FlyoutItem oder TabBar Ein FlyoutItem steht für ein oder mehrere Elemente im Flyout und sollte verwendet werden, wenn das Navigationsmuster für die App ein Flyout erfordert. Eine TabBar steht für die Registerkartenleiste am unteren Rand und sollte verwendet werden, wenn das Navigationsmuster für die App mit Registerkarten am unteren Rand beginnt und kein Flyout erforderlich ist. Weitere Informationen zu Flyout-Elementen finden Sie unter .NET MAUI Shell-Flyout. Weitere Informationen zu Reiterleisten finden Sie unter .NET MAUI Shell-Reiter.
  2. Das Tab-Objekt stellt gruppierte Inhalte dar, durch die über untere Registerkarten navigiert werden kann. Weitere Informationen finden Sie unter .NET MAUI Shell-Reiter.
  3. ShellContent, welches ContentPage Objekte für jeden Reiter darstellt. Weitere Informationen finden Sie unter .NET MAUI Shell-Seiten.

Diese Objekte stellen keine Benutzeroberfläche dar, sondern die Organisation der visuellen Hierarchie der App. Die Shell wird diese Objekte übernehmen und die Benutzeroberfläche für die Navigation der Inhalte erstellen.

Hinweis

In Shell-Apps werden bei Bedarf Seiten als Reaktion auf die Navigation erstellt.

Weitere Informationen finden Sie unter .NET MAUI Shell-Apps erstellen.

Die von .NET MAUI Shell bereitgestellte Navigationsfunktion basiert auf Flyouts und Reitern. Die oberste Ebene der Navigation in einer Shell-App ist entweder ein Flyout oder eine unten stehende Reiterleiste, je nach Navigationsvoraussetzungen der App. Das folgende Beispiel zeigt eine App, in der die obere Ebene der Navigation ein Flyout ist:

Screenshot of a Shell flyout.

In diesem Beispiel werden einige Flyoutelemente als Elemente in die Registerkartenleiste dupliziert. Es gibt jedoch auch Elemente, auf die nur über das Flyout zugegriffen werden kann. Die Auswahl eines Flyoutelements führt zu der unteren Registerkarte, die das ausgewählte Element darstellt und anzeigt:

Screenshot of Shell bottom tabs.

Hinweis

Wenn der Flyout nicht geöffnet ist, kann die untere Reiterleiste als obere Ebene der Navigation in der App betrachtet werden.

Auf jeder Registerkarte der Registerkartenleiste wird ein ContentPage-Objekt angezeigt. Wenn eine untere Registerkarte mehr als eine Seite enthält, sind die Seiten jedoch über die obere Registerkartenleiste navigierbar:

Screenshot of Shell top tabs.

Auf jeder Registerkarte kann zu zusätzlichen ContentPage-Objekten navigiert werden, die als Detailseiten bezeichnet werden:

Screenshot of Shell page navigation.

Die Shell verwendet eine URI-basierte Navigationserfahrung, die Routen nutzt, um zu einer beliebigen Seite in der App zu navigieren, ohne einer festen Navigationshierarchie folgen zu müssen. Darüber hinaus bietet es auch die Möglichkeit, rückwärts zu navigieren, ohne alle Seiten des Navigationsstapels aufrufen zu müssen. Weitere Informationen finden Sie unter .NET MAUI Shell Navigation.

.NET MAUI Shell enthält eine integrierte Suchfunktion, die von SearchHandler Klasse bereitgestellt wird. Sie können einer Seite eine Suchfunktion hinzufügen, indem Sie ihr ein SearchHandler-Objekt mit Unterklassen hinzufügen. Dadurch wird oben auf der Seite ein Suchfeld hinzugefügt. Wenn Daten in das Suchfeld eingegeben werden, wird der Suchvorschlagsbereich mit Daten gefüllt:

Screenshot of Shell search.

Wenn dann ein Ergebnis aus dem Suchvorschlagsbereich ausgewählt wird, kann benutzerdefinierte Logik ausgeführt werden, z. B. die Navigation zu einer Detailseite.

Weitere Informationen finden Sie unter NET MAUI Shell Suche.