Hur du inkluderar ett mörkt tema i din Android-app
För utvecklare är det en enkel process att skapa en Android-app - att utforma ett tilltalande användargränssnitt är det som faktiskt är svårt. Det är därför vi skrev guiden "Hur man designar en Android-app-UI som inte suger", för utvecklare som behöver lite inspiration för att skapa enkla men tilltalande användargränssnitt. I den guiden nämnde vi kort att lägga till ett mörkt / nattläge-tema till dina appar, och i den här guiden kommer vi att leda dig igenom det.
Att lägga till ett mörkt / nattlägetema i din app kan vara ett bra alternativ för dina användare - det sparar batteritid och är mycket lättare för ögonen på natten. En vit bakgrund på svart text, eller en kombination av "ljusa" färger i ditt användargränssnitt, är verkligen stressande på ögonen, särskilt på natten. Således är en mörk bakgrund med ljusare text mycket mindre stressande och skadlig för ögonen, varför många populära appar har börjat inkludera ett mörkt tema - YouTube och Reddit senast, även om Facebook fortfarande inte har publicerat sina efter att ha lovat en tillbaka i Maj.
Om du enkelt vill lägga till ett växlingsbart mörkt läge till din Android-app, följ denna appguide och kommentera om du stöter på några problem!
Skapa XML-attribut
Först måste du skapa en XML-attributfil som hanterar teman. Detta är mycket bättre än att inkludera två uppsättningar resurser i din APK för två olika teman, och därmed uppblåsa din APK-storlek, eftersom Android naturligt kan ändra färger på attribut genom denna XML.
Så i appens "resurser" -mapp skapar du en fil med namnet attrs.xml och lägger till dessa rader ( dessa är stilbara attribut):
Innan Lollipop kunde vi inte specificera attribut för drawables, så vi var tvungna att ange resurs-ID: er för drawables - men det är inte längre fallet.
Lägga till stilarna
För att detta ska fungera måste vi skapa två separata stilar som delar samma bas. Det första kommer uppenbarligen att vara ditt primära "ljusa" tema, och det andra är ditt "mörka" tema.
# F4F4F6 # 96F4F4F6 #FFFF # F2F2F3 @ drawable / i_light_plholder # 33343B / item> # 8033343B # 28292e # F2F2F3 @ drawable / i_dark_pholder
Här är de faktiska stilarna för en given aktivitet:
# F4F4F6 # 33343B
Du måste ange ett av dessa teman i manifestet för appens aktivitet, som i detta fall är FeedActivity.
Stylisera vyerna
Här är ett exempel på att stilisera dina åsikter - i det här exemplet är det för ett "Sidan hittades inte" omdirigeringsfel.
Hur man aktiverar växling av dynamiskt tema
Det bästa och mest effektiva sättet att möjliggöra dynamisk temaomkoppling är att ladda SharedPreference-värdet som används för att lagra inställningen i applikationsinstansen med Singleton-mönstret, vilket innebär att vi inte behöver göra det i början av varje aktivitet.
public class-app utökar Application {public static final String TAG = "App"; privat boolean isNightModeEnabled = falsk; @Override public void onCreate () {super.onCreate (); // Vi laddar tillståndet Night Mode här SharedPreferences mPrefs = PreferenceManager.getDefaultSharedPreferences (detta); this.isNightModeEnabled = mPrefs.getBoolean (“NIGHT_MODE”, falsk); } public boolean isNightModeEnabled () {return isNightModeEnabled; } public void setIsNightModeEnabled (boolean isNightModeEnabled) {this.isNightModeEnabled = isNightModeEnabled; }} Eftersom den här instansen lanseras före någonting annat låter den dig ringa isNightModeEnabled () Boolean när du vill, i alla aktiviteter som tillhör appen när den har öppnats.
public final class FeedActivity utökar AppCompatActivity {private final static String TAG = “FeedActivity”; @Override-skyddat tomrum onCreate (Bundle SavedInstanceState) {if (MyApplication.getInstance (). IsNightModeEnabled ()) {setTheme (R.style.FeedActivityThemeDark); } super.onCreate (sparadInstanceState); setContentView (R.layout.activity_feed); }} Men om du vill tillämpa ett annat tema än det som anges i manifestfilen, måste det göras innan metoden för förälder onCreate () anropas.
Ställa in staten med AppCompat
AppCompat är verkligen användbart för ett brett spektrum av saker, och i det här fallet kommer vi att använda det för att ställa in läget. Det betyder att du inte längre behöver använda appinstansen för att skapa ett cache-tillstånd och därmed minska app-cacheuppblåsningen (om än med en mycket liten marginal ).
AppCompatDelegate .setDefaultNightMode (AppCompatDelegate.MODE_NIGHT_YES);
Här kan du antingen använda:
- AppCompatDelegate.MODE_NIGHT_YES
AppCompatDelegate.MODE_NIGHT_NO
AppCompatDelegate.MODE_NIGHT_AUTO
Hämtar staten
AppCompatDelegate.getDefaultNightMode (); public final class FeedActivity utökar AppCompatActivity {private final static String TAG = “FeedActivity”; @Override skyddat tomrum onCreate (Bundle sparadInstanceState) {if (AppCompatDelegate.getDefaultNightMode () == AppCompatDelegate.MODE_NIGHT_YES) {setTheme (R.style.FeedActivityThemeDark); } super.onCreate (sparadInstanceState); setContentView (R.layout.activity_feed); }} Det borde vara det - du kan fortsätta anpassa och justera värden efter din smak, men den här guiden är en bra introduktion för att komma igång med att inkludera ett inhemskt mörkt tema i din Android-app.
