Richtlinien für App-Einstellungen

App-Einstellungen sind die vom Benutzer anpassbaren Teile Ihrer Windows-App, auf die über eine dedizierte Einstellungsseite zugegriffen wird. Beispielsweise kann ein Benutzer in einer Newsreader-App angeben, welche neuen Quellen oder wie viele Spalten auf dem Bildschirm angezeigt werden sollen, und eine Wetter-App könnte dem Benutzer ermöglichen, zwischen Celsius und Fahrenheit zu wählen. Dieser Artikel enthält Empfehlungen und bewährte Methoden zum Erstellen und Anzeigen von App-Einstellungen in WinUI-Apps.

Wann sollte eine Einstellungenseite angegeben werden?

Hier sind Beispiele für App-Optionen, die zu einer App-Einstellungsseite gehören:

• Konfigurationsoptionen, die sich auf das Verhalten der App auswirken und keine häufige Neuanordnung erfordern, z. B. die Auswahl zwischen Celsius oder Fahrenheit als Standardeinheiten für Temperatur in einer Wetter-App, Ändern von Kontoeinstellungen für eine Mail-App, Einstellungen für Benachrichtigungen oder Barrierefreiheitsoptionen.
• Optionen, die von den Einstellungen des Benutzers abhängig sind, z. B. Musik, Soundeffekte oder Farbdesigns.
• App-Informationen, auf die nicht sehr häufig zugegriffen wird, z. B. Datenschutzrichtlinie, Hilfe, App-Version oder Copyrightinformationen.

Befehle, die Teil des typischen App-Workflows sind (z. B. das Ändern der Pinselgröße in einer Grafik-App), sollten sich nicht auf einer Einstellungsseite befinden. Weitere Informationen zur Platzierung von Befehlen finden Sie unter Befehlsdesigngrundlagen.

Allgemeine Empfehlungen

• Halten Sie Einstellungsseiten einfach, und verwenden Sie binäre Steuerelemente (ein/aus). Ein Umschalter ist in der Regel das beste Steuerelement für eine binäre Einstellung.
• Für Einstellungen, mit denen Benutzer ein Element aus einer Gruppe von bis zu 5 sich gegenseitig ausschließenden, verwandten Optionen auswählen können, verwenden Sie Optionsfelder.
• Erstellen Sie einen Einstiegspunkt für alle App-Einstellungen auf der Einstellungsseite Ihrer App.
• Halten Sie Ihre Einstellungen einfach. Definieren Sie intelligente Standardwerte, und halten Sie die Anzahl der Einstellungen auf ein Minimum.
• Wenn ein Benutzer eine Einstellung ändert, sollte die App sofort die Änderung widerspiegeln.
• Fügen Sie keine Befehle hinzu, die Teil des allgemeinen App-Workflows sind.

Eingangspunkt

Die Art und Weise, wie Benutzer zu Ihrer App-Einstellungsseite gelangen, sollte auf dem Layout Ihrer App basieren.

Navigationsbereich

Bei einem NavigationView-Layout sollten App-Einstellungen das letzte Element in der Liste der Navigationsoptionen sein und unten angeheftet werden. NavigationView stellt ein integriertes Einstellungselement für diesen Zweck bereit. Legen Sie die IsSettingsVisible-Eigenschaft so fest, dass true ein Einstellungseintrag am unteren Rand des Navigationsbereichs automatisch angezeigt wird.

Befehlsleiste

Wenn Sie eine Befehlsleiste oder Symbolleiste verwenden, platzieren Sie den Einstiegspunkt für einstellungen als eines der letzten Elemente im Überlaufmenü "Mehr". Wenn eine größere Auffindbarkeit für den Einstellungseinstiegspunkt für Ihre App wichtig ist, platzieren Sie den Einstiegspunkt direkt auf der Befehlsleiste und nicht innerhalb des Überlaufs.

Layout

Die Seite mit den App-Einstellungen sollte den Vollbildmodus öffnen und das gesamte Fenster ausfüllen. Verwenden Sie ein bildlauffähiges Layout mit einer eingeschränkten maximalen Breite (ca. 1000–1100 px), sodass Inhalte auf breiten Displays lesbar bleiben. Gruppieren Sie verwandte Einstellungen unter Abschnittsüberschriften mithilfe der Textformatvorlage "BodyStrong ".

Verwenden Sie die Steuerelemente SettingsCard und SettingsExpander aus dem Windows Community Toolkit, um Ihre Einstellungsseite zu erstellen. Diese Steuerelemente bieten ein einheitliches, barrierefreies Layout mit einer Kopfzeile, Beschreibung, einem Symbol und einem Aktionssteuerelement, das auf der rechten Seite der Karte ausgerichtet ist.

Vollständige Implementierungsbeispiele finden Sie auf der Einstellungsseite WinUI Gallery und im Beispiel Windows Community Toolkit SettingsControls.

Einstellungenkarte

Verwenden Sie eine SettingsCard für einzelne Einstellungen. Jede Karte verfügt über eine Kopfzeile, eine optionale Beschreibung, ein optionales HeaderIcon und ein Aktionssteuerelement (z. B. ein ToggleSwitch, ComboBoxoder Button) als Inhalt der Karte platziert. Wenn Sie die IsClickEnabled Eigenschaft so true festlegen, dass die gesamte Karte klickbar ist, ist dies nützlich für Einträge im Navigationsstil.

SettingsExpander

Verwenden Sie " SettingsExpander ", wenn eine Einstellung Unteroptionen aufweist, die bei Bedarf angezeigt werden sollen. Der Erweiterungsbereich zeigt ein primäres Aktionssteuerungselement in der Kopfzeilenzeile und zusätzliche SettingsCard Elemente in der Items Sammlung an. Dadurch bleibt die Seite kompakt, während immer noch erweiterte Optionen angezeigt werden. Vermeiden Sie Schachtelungserweiterungen, die tiefer als eine Ebene sind.

App-Designeinstellungen

Wenn Ihre App Es Benutzern ermöglicht, den Farbmodus der App auszuwählen, präsentieren Sie diese Optionen mithilfe eines Kombinationsfelds in einem SettingsCard. Die Optionen sollten folgendes lesen:

• Licht
• Dunkel
• Systemeinstellung verwenden

Sie können auch einen Link zur Seite "Farben" von Windows Einstellungen hinzufügen, auf die Benutzer zugreifen und den aktuellen Standard-App-Modus ändern können. Verwenden Sie die Zeichenfolge "Windows Farbeinstellungen" für den Linktext und ms-settings:colors für den URI.

Informationen zum Abschnitt

Wir empfehlen, einen Über-Abschnitt am unteren Rand Ihrer Einstellungsseite mit einer SettingsExpander zu platzieren. In der reduzierten Kopfzeile sollte der App-Name, das Symbol und die Versionsnummer angezeigt werden. Der erweiterte Bereich kann Folgendes umfassen:

• Ein Link zum Repository oder zur Website Ihrer App.
• Ein Link zum Melden von Fehlern oder Anfordern von Funktionen.
• Eine Liste von Abhängigkeiten und Verweisen in Form von HyperlinkButton-Steuerelementen.
• Rechtliche Informationen wie urheberrechtsrechtliche Hinweise, Nutzungsbedingungen und Links zu den Datenschutzbestimmungen.

Empfohlene Seiteninhalte

Wenn Sie über eine Liste von Elementen verfügen, die Sie in Ihre App-Einstellungsseite aufnehmen möchten, sollten Sie die folgenden Richtlinien berücksichtigen:

• Gruppieren Sie ähnliche oder verwandte Einstellungen unter einer Abschnittsüberschrift.

• Versuchen Sie, die Gesamtzahl der Einstellungen auf maximal vier oder fünf zu halten.

• Zeigen Sie die gleichen Einstellungen unabhängig vom App-Kontext an. Wenn bestimmte Einstellungen in einem bestimmten Kontext nicht relevant sind, deaktivieren Sie SettingsCard, indem Sie IsEnabled auf false setzen.

• Verwenden Sie beschreibende Ein-Wort-Beschriftungen für Einstellungsheader. Nennen Sie z. B. die Einstellung "Konten" anstelle von "Kontoeinstellungen" für kontobezogene Einstellungen.

• Wenn eine Einstellung direkt mit dem Web verknüpft ist, verwenden Sie ein klickbares SettingsCard Symbol IsClickEnabled="True" und ein entsprechendes Aktionssymbol, um die externe Navigation anzuzeigen.

• Kombinieren Sie weniger verwendete Einstellungen in einem SettingsExpander, sodass allgemeine Einstellungen jeweils über ein eigenes SettingsCard verfügen können. Platzieren Sie Inhalte oder Links, die nur Informationen in einem Abschnitt "Info" enthalten.

• Präsentieren Sie Inhalte von oben nach unten in einer einzelnen Spalte, die bei Bedarf scrollbar ist.

• Verwenden Sie die folgenden Steuerelemente für App-Einstellungen:

  • Umschalter: Damit können Benutzer Werte ein- oder ausschalten.
  • Optionsfelder: Um Benutzern die Auswahl eines Elements aus einer Gruppe von bis zu 5 sich gegenseitig ausschließenden optionen zu ermöglichen.
  • Kombinationsfelder: So können Benutzer aus einer Reihe von Optionen in einer kompakten Dropdownliste auswählen.
  • Texteingabefelder: Damit Benutzer Text eingeben können. Verwenden Sie den Typ des Texteingabefelds, das dem Typ des Texts entspricht, den Sie vom Benutzer erhalten, z. B. eine E-Mail oder ein Kennwort.
  • Hyperlinks: Um den Benutzer zu einer anderen Seite innerhalb der App oder zu einer externen Website zu bringen.
  • Schaltflächen: Damit Benutzer eine sofortige Aktion initiieren können.

• Fügen Sie eine beschreibende Meldung hinzu, wenn eines der Steuerelemente deaktiviert ist. Verwenden Sie die Description Eigenschaft von SettingsCard, um zu erläutern, warum die Einstellung nicht verfügbar ist.

• Wenn ein Benutzer eine Einstellung ändert, sollte die App sofort die Änderung widerspiegeln – erfordert keine Bestätigungsschaltfläche.

Verwandte Artikel

• SettingsCard und SettingsExpander (Windows Community Toolkit)
• Befehlsdesigngrundlagen
• Richtlinien für Fortschrittssteuerungen
• Speichern und Abrufen von App-Daten