Mode Diablo? Vague d'adaptation Android

Préface

Pour être un excellent développeur Android, vous avez besoin d'un  système de connaissances complet

Ici, grandissons ensemble comme nous le pensions ~.

La première fois que j'ai entendu le mode sombre, c'était tellement cool et ça avait l'air bien (je ne sais pas comment je l'ai entendu). Apple a eu les rumeurs du mode sombre au cours des dernières années. Il semble qu'il ait été introduit dans IOS11 et IOS12. Le résultat a été que le mode sombre n'a été lancé qu'après IOS13. Cela fait six mois depuis le lancement d'IOS13, et l'application système n'a pas été considérée comme parfaite. Les applications tripartites ont également pris en charge le mode sombre. Même WeChat a mis en œuvre le mode sombre dans la mise à jour de la période précédente. Profitons d'abord de WeChat. Mode Diablo maintenant!

[Le transfert d'image de la chaîne externe a échoué, le site source peut avoir un mécanisme de chaîne antivol, il est recommandé d'enregistrer l'image et de la télécharger directement (img-mboeEzXw-1587030640276) (https://upload-images.jianshu.io/upload_images/21584612-4eeafc233ed6dc0e.png ? imageMogr2 / auto-orient / strip% 7CimageView2 / 2 / w / 1240)]

Texte

Depuis qu'Apple a implémenté le mode Diablo, Android ne doit pas tomber, donc le mode Diablo est pris en charge dans Android 10 (Q API niveau 29), mais le nom officiel est Dark theme, toute traduction est très bien, jetons un coup d'œil Définition du mode sombre:

[Le transfert d'image de la chaîne externe a échoué, le site source peut avoir un mécanisme de chaîne antivol, il est recommandé d'enregistrer l'image et de la télécharger directement (img-KczTViEE-1587030640279) (https://upload-images.jianshu.io/upload_images/21584612-152313aa7b973121.png ? imageMogr2 / auto-orient / strip% 7CimageView2 / 2 / w / 1240)]

Voici pas de traduction ligne par ligne, principalement pour parler des avantages du mode sombre:

• La plupart des écrans de téléphones portables ont été mis à niveau vers des écrans OLED (bien sûr, certains téléphones portables sont toujours des écrans LCD) .Lorsque l'écran OLED s'affiche en noir, il n'émet pas de lumière, ce qui peut réduire considérablement la consommation d'énergie.
• Améliorez la visibilité des utilisateurs amblyopes et des utilisateurs sensibles à une forte lumière.
• Facilitez l'utilisation de l'appareil dans un environnement sombre.

Pas grand-chose à dire sur la façon d'activer le mode sombre. Différents fabricants de téléphones mobiles ont différentes façons d'activer. Parfois, le système modifié par magie du principal fabricant de téléphones mobiles ne peut pas vraiment trouver où le régler, alors Baidu.

Définir un thème sombre

Afin de prendre en charge le thème sombre, le thème appliqué doit être défini pour hériter du DayNightthème (res / values ​​/ styles.xml):

<style name="AppTheme" parent="Theme.AppCompat.DayNight">

Vous pouvez également utiliser le thème sombre de MaterialComponents :

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">

Cela associera le thème principal de l'application au logo du mode nuit contrôlé par le système et fournira à l'application un thème sombre par défaut (lorsqu'il est activé). Lorsque le thème du système est changé, l'application change également de thème en conséquence.

"C'est fini?"

"Oui, le thème est défini."

"Et si je veux personnaliser le thème?"

Tout le monde doit avoir ce type de demande dans le développement quotidien. Le thème officiellement défini ne répond pas pleinement à nos besoins. Pour le moment, nous devons personnaliser le thème. Google a également pensé à cela pour nous. En mode normal, nous n'avons pas besoin de bouger, comment écrire comment écrire, puis créer un nouveau dossier values-night sous res, puis y mettre votre custom, le nom devient le nom du thème correspondant dans styles.xml D'accord. Jetez un oeil:

Ce paramètre est OK.

"Non, c'est juste que le thème a changé. Que dois-je faire avec l'arrière-plan, les couleurs de police, les images, etc. de mon activité?"

"Ne t'inquiète pas, je vais en parler ensuite."

Il est important de noter ici que les thèmes et les styles doivent éviter d'utiliser des couleurs ou des icônes codées en dur sous des thèmes de couleur claire, et doivent utiliser des attributs de thème (préférés) ou des ressources limitées la nuit. Venez comprendre les deux attributs de thème les plus importants suivants:

• ?android:attr/textColorPrimaryIl s'agit d'une couleur de texte universelle. Le thème clair est presque noir et le thème sombre est presque blanc. Il contient un état désactivé.
• ?attr/colorControlNormalCouleur d'icône universelle. Il contient un état désactivé.

Bien sûr, il n'est certainement pas nécessaire d'utiliser les deux attributs de thème fournis par le fonctionnaire ci-dessus, si vous souhaitez personnaliser, vous pouvez le personnaliser! Vous avez peut-être vu les yeux perçants. Dans les valeurs de nuit dans l'image ci-dessus, en plus de style.xml, il y a colors.xml, oui, oui, nous avons seulement besoin de mettre les informations de couleur dans colors.xml et ensuite selon les besoins Écrivez simplement en deux couleurs.

Cependant, il est toujours recommandé d'utiliser les composants Material Design car son système de thème de couleur (tels que les attributs de thème ?attr/colorSurfaceet ?attr/colorOnSurface) peut facilement accéder aux couleurs appropriées.

"Frère, je sais comment changer la couleur d'arrière-plan et la couleur de la police. Qu'en est-il des images? Quelles sont les images!"

"Viens ici, les singes sont inquiets!"

Le paramètre d'image est en fait similaire à la couleur, et il s'agit également de deux ensembles de ressources. Par exemple, il y a une image de aaa.jpg dans votre dossier de dessin. Si vous voulez appeler une autre image en mode sombre, vous pouvez créer un nouveau dessin de nuit Dossier, mettez simplement une autre photo de vous à l'intérieur. Notez que le nom de la photo doit correspondre au dessin. De même, drawable-xhdpi et drawable-xxhdpi doivent créer deux autres dossiers: drawable-night-xhdpi, drawable-night-xxhdpi, puis insérer les images correspondantes.

"Quoi? Voudriez-vous voir l'effet? Eh bien, comme vous le souhaitez, c'est vraiment vous. Je ne le laisserais pas regarder si quelqu'un d'autre ..."

Comment l'effet est-il correct?

Thème de modification dans l'application

"Je veux toujours passer de ma propre initiative, et je ne veux pas changer avec le système"

"Viens, viens ici, que veux-tu faire d'autre, dis, viens viens, dis-le"

"Je veux choisir de changer de thème selon le système volontairement ... Je pense que de nombreuses applications ont cette fonction"

Hé, puisque tu as demandé du fond du cœur, alors je vais te dire avec compassion: bien sûr!

En général, l'application propose plusieurs options: mode normal, mode sombre et système de suivi, non?

Google nous a également donné ces options, qui peuvent être définies directement:

• LumièreMODE_NIGHT_NO
• Sombre- MODE_NIGHT_YES
• Défini par le mode d'économie d'énergie- MODE_NIGHT_AUTO_BATTERY
• Préréglage du système MODE_NIGHT_FOLLOW_SYSTEM

Nous venons de parler des paramètres prédéfinis de lumière, d'obscurité et de système. Le mode d'économie d'énergie n'est pas écrit ici.

La méthode de changement de thème est également très simple, il suffit d'appeler la méthode suivante:

AppCompatDelegate.setDefaultNightMode()

Une seule ligne de code, les paramètres doivent être passés dans l'un des quatre modes ci-dessus.

Allez, puis écrivez le code, écrivez trois boutons selon les exigences ci-dessus, pour atteindre respectivement le mode normal, le mode sombre et le mode système:

   override fun onClick(v: View) {
        when(v.id){
            R.id.btnLight ->{
                setDefaultNightMode(MODE_NIGHT_NO)
            }
            R.id.btnDark ->{
                setDefaultNightMode(MODE_NIGHT_YES)
            }
            R.id.btnDefault ->{
                setDefaultNightMode(MODE_NIGHT_FOLLOW_SYSTEM)
            }
        }
    }

Ce code ne devrait plus avoir besoin d'être expliqué, assez est expliqué ci-dessus. Jetons un coup d'œil à l'effet:

Changements de configuration

"Frère, j'ai repensé. Si certaines pages lisent de la vidéo, que dois-je faire si je veux retarder les changements de configuration?"

"Allez, tu viens vers le petit frère, et tu amuses le frère aîné à jouer? Ce jour!"

Allez, il faut une implémentation. Google y a déjà pensé. L'application peut uiModegérer l'implémentation du thème Dark lui-même en déclarant que chaque Activité peut gérer les changements de configuration:

<activity
    android:name=".MyActivity"
    android:configChanges="uiMode" />

Lorsque Activity déclare qu'il gère les modifications de configuration, onConfigurationChanged()ses méthodes seront appelées lorsque le thème change.

Pour vérifier le thème actuel, l'application peut exécuter le code suivant:

val currentNightMode = configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK
when (currentNightMode) {
    Configuration.UI_MODE_NIGHT_NO -> {} // 夜间模式未启用，我们正在使用浅色主题
    Configuration.UI_MODE_NIGHT_YES -> {} // 夜间模式启用，我们使用的是深色主题  
}

Résumé

L'article est essentiellement ici. Google nous dit de ne pas coder en dur autant que possible. Il est nécessaire de le renvoyer quand il sortira. Le codage en dur est cool pendant un certain temps, le codage en dur a toujours été cool, hahaha.