Slik inkluderer du et mørkt tema i Android-appen din

For utviklere er det å lage en Android-app en enkel prosess - å designe et tiltalende brukergrensesnitt er det som faktisk er vanskelig. Derfor skrev vi guiden “Hvordan designe en Android-app-brukergrensesnitt som ikke suger”, for utviklere som trenger litt inspirasjon til å lage enkle, men likevel tiltalende brukergrensesnitt. I den guiden nevnte vi kort å legge til et mørkt / natt-modus-tema til appene dine, og i denne guiden vil vi lede deg gjennom det.

Å legge til et mørkt / natt-modus-tema i appen din kan være et flott alternativ for brukerne dine - det sparer batterilevetid og er mye lettere for øynene om natten. En hvit bakgrunn på svart tekst, eller hvilken som helst kombinasjon av 'lyse' farger i brukergrensesnittet, er veldig belastende på øynene, spesielt om natten. Dermed er en mørk bakgrunn med lysere tekst mye mindre stressende og skadelig for øynene, og det er grunnen til at mange populære apper har begynt å inkludere et mørkt tema - YouTube og Reddit sist, selv om Facebook fortsatt ikke har publisert sitt etter å ha lovet en tilbake i Kan.

Hvis du enkelt vil legge til en byttbar mørk modus til Android-appen din, følg denne appguiden og kommenter hvis du får problemer!

Opprette XML-attributter

Først må du opprette en XML-attributtsfil som vil håndtere temaene. Dette er mye bedre enn å inkludere to sett med ressurser i APK-en for to forskjellige temaer, og dermed oppblåse APK-størrelsen, da Android kan endre farger på attributter gjennom denne XML.

Så i appens 'ressurser' -mappe, oppretter du en fil som heter attrs.xml og legger til disse linjene ( dette er stilbare attributter):

Før Lollipop kunne vi ikke spesifisere attributter for tegnbare ting, så vi måtte spesifisere ressurs-ID-ene for tegnbare ting - men dette er ikke lenger tilfelle.

Legge til stiler

For å få dette til å jobbe, må vi lage to separate stiler som vil dele den samme basen. Det første vil åpenbart være ditt primære 'lyse' tema, og det andre vil være ditt 'mørke' tema.

 # F4F4F6 # 96F4F4F6 #FFFF # F2F2F3 @ drawable / i_light_plholder # 33343B / item> # 8033343B # 28292e # F2F2F3 @ drawable / i_dark_pholder 

Her er de faktiske stilene for en gitt aktivitet:

 # F4F4F6 # 33343B 

Du må spesifisere et av disse temaene i Manifest for appens aktivitet, som i dette tilfellet er FeedActivity.

Stylisere utsikten

Her er et eksempel på å stilisere visningene dine - i dette eksemplet er det for en “Side not found” -dirigeringsfeil.

Slik aktiverer du dynamisk temaskift

Den beste og mest effektive måten å aktivere dynamisk temaskifting er å laste inn SharedPreference-verdien som brukes til å lagre innstillingen i applikasjonsforekomsten ved å bruke Singleton-mønsteret, noe som betyr at vi ikke trenger å gjøre det i starten av hver aktivitet.

 public class-app utvider søknad {public static final String TAG = "App"; privat boolsk isNightModeEnabled = falsk; @Override offentlig tomrom onCreate () {super.onCreate (); // Vi laster inn Night Mode-tilstanden her SharedPreferences mPrefs = PreferenceManager.getDefaultSharedPreferences (dette); this.isNightModeEnabled = mPrefs.getBoolean (“NIGHT_MODE”, falsk); } public boolean isNightModeEnabled () {return isNightModeEnabled; } public void setIsNightModeEnabled (boolean isNightModeEnabled) {this.isNightModeEnabled = isNightModeEnabled; }} 

Siden denne forekomsten blir lansert før noe annet, lar den deg ringe isNightModeEnabled () boolsk når du vil, i enhver aktivitet som tilhører appen når den først er åpnet.

 offentlig sluttklasse FeedActivity utvider AppCompatActivity {private final static String TAG = “FeedActivity”; @Override beskyttet tomrom onCreate (Bundle savedInstanceState) {if (MyApplication.getInstance (). IsNightModeEnabled ()) {setTheme (R.style.FeedActivityThemeDark); } super.onCreate (savedInstanceState); setContentView (R.layout.activity_feed); }} 

Hvis du imidlertid vil bruke et annet tema enn det som er spesifisert i manifestfilen, må det gjøres før du ringer til overordnet onCreate () -metode.

Stille inn staten ved hjelp av AppCompat

AppCompat er virkelig nyttig for en lang rekke ting, og i dette tilfellet bruker vi det til å stille modustilstand. Dette betyr at du ikke lenger trenger å bruke appforekomsten for å opprette en hurtigbufret tilstand, og dermed redusere app-cacheoppblåsthet ( om enn med en veldig liten margin ).

 AppCompatDelegate .setDefaultNightMode (AppCompatDelegate.MODE_NIGHT_YES); 

Her kan du enten bruke:

  • AppCompatDelegate.MODE_NIGHT_YES

    AppCompatDelegate.MODE_NIGHT_NO

    AppCompatDelegate.MODE_NIGHT_AUTO

Henter staten

 AppCompatDelegate.getDefaultNightMode (); offentlig sluttklasse FeedActivity utvider AppCompatActivity {private final static String TAG = “FeedActivity”; @Override beskyttet tomrom onCreate (Bundle savedInstanceState) {if (AppCompatDelegate.getDefaultNightMode () == AppCompatDelegate.MODE_NIGHT_YES) {setTheme (R.style.FeedActivityThemeDark); } super.onCreate (savedInstanceState); setContentView (R.layout.activity_feed); }} 

Det skal være det - du kan fortsette å tilpasse og finjustere verdier etter din smak, men denne guiden er en flott introduksjon for å komme i gang med å inkludere et innfødt mørkt tema i Android-appen din.

Interessante Artikler