Riktlinjer för appinställningar

Appinställningar är användaranpassade delar av din Windows app, som nås via en dedikerad inställningssida. En nyhetsläsarapp kan till exempel låta användaren ange vilka nyhetskällor som ska visas eller hur många kolumner som ska visas på skärmen, medan en väderapp kan låta användaren välja mellan Celsius och Fahrenheit. Den här artikeln innehåller rekommendationer och metodtips för att skapa och visa appinställningar i WinUI-appar.

När du ska ange en inställningssida

Här är exempel på appalternativ som hör hemma på en appinställningssida:

• Konfigurationsalternativ som påverkar appens beteende och inte kräver frekvent omjustering, som att välja mellan Celsius eller Fahrenheit som standardenheter för temperatur i en väderapp, ändra kontoinställningar för en e-postapp, inställningar för meddelanden eller hjälpmedelsalternativ.
• Alternativ som är beroende av användarens inställningar, till exempel musik, ljudeffekter eller färgteman.
• Appinformation som inte används särskilt ofta, till exempel sekretesspolicy, hjälp, appversion eller copyrightinformation.

Kommandon som ingår i det typiska apparbetsflödet (till exempel ändra penselstorleken i en konstapp) bör inte finnas på en inställningssida. Mer information om kommandoplacering finns i Grundläggande om kommandodesign.

Allmänna rekommendationer

• Håll inställningssidorna enkla och använd binära kontroller (på/av). En växlingsknapp är vanligtvis den bästa kontrollen för en binär inställning.
• För inställningar som låter användare välja ett objekt från en uppsättning med upp till 5 ömsesidigt uteslutande, relaterade alternativ, använder du alternativknappar.
• Skapa en startpunkt för alla appinställningar på appens inställningssida.
• Håll inställningarna enkla. Definiera smarta standardvärden och behåll antalet inställningar till ett minimum.
• När en användare ändrar en inställning bör appen omedelbart återspegla ändringen.
• Inkludera inte kommandon som ingår i det gemensamma apparbetsflödet.

Startpunkt

Hur användarna kommer till sidan för appinställningar bör baseras på appens layout.

Navigeringsfönster

För en NavigationView-layout bör appinställningarna vara det sista objektet i listan över navigeringsalternativ och fästas längst ned. NavigationView innehåller ett inbyggt inställningsobjekt för detta ändamål – ange egenskapen IsSettingsVisible till för att true visa en inställningspost längst ned i navigeringsfönstret automatiskt.

Kommandofält

Om du använder ett kommandofält eller ett verktygsfält placerar du inställningarnas startpunkt som ett av de sista objekten i spillmenyn "Mer". Om större synlighet för startpunkten för inställningarna för din app är viktigt, placera startpunkten direkt i kommandofältet och inte i överflödet.

Utformning

Sidan appinställningar bör öppna helskärmsläge och fylla hela fönstret. Använd en rullningsbar layout med en begränsad maxbredd (cirka 1 000–1 100 px) så att innehållet förblir läsbart på breda skärmar. Gruppera relaterade inställningar under avsnittsrubriker med textformatet BodyStrong .

Använd kontrollerna SettingsCard och SettingsExpander från Windows Community Toolkit för att skapa inställningssidan. Dessa kontroller ger en konsekvent, tillgänglig layout med en rubrik, beskrivning, ikon och en åtgärdskontroll som är justerad till höger om kortet.

Fullständiga implementeringsexempel finns på sidan inställningar för WinUI Gallery och Windows Community Toolkit SettingsControls.

Inställningskort

Använd ett SettingsCard för enskilda inställningar. Varje kort har en rubrik, en valfri Beskrivning, en valfri HeaderIcon och en åtgärdskontroll (till exempel en ToggleSwitch, ComboBoxeller Button) placerad som kortets innehåll. Om du ställer in egenskapen IsClickEnabled på true blir hela kortet klickbart, vilket är användbart för navigeringsformatposter.

InställningarExpander

Använd inställningarExpander när en inställning har underalternativ som ska visas på begäran. Expanderaren visar en primär åtgärdskontroll på rubrikraden och ytterligare SettingsCard objekt i Items samlingen. Detta håller sidan kompakt samtidigt som avancerade alternativ visas. Undvik att kapsla expanderare djupare än en nivå.

Inställningar för apptema

Om appen tillåter användare att välja appens färgläge kan du presentera dessa alternativ med hjälp av en kombinationsruta i en SettingsCard. Alternativen bör läsa:

• Light
• Dark
• Använd systeminställningar

Du kanske också vill lägga till en hyperlänk på sidan Färger i Windows Inställningar där användare kan komma åt och ändra det aktuella standardappläget. Använd strängen "Windows färginställningar" för hyperlänktexten och ms-settings:colors för URI:n.

Om avsnittet

Vi rekommenderar att du placerar ett Om-avsnitt längst ned på inställningssidan med hjälp av en SettingsExpander. Den komprimerade rubrikraden bör visa appens namn, ikon och versionsnummer. Det expanderade området kan innehålla:

• En länk till appens lagringsplats eller webbplats.
• En länk till filbuggar eller begärandefunktioner.
• En lista över beroenden och referenser som HyperlänkKnappkontroller .
• Juridisk information som ett upphovsrättsmeddelande, användningsvillkor och sekretesspolicylänkar.

Rekommenderat sidinnehåll

När du har en lista över objekt som du vill ta med på sidan för appinställningar bör du överväga följande riktlinjer:

• Gruppera liknande eller relaterade inställningar under ett avsnittshuvud.

• Försök att hålla det totala antalet inställningar till högst fyra eller fem.

• Visa samma inställningar oavsett appkontext. Om vissa inställningar inte är relevanta i en viss kontext inaktiverar du SettingsCard genom att ange IsEnabled till false.

• Använd beskrivande etiketter med ett ord för inställningsrubriker. Ge till exempel inställningen namnet "Konton" i stället för "Kontoinställningar" för kontorelaterade inställningar.

• Om en inställning länkar direkt till webben använder du en klickbar SettingsCard med IsClickEnabled="True" och en lämplig åtgärdsikon för att ange extern navigering.

• Kombinera mindre använda inställningar i en SettingsExpander så att vanliga inställningar kan ha sina egna SettingsCard. Placera innehåll eller länkar som bara innehåller information i ett "Om"-avsnitt.

• Presentera innehåll uppifrån och ned i en enda kolumn, rullningsbart om det behövs.

• Använd följande kontroller för appinställningar:

  • Växlingsknappar: För att låta användare ställa in värden till på eller av.
  • Alternativknappar: Så här låter du användarna välja ett objekt från en uppsättning med upp till 5 ömsesidigt uteslutande, relaterade alternativ.
  • Kombinationsrutor: Så här låter du användarna välja bland en uppsättning alternativ i en kompakt listruta.
  • Textinmatningsrutor: Så här låter du användarna ange text. Använd den typ av textinmatningsruta som motsvarar den typ av text som du får från användaren, till exempel ett e-postmeddelande eller lösenord.
  • Hyperlänkar: För att ta användaren till en annan sida i appen eller till en extern webbplats.
  • Knappar: För att låta användare initiera en omedelbar åtgärd.

• Lägg till ett beskrivande meddelande om en av kontrollerna är inaktiverad. Använd egenskapen DescriptionSettingsCard för för att förklara varför inställningen inte är tillgänglig.

• När en användare ändrar en inställning bör appen omedelbart återspegla ändringen – behöver ingen bekräftelseknapp.

Relaterade artiklar

• SettingsCard och SettingsExpander (Windows Community Toolkit)
• Grundläggande om kommandodesign
• Riktlinjer för förloppskontroller
• Lagra och hämta appdata