Så här kodar du en inställningsskärm i en Android-app

Materialkonstruktionsgruppen hos Google ger en tydlig definition av vilka inställningar i din Android-app som ska göra:

Appinställningar låter användarna ange inställningar för hur en app ska fungera.

Google säger också att dina användare ska navigera till appinställningarna, antingen från sidnavigations- eller verktygsfältmenyn, med ett objekt som är märkt inställningar. 

Inkluderar inställningar i din app ger användarna möjlighet att styra en del av din apps funktionalitet. Detta gör dina användare glada istället för arg - eftersom de nu har kontroll över hur appen beter sig. 

Det rekommenderas starkt att ge åtkomst till appinställningar. Detta kommer att ge en bättre användarupplevelse för dina användare, vilket leder till en bättre översyn i Google Play-butiken, vilket så småningom ger upphov till ett högre antal appnedladningar (vilket ökar intäkterna). 

Jag antar att du måste ha interagerat med en apps inställningar på din enhet, till exempel genom att välja en standard ringsignal eller genom att kontrollera din integritet i appen. Nästan alla populäraste appar som du har laddat ner eller laddar ner på Google Play Butik innehåller en inställningsskärm för att du ska kunna kontrollera programmets beteende. 

Ett exempel på en populär app som har en inställningsskärm är Chrome Android-appen från Google. På den här appens inställningsskärm kan användarna välja standardsökningsmotorn, ändra anmälningsbeteendet, kontrollera användarens sekretess etc. Du kan se detta själv genom att ladda ner Chrome-appen från Google Play-butiken (om du inte redan har den på din enhet). Följande skärmdump är från Chrome-appen och visar appens inställningsskärm.

I det här inlägget lär du dig hur du skapar en skärm för appinställningar från början och hur du läser de värden som användaren har valt från appinställningarna. För en extra bonus lär du dig också hur du använder Android Studio-mallar-funktionen för att snabbt starta upp ditt projekt med en inställningsskärm. 

Ett provprojekt (i Kotlin) för denna handledning finns på vår GitHub repo så att du enkelt kan följa med.

förutsättningar

För att kunna följa denna handledning behöver du:

• En grundläggande förståelse för vissa Android-API: er (t.ex. SharedPreferences)
• Android Studio 3.0 eller senare
• Kotlin-plugin 1.1.51 eller högre

1. Skapa ett Android Studio-projekt

Avfyra Android Studio och skapa ett nytt projekt (du kan namnge det SettingsScreenDemo) med en tom aktivitet som heter SettingsActivity. Se till att du också kontrollerar Inkludera Kotlin support kryssrutan. 

2. Skapa en PreferenceFragment

För att stödja API Nivå 11 (Honeycomb) och ovan kan vi använda PreferenceFragment. Denna klass är helt enkelt en Fragment som visar en hierarki av Preferens objekt som listor.

importera android.os.Bundle import android.preference.PreferenceFragment importera android.support.v7.app.AppCompatActivity class SettingsActivity: AppCompatActivity () åsidosätta roligt onCreate (savedInstanceState: Bundle?) super.onCreate (savedInstanceState) om (fragmentManager.findFragmentById (android.R.id.content) == null) fragmentManager.beginTransaction () .add (android.R.id.content, SettingsFragment ()). commit ) klass SettingsFragment: PreferenceFragment () överstyra kul påCreate (savedInstanceState: Bundle?) super.onCreate (savedInstanceState) addPreferencesFromResource (R.xml.preferences)

I koden ovan skapade vi en kapslaad klass SettingsFragment inuti SettingsActivity (eftersom det SetttingsFragment klassen är så liten). Observera att vår klass SettingsFragment sträcker sig PreferenceFragment superklass och har en metod addPrerenceFromResource inuti onCreate (). I den här metoden gav vi det ett resurs-ID R.xml.preference av preferens XML att starta - när Fragment är laddad. Slutligen är vi värd för fragmentet till aktiviteten genom att helt enkelt använda FragmentTransaction för att lägga till den i användargränssnittet onCreate () av SettingsActivity.

3. Skapa våra inställningar

Skapa en XML-fil och namnge den preferences.xml. Spara den här filen inuti res / xml katalog i ditt app-projekt. Observera att du kan ge den här filen något namn, men det är starkt rekommenderat att hålla sig till det vanliga namnet "preferenser". Du borde också ha en enda fil i ett appprojekt.

Rotenoden för vår preferenser.xml filen ska vara a element. Inuti detta rotelement har vi nu vår person Preferens. Här är de gemensamma attribut som är associerade med a Preferens:

• android: nyckel: detta attribut används för att få värdet i SharedPreferences objekt.
  
• android: titel: anger titeln för Preferens. Detta är den djärva texten.
  
• android: Sammanfattning: anger sammanfattningen för Preferens (detta är inte nödvändigt). Detta är den bleka texten under titeln.
  
• android: default: anger standardvärdet för Preferens. 
  

Vi går igenom var och en Preferens vi har definierat ovanför inom kort. Observera att du också kan lägga till eller anpassa en Preferens via Android Studio-inställningsredigeraren-liknande layoutredigeringsredigeraren som du redan är bekant med. Du kan antingen välja att lägga till / redigera din preferens XML-fil direkt i "Text" -läget eller använd dra-och-släpp-gränssnittet i "Design" -läget.

Som du kan se, kan du dra och släppa någon i den här redigeraren Preferens i palettavsnittet (på vänster sida). När du har tappat, bör du välja den och ändra dess attribut i attributfönstret (på höger sida) av redigeraren. Observera att vi som standard har några attribut att ändra. Att visa eller ändra alla attribut som är associerade med en vald Preferens, se till att du klickar på Visa alla attribut länk längst ner i attributfönstret. Det här liknar den layoutredigerare du redan vet. 

Nu, låt oss gå igenom var och en av Preferens enheter vi har. 

Checkbox Preferens

en CheckBoxPreference är helt enkelt a CheckBox widget som ingår i inställningsskärmen. Detta Preferens returnerar värdet "sant" om det är markerat eller "falskt" annars. Med andra ord returnerar den en boolean beroende på widgetens tillstånd.

Andra attribut som du kan lägga till i en CheckBoxPreference är:

• android: summaryOff: anger sammanfattningen för Preferens i en preferens skärm när den är okontrollerad.
  
• android: summaryOn: anger sammanfattningen för Preferens i en preferens skärm när den är kontrollerad.
• android: disableDependentsState: Staten (sant för på eller falskt för av) som orsakar att anhöriga är inaktiverade. Kan vara ett booleskt värde, som "true" eller "false".

Byt Preferens

SwitchPreference utför liknande funktionalitet till CheckBoxPreference. Det ger ett tvåstatligt ("på" eller "av") växlingsalternativ. Detta använder a Växla widget som låter användaren dra åt vänster ("av") och höger ("på"). Detta Preferens inkluderar även de attribut som beskrivs för CheckBoxPreference ovan. Dessutom har den följande attribut:

• android: switchTextOff: ställer in texten som används på strömbrytaren själv i "av" -läget. 
  
• android: switchTextOn: ställer in texten som används på strömbrytaren själv när den är i "på" -läge. 
  

EditText Preference

Detta Preferens, När den klickas visas en dialogruta för användaren att ange en inmatad text. Den använder Redigera text widget-inklusive alla attribut på den widgeten som du redan är bekant med.

Observera att värdet som lagrats i SharedPreferences är en sträng.

Listpreferens

Den här sortens Preferens kommer att visa en lista med poster i en dialogruta när den är tagen. Här kan du ange ett par string-array-resurser i ditt preferens XML. Denna strängmatrisresurs innehåller helt enkelt en samling strängar. Den här resursen är belägen på res / värden / arrays.xml.

   15 minuter 30 minuter 1 timme 3 timmar 6 timmar Aldrig   15 30 60 180 360 -1  

Här är vårt exempel ListPreference använder den här resursen. 

Vi ställer in uppgifterna och inmatningsvärdena med hjälp av android: anteckningar och android: entryValues attributen respektive.

• android: anteckningar: den mänskliga läsbara uppsättningen att presentera som en lista.
  
• android: entryValues: arrayen för att hitta värdet för att spara för en preferens när en post från poster väljs.
  

Om vi ​​till exempel använder antalet minuter i varje varaktighet som inmatningsvärden, när användaren väljer en tidsperiod (t ex 30 minuter), sparas motsvarande heltal värde i SharedPreferences (t ex 30).

MultiSelect List Preference

Den här liknar ListPreference men istället för att ha radioknappar har vi kryssrutor. Med andra ord kan användaren välja flera objekt i dialogrutan. Observera att resultatet är lagrat i en "strängsats" i SharedPreferences. Detta kan hämtas med getStringSet ().

Ringtone Preference

När en RingtonePreference tappas, visas en dialog med listan över tillgängliga ringsignaler på enheten eller emulatorn.

• android: showDefault: huruvida Standard ringsignal alternativet visas.
  
• android: showSilent: huruvida a Tyst alternativet visas i listan. Användaren kan välja det här alternativet om de inte vill spela någon ringsignal.  
  

Observera att värdet som lagrats i SharedPreferences för denna preferens är en speciell sträng. Denna speciella sträng är en URI som pekar på a ContentProvider.

4. Skapa inställningsgrupper

Det blir ett problem när du har en lång lista över inställningar eller inställningar, eftersom användare kan ha problem med att skanna eller förstå dem. För att lösa detta problem kan vi gruppera våra inställningar. Ta en titt på skärmdumpen i Chrome-appen som jag visade dig i början igen - märka att den grupperade inställningarna i två kategorier: Grunderna och Avancerad. Detta gör det lättare för användaren att förstå inställningarna och att inte göra listan verkar för överväldigande.

Låt oss nu titta på hur enkelt det är att utföra denna uppgift.

   ...   ...  

Vi omger bara de preferenser vi vill gruppera i en tagga och ge varje grupp en titel med hjälp av android: titel attribut.

5. Starta en avsikt

Observera att det är möjligt att öppna en aktivitet genom att bara klicka på ett alternativ från inställningsskärmen. Detta kan vara användbart när du vill öppna en webbsida. Här är koden för att göra det:

Här lade vi till en element inuti element. 

• android: action: anger åtgärden för avsiktet (det här liknar anropet setAction () på ett Intent-objekt). 
• android: targetClass: anger klassdelen av komponentnamnet (samma som anropet setComponent () på ett Intent-objekt).
  
• android: targetPackage: Anger paketets del av komponentnamnet.
• android: uppgifter: Ställer in data som ska tilldelas (samma som anrop setData () på ett Intent-objekt). 

För att öppna en webbsida kan du till exempel använda följande:

6. Binda Preference-sammanfattningen till det valda värdet

Låt oss nu se hur du uppdaterar preferenssammanfattningen med det värde som användaren valt. 

klassen SettingsActivity: AppCompatActivity () // ... klassen SettingsFragment: PreferenceFragment () överstyra kul påCreate (savedInstanceState: Bundle?) super.onCreate (savedInstanceState) addPreferencesFromResource (R.xml.preferences) bindPreferenceSummaryToValue (findPreferenceSummaryToValue bindPreferenceSummaryToValue (findPreference ("text")) bindPreferenceSummaryToValue (findPreference ("list")) // ...

I denna klass skapade vi en hjälparmetod som heter bindPreferenceSummaryToValue (), som ligger inom vårt följeslag objekt, uppdaterar preferens sammanfattande text med det värde som användaren har valt. Vi passerade det a Preferens objekt som ett argument. De findPreference () kommer att returnera a Preferens använda Preferenss nyckel. 

klass SettingsActivity: AppCompatActivity () // ... companion object / ** * En preferensvärdesbyte lyssnare som uppdaterar preferensens sammanfattning * för att återspegla sitt nya värde. * / privat val sBindPreferenceSummaryToValueListener = Preference.OnPreferenceChangeListener preference, value -> val stringValue = value.toString () om (preferens är ListPreference) // För listpreferenser, kolla upp rätt visningsvärde i // preferensens 'poster' lista. val listPreference = preference val index = listPreference.findIndexOfValue (stringValue) // Ange sammanfattningen för att återspegla det nya värdet. preference.setSummary (om (index> = 0) listPreference.entries [index] else null) annars om (preferens är RingtonePreference) // För ringsignalpreferenser, kolla upp rätt visningsvärde // med RingtoneManager. om (TextUtils.isEmpty (stringValue)) // Tom värden motsvarar "tyst" (ingen ringsignal). preference.setSummary ("Silent") annars val ringtone = RingtoneManager.getRingtone (preference.getContext (), Uri.parse (stringValue)) om (ringsignal == null) // Rensa sammanfattningen om det var ett uppslagningsfel . preference.setSummary (null) else // Ställ in sammanfattningen för att återspegla den nya ringsignalen // namn. val name = ringtone.getTitle (preference.getContext ()) preference.setSummary (namn) else // För alla andra inställningar, sätt sammanfattningen till värdet // enkla strängrepresentation. preference.summary = stringValue true private fun bindPreferenceSummaryToValue (preference: Preference) // Ställ in lyssnaren för att titta på värdeförändringar. preference.onPreferenceChangeListener = sBindPreferenceSummaryToValueListener // Aktivera lyssnaren omedelbart med preferensens // nuvarande värde. sBindPreferenceSummaryToValueListener.onPreferenceChange (preference, PreferenceManager .getDefaultSharedPreferences (preference.context) .getString (preference.key, ""))

Vi har en variabel sBindPreferenceSummaryToValueListener det är en förekomst av Preference.OnPreferenceChangeListener. Det här är helt enkelt en preferensförändringslistor som hjälper oss att uppdatera preferenssammanfattningen till det värde som användaren har valt. Vi söker efter speciella fall, som när den valda preferensen är en RingtonePreference eller a ListPreference. För de föredragna typerna gör vi en del speciell hantering för att få sammanfattningssträngen. Om preferensen varken är (som en EditTextPreference), satte vi bara sammanfattningen till preferensens strängvärde. 

Inuti bindPreferenceSummaryToValue (), Vi ställer in preferensförändringslyttaren genom att ringa onPreferenceChangeListener (i Java är det setOnPreferenceChangeListener istället) på Preferens objekt. 

Kör nu projektet igen för att se hur allting fungerar!

7. Hämta inställningsvärden

För att få inställningsvärden för inställningsskärmen, ringer vi getDefaultSharedPreference () som ligger inuti PreferenceManager klass-passerar det a Sammanhang föremål för de preferenser vars värderingar är önskade. Observera att vi får värdena från standardvärdet SharedPreferences för vår ansökan. 

val prefs = PreferenceManager.getDefaultSharedPreferences (detta) prefs.getBoolean ("checkbox", false) .toString () prefs.getString ("ringsignal", "") prefs.getString (" text ","") prefs.getString (" list ","")

Du ringer motsvarande getter-metoden för den typ som vi vill hämta värdet in från SharedPreferences. Du skickar den nyckeln som första argumentet, och standardvärdet är det andra argumentet. 

8. Bonus: Använda Android Studio Mallar

Nu när du har lärt dig om de berörda API: erna för att skapa en inställningsskärm från början i Android, visar jag dig en genväg som gör det snabbare nästa gång. Du kan välja att använda en mall istället för att koda en inställningsskärm från början. 

Android Studio tillhandahåller kodmallar som följer de bästa metoderna för Android-design och utveckling. Dessa befintliga kodmallar (tillgängliga i Java och Kotlin) kan hjälpa dig att snabbt starta ditt projekt. En sådan mall kan användas för att skapa en inställningsskärm. 

För att använda den här praktiska funktionen för ett nytt projekt ska du först skjuta upp Android Studio.

Ange programnamnet och klicka på Nästa knapp. Du kan lämna standardinställningarna som de är i Mål Android-enheter dialog. 

Klicka på Nästa knappen igen.

I Lägg till en aktivitet till mobilen dialogrutan, bläddra ned och välj Inställningsaktivitet. Klicka på Nästa knappen efter det. 

I den sista dialogrutan kan du byta namnet Aktivitetsnamn, layoutnamn eller titel om du vill. Slutligen klickar du på Avsluta knappen för att acceptera alla konfigurationer. 

Android Studio har nu hjälpt oss att skapa ett projekt med en inställningsaktivitet. Väldigt coolt! Du rekommenderas starkt att utforska den genererade koden. 

Du kan också använda mallar för ett redan befintligt Android Studio-projekt. Helt enkelt gå till Arkiv> Ny> Aktivitet> Inställningsaktivitet.  

Observera att mallarna som följer med Android Studio är bra för enkla layouter och grundläggande apper, men om du verkligen vill starta din app kan du överväga några av de appmallar som finns tillgängliga från Envato Market. 

De är en stor tidsbesparare för erfarna utvecklare, vilket hjälper dem att skära igenom sloget om att skapa en app från början och fokusera sina talanger istället på de unika och anpassade delarna av att skapa en ny app

Slutsats

I den här handledningen lärde du dig hur du skapar appinställningar i Android från början. Vi undersökte också hur du enkelt och snabbt använder Android Studio-mallarna för att skapa appinställningar. 

Jag rekommenderar starkt att du tittar på de officiella riktlinjerna för materialdesign för inställningar för att lära dig mer om hur du korrekt utformar och använder inställningar i Android. Läs även den officiella API-guiden för att lära dig mer om andra API-skivor för att skapa en inställningsaktivitet. 

För mer information om kodning för Android, kolla in några av våra andra kurser och handledning här på Envato Tuts+!