Sådan inkluderes et mørkt tema i din Android-app
For udviklere er oprettelse af en Android-app en nem proces - at designe en tiltalende brugergrænseflade er det, der faktisk er vanskeligt. Derfor skrev vi vejledningen “Sådan designes en Android-app-brugergrænseflade, der ikke suger”, til udviklere, der har brug for lidt inspiration til at skabe enkle, men alligevel attraktive UI'er. I denne guide nævnte vi kort, at du tilføjede et mørkt / nat-tilstand til dine apps, og i denne guide vil vi lede dig gennem det.
Tilføjelse af et mørkt / nat-tilstandstema til din app kan være en fantastisk mulighed for dine brugere - det sparer batteriets levetid og er meget lettere for øjnene om natten. En hvid baggrund på sort tekst eller enhver kombination af 'lyse' farver i dit brugergrænseflade er virkelig stressende på øjnene, især om natten. Således er en mørk baggrund med lysere tekst langt mindre stressende og skadelig for øjnene, hvorfor mange populære apps er begyndt med et mørkt tema - YouTube og Reddit for nylig, selvom Facebook stadig ikke har offentliggjort deres efter at have lovet en tilbage i Kan.
Hvis du gerne let vil tilføje en skiftbar mørk tilstand til din Android-app, skal du følge denne Appuals-guide og kommentere, hvis du støder på problemer!
Oprettelse af XML-attributter
Først skal du oprette en XML attributtsfil, der håndterer temaet. Dette er meget bedre end at inkludere to sæt ressourcer i din APK til to forskellige temaer og dermed oppustet din APK-størrelse, da Android naturligt kan ændre farver på attributter gennem denne XML.
Så i din apps 'ressourcer' -mappe skal du oprette en fil med navnet attrs.xml og tilføje disse linjer ( dette er stilbare attributter):
Før Lollipop kunne vi ikke specificere attributter for tegnelige ting, så vi var nødt til at specificere ressource-ID'erne for tegninger - dog er dette ikke længere tilfældet.
Tilføjelse af stilarter
For at gøre dette arbejde skal vi oprette to separate stilarter, der vil dele den samme base. Det første vil naturligvis være dit primære 'lyse' tema, og det andet vil være dit 'mørke' tema.
# F4F4F6 # 96F4F4F6 #FFFF # F2F2F3 @ drawable / i_light_plholder # 33343B / item> # 8033343B # 28292e # F2F2F3 @ drawable / i_dark_pholder
Her er de faktiske stilarter for en given aktivitet:
# F4F4F6 # 33343B
Du skal specificere et af disse temaer i manifestet til appens aktivitet, som i dette tilfælde er FeedActivity.
Stiliserer udsigterne
Her er et eksempel på stilisering af dine synspunkter - i dette eksempel er det for en "Side ikke fundet" omdirigeringsfejl.
Sådan aktiveres dynamisk temaskift
Den bedste og mest effektive måde at aktivere dynamisk temaskiftning er at indlæse SharedPreference-værdien, der bruges til at gemme indstillingen i applikationsforekomsten ved hjælp af Singleton-mønsteret, hvilket betyder, at vi ikke behøver at gøre det i starten af hver aktivitet.
public class App udvider Application {public static final String TAG = "App"; privat boolsk isNightModeEnabled = falsk; @Override offentligt tomrum onCreate () {super.onCreate (); // Vi indlæser tilstanden Nattilstand her SharedPreferences mPrefs = PreferenceManager.getDefaultSharedPreferences (dette); this.isNightModeEnabled = mPrefs.getBoolean (“NIGHT_MODE”, falsk); } public boolean isNightModeEnabled () {return isNightModeEnabled; } public void setIsNightModeEnabled (boolsk isNightModeEnabled) {this.isNightModeEnabled = isNightModeEnabled; }} Da denne instans lanceres før noget andet, giver det dig mulighed for at ringe til isNightModeEnabled () Boolsk, når du vil, i enhver aktivitet, der tilhører appen, når den først er blevet åbnet.
offentlig endelig klasse FeedActivity udvider AppCompatActivity {privat endelig statisk streng TAG = “FeedActivity”; @Override beskyttet tomrum onCreate (Bundle gemtInstanceState) {if (MyApplication.getInstance (). IsNightModeEnabled ()) {setTheme (R.style.FeedActivityThemeDark); } super.onCreate (gemtInstanceState); setContentView (R.layout.activity_feed); }} Hvis du imidlertid vil anvende et andet tema end det, der er specificeret i manifestfilen, skal det gøres, før du kalder moderen onCreate () -metoden.
Indstilling af staten ved hjælp af AppCompat
AppCompat er virkelig nyttigt til en lang række ting, og i dette tilfælde bruger vi det til at indstille tilstandstilstanden. Dette betyder, at du ikke længere har brug for at bruge appforekomsten til at oprette en cache-tilstand, og dermed skære ned på app-cacheudblæsning ( omend med en meget lille margin ).
AppCompatDelegate .setDefaultNightMode (AppCompatDelegate.MODE_NIGHT_YES);
Her kan du enten bruge:
- AppCompatDelegate.MODE_NIGHT_YES
AppCompatDelegate.MODE_NIGHT_NO
AppCompatDelegate.MODE_NIGHT_AUTO
Henter staten
AppCompatDelegate.getDefaultNightMode (); offentlig endelig klasse FeedActivity udvider AppCompatActivity {privat endelig statisk streng TAG = “FeedActivity”; @Override beskyttet tomrum onCreate (Bundle gemtInstanceState) {if (AppCompatDelegate.getDefaultNightMode () == AppCompatDelegate.MODE_NIGHT_YES) {setTheme (R.style.FeedActivityThemeDark); } super.onCreate (gemtInstanceState); setContentView (R.layout.activity_feed); }} Det skal være det - du kan fortsætte med at tilpasse og justere værdier til din smag, men denne guide er en god introduktion til at komme i gang med at inkludere et indfødt mørkt tema i din Android-app.
