Cloud-Lösungen der Zukunft - Testen!

Revolutionäre Cloud-Technologie, ganz ohne versteckte Kosten. Profitieren Sie von unserer Testphase und entdecken Sie umfassende Funktionen. Der Anmeldeprozess ist transparent und unkompliziert. Starten Sie jetzt Ihre Reise in die Cloud - Kostenfrei!

Implementierung des Android DayNight-Themas: Nachtmodus leicht gemacht

Erfahren Sie, wie Sie mit dem Android DayNight-Thema mühelos einen Nachtmodus für Ihre App integrieren. Von der Implementierung des Themas bis zur Anpassung von Ressourcen für Tag- und Nachtmodi – entdecken Sie Schritt für Schritt, wie Sie die Benutzererfahrung verbessern. Lassen Sie sich von unserem Tutorial durch die einfache Umsetzung des Nachtmodus führen und optimieren Sie Ihre App für eine angenehme Nutzung bei allen Lichtverhältnissen.

Das Android DayNight Theme

Mit dem Android DayNight Theme, das mit der Support-Bibliothek 23.2.0 eingeführt wurde, können wir zwischen den hellen und dunklen Modi unserer Anwendung umschalten. Dieses Thema verbessert die Lesbarkeit und Benutzerfreundlichkeit Ihrer Anwendung während der Nacht, indem es den weißen, blendenden Hintergrund durch einen dunkleren ersetzt. Viele Reader-Apps haben dieses Thema bereits in Ihren Apps implementiert. Lassen Sie uns mit der Umsetzung beginnen, indem wir ein neues Android Studio-Projekt mit einer leeren Aktivität erstellen.

Hinzufügen des Themas zu unseren styles.xml

<style name="AppTheme" parent="Theme.AppCompat.DayNight">
<!-- Passen Sie Ihr Thema hier an. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>

Um das DayNight-Thema in unserer Anwendung festzulegen, verwenden wir die Methode AppCompatDelegate.setDefaultNightMode(). Die folgenden Argumente sind in der oben genannten Methode erlaubt:

  • MODE_NIGHT_YES – Aktiviert den Nachtmodus manuell.
  • MODE_NIGHT_NO – Deaktiviert den Nachtmodus manuell.
  • MODE_NIGHT_FOLLOW_SYSTEM – Verwendet die Systemeinstellungen, um die Tageszeit zu bestimmen und passt den Nachtmodus entsprechend an. Dies ist das Standardargument.
  • MODE_NIGHT_AUTO – Versucht, die Uhrzeit über die Gerätestandort-APIs automatisch zu erkennen. Wenn die Laufzeitberechtigung für Standortdienste nicht gewährt ist, wird die Systemzeit verwendet.

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES); //Für Nachtmodus-Thema
//AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO); //Für Tagesmodus-Thema

setContentView(R.layout.activity_main);
}

Das Thema sollte immer festgelegt werden, bevor die setContentView-Methode aufgerufen wird.

Was ist AppCompatDelegate?

Ein AppCompatDelegate ist eine Klasse, die einen Delegaten repräsentiert, den Sie verwenden können, um die Unterstützung von AppCompat auf beliebige Aktivitäten auszudehnen. Schauen wir uns an, wie unsere Aktivitätsansicht aussieht, wenn der Tag- und Nachtmodus nacheinander aktiviert ist. Der TextView ändert seine Farbe im Nachtmodus automatisch in Weiß. Das liegt daran, dass der TextView implizit den Standardstil mit dem Namen: ?attr/colorPrimary enthält, der die Farbe je nach hellem/dunklem App-Thema umschaltet. Wenn Sie eine benutzerdefinierte Farbe @color/red auf dem TextView setzen, ändert sie sich nicht zwischen Tag- und Nachtmodi. Die Textfarbe der Toolbar im Tagesmodus ist schwarz. Wie kann man sie in der styles.xml selbst auf weiß setzen?

<style name="AppTheme" parent="Theme.AppCompat.DayNight">
<!-- Passen Sie Ihr Thema hier an. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="android:textColorPrimary">@android:color/white</item>
<item name="android:textColorSecondary">@android:color/white</item>
</style>

Um den aktuellen Nachtmodustyp abzurufen, verwenden wir die Methode AppCompatDelegate.getDefaultNightMode(), die jeweils einen Integer für die zuvor diskutierten Typen zurückgibt. Nachdem wir eine grundlegende Vorstellung davon bekommen haben, lassen Sie uns eine Anwendung erstellen, die:

  • Ressourcen und Styles in Tag-/Nachtmodi anpassen.
  • Das DayNight-Thema aus der Benutzeroberfläche umschalten.
  • Sehen, wie verschiedene UI-Widgets im Nachtmodus aussehen.
Android Night Mode Projektstruktur

Android DayNight Theme Beispielcode

// Code für activity_main.xml

  • Wir haben eine benutzerdefinierte Textfarbe und eine Drawable auf dem ImageView festgelegt.
  • Um verschiedene Farben und Drawables für Tag- und Nachtthemen festzulegen, müssen wir separate Ordner für die Ressourcen erstellen.
  • Die Ressourcen des Tagesmodus befinden sich im Standardverzeichnis.
  • Die Ressourcen des Nachtmodus befinden sich in Ordnern mit Namen, die mit -night enden.
  • Daher haben wir im Projekt die Ordner values-night und drawable-night erstellt.
  • Der Dateiname der Drawable, die Farben und die Stilnamen müssen in beiden Verzeichnissen für die Ressourcen, die Sie im DayNight-Thema umschalten möchten, gleich sein.
  • Wenn die oben genannten Dinge nur in einem der Verzeichnisse definiert sind, wird das Gleiche in Tag- und Nachtthemen verwendet.

// Code für styles.xml in values-Ordner


// Code für styles.xml in values-night-Ordner

Die oben definierten Stile werden verwendet, um das Standard-DayNight-Thema anzupassen. Die entsprechenden Dinge für die colors.xml sind wie folgt definiert.

Code für die MainActivity.java-Klasse

// Code für MainActivity.java

In dem obigen Code verwenden wir den Schalter, um zwischen den Tag- und Nachtmodus-Themen in unserer Anwendung zu wechseln. Wir speichern den aktuellen Modus in einem SharedPreferences-Objekt. WARUM? Das Thema einer Aktivität kann nur einmal festgelegt werden. Daher müssen wir, wenn der Schalter umgeschaltet wird, den neuen Modus in einem SharedPreferences-Objekt speichern.

Entdecken Sie jetzt den Nachtmodus für Ihre Android-App!

Verbessern Sie die Benutzererfahrung mit unserem Cloud-Angebot. Testen Sie kostenlos!

Try for free!