Android开发-软件版本升级与黑暗模式的适配【Android 10】

清疚 2023-01-01 08:55 279阅读 0赞

## 引言 ##

随着时间的发展，Android版本正在不断更新。随着版本更新带来的系统变化，许多旧版本的应用在新版本上不可避免地出现了兼容性的问题，导致使用体验下降甚至无法使用，这时我们需要做的就是软件版本的升级和适配，这篇教程简单地介绍将一个应用升级到安卓10以及适配新特性的过程。

首先是Google官方的操作流程：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70]

这里用我自己的期中项目Notepad举例：  
github地址：[https://github.com/ZeroNinx/AS\_Dev/tree/master/NotePad][https_github.com_ZeroNinx_AS_Dev_tree_master_NotePad]  
它的目标平台是Android 7（N），没有对黑夜模式的支持，背景色是白色，尽管可以跑，但是在安卓10的手机上运行起来是这样的：  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 1][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 2][]

可以看出，原先黑色的字体并不协调，当手机处于黑暗模式的情况下，设置了自定义背景色的菜单却还是白色，如果用户主题为黑色，将会影响观感，因此，我们需要将应用进行适配更新

## 准备工作 ##

1、一部Android10的手机或模拟器  
2、在Android Studio中安装Android10的SDK  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 3][]  
3、【可选】将软件的编译版本和目标版本升级到29/30来确保安卓10的兼容性  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 4][]

## 适配黑暗模式 ##

为了解决黑暗模式的问题，我们首先需要知道安卓10如何分辨是否为黑暗模式，这里Google官方为我们提供了API。  
Google官方文档的介绍：  
[https://developer.android.google.cn/guide/topics/ui/look-and-feel/darktheme][https_developer.android.google.cn_guide_topics_ui_look-and-feel_darktheme]

##### 实现 #####

首先在style.mxl主题继承DayNight主题，我们的就有了适配黑夜主题的能力  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 5]  
既然有了夜间模式主题，那接下来就要针对夜间模式做出适配，表现在字体和背景等方面，这些都和value.xml中的值有关，为了适配黑夜模式，我们要将values文件夹复制一份另存为values-night，成功之后AS的values文件夹下会有普通和night两个选项，我们就可以对这两个文件夹里的xml进行编辑进行不同模式的适配看了。  
![在这里插入图片描述][20201221203139290.png] ![在这里插入图片描述][20201221203407668.png]

在我们需要适配的xml中，需要分别在values和values-night设定不同的值，而且名字要一样，否则会报错，这里改变了之前看起来不自然的主菜单为例，现在不能将android:xxxColor直接硬编码为"\#XXXXX"（颜色代码）了，需要正确改为"@color/xxxxx"，因为硬编码是不会被适配的，例如：

###### lv\_index\_unit.xml ######

<?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:background="@color/colorUnitBackground">
        
    
        <TextView
            android:id="@+id/tv_tag"
            android:layout_width="80dp"
            android:layout_height="15dp"
            android:layout_marginBottom="10dp"
            android:gravity="center"
            android:text="@string/tv_tag"
            android:textSize="12sp"
            android:textStyle="italic"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@+id/tv_text"
            app:layout_constraintStart_toStartOf="parent" />
    
    
        <TextView
            android:id="@+id/tv_title"
            android:layout_width="230dp"
            android:layout_height="30dp"
            android:layout_marginTop="10dp"
            android:gravity="start"
            android:orientation="horizontal"
            android:text="@string/tv_title"
            android:textColor="@color/colorUnitTitle"
            android:textSize="22sp"
            android:textStyle="bold"
            app:layout_constraintStart_toStartOf="@+id/tv_text"
            app:layout_constraintTop_toTopOf="parent" />
            
    
        <TextView
            android:id="@+id/tv_text"
            android:layout_width="190dp"
            android:layout_height="40dp"
            android:layout_marginStart="10dp"
            android:layout_marginTop="5dp"
            android:gravity="start"
            android:text="@string/tv_text"
            android:textColor="@color/colorUnitText"
            android:textSize="12sp"
            app:layout_constraintStart_toEndOf="@+id/iv_icon"
            app:layout_constraintTop_toBottomOf="@+id/tv_title" />
            
        
        <TextView
            android:id="@+id/tv_time"
            android:layout_width="100dp"
            android:layout_height="15dp"
            android:layout_marginEnd="10dp"
            android:layout_marginBottom="20dp"
            android:gravity="end|center_vertical"
            android:text="@string/tv_time"
            android:textSize="12sp"
            android:textStyle="italic"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent" />
    
        <ImageView
            android:id="@+id/iv_remove"
            android:layout_width="35dp"
            android:layout_height="35dp"
            android:layout_marginEnd="30dp"
            android:layout_marginBottom="10dp"
            android:contentDescription="@string/iv_remove"
            app:layout_constraintBottom_toTopOf="@+id/tv_time"
            app:layout_constraintEnd_toEndOf="parent"
            app:srcCompat="@drawable/icon_delete" />
    
        <ImageView
            android:id="@+id/iv_icon"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_marginStart="15dp"
            android:layout_marginTop="10dp"
            android:contentDescription="@string/iv_remove"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/icon_notepad" />
    
        <TextView
            android:id="@+id/tv_id"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#00FF0000"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
    </androidx.constraintlayout.widget.ConstraintLayout>

###### activity\_notepad.xml ######

<?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        tools:context=".ActivityNotepad">
    
        <ScrollView
            android:id="@+id/sv"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#FFFFFF"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.0">
    
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/colorNotepadBackground"
                android:orientation="vertical">
                
    
                <EditText
                    android:id="@+id/tv_title"
                    android:layout_width="match_parent"
                    android:layout_height="60dp"
                    android:layout_margin="10dp"
                    android:autofillHints=""
                    android:ems="10"
                    android:fontFamily="sans-serif-black"
                    android:gravity="start"
                    android:hint="@string/et_title_hint"
                    android:inputType="textPersonName"
                    android:textColor="@color/colorNotepadTitle"
                    android:textSize="30sp" />
                    
    
                <com.example.notepad.MultilineTextEditWithUnderLine
                    android:id="@+id/et_text"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:background="@null"
                    android:gravity="start"
                    android:hint="@string/et_text_hint"
                    android:letterSpacing="0.03"
                    android:lineSpacingMultiplier="1.5"
                    android:maxLines="30"
                    android:minLines="20"
                    android:textColor="@color/colorNotepadText"
                    android:textSize="18sp" />
                    
            </LinearLayout>
        </ScrollView>
    
    </androidx.constraintlayout.widget.ConstraintLayout>

###### 更改values/color.xml（白天模式） ######

<?xml version="1.0" encoding="utf-8"?>
    <resources>
        <color name="colorPrimary">#6200EE</color>
        <color name="colorPrimaryDark">#3700B3</color>
        <color name="colorAccent">#03DAC5</color>
    
        <color name="colorUnitBackground">#CCCCFF</color>
        <color name="colorUnitTitle">#000000</color>
        <color name="colorUnitText">#111111</color>
        <color name="colorNotepadBackground">#FFFFFF</color>
        <color name="colorNotepadTitle">#000000</color>
        <color name="colorNotepadText">#111111</color>
    </resources>

###### 更改values-night/color.xml（黑夜模式） ######

<?xml version="1.0" encoding="utf-8"?>
    <resources>
        <color name="colorPrimary">#6200EE</color>
        <color name="colorPrimaryDark">#3700B3</color>
        <color name="colorAccent">#03DAC5</color>
    
        <color name="colorUnitBackground">#555555</color>
        <color name="colorUnitTitle">#FFFFFF</color>
        <color name="colorUnitText">#EEEEEE</color>
        <color name="colorNotepadBackground">#777777</color>
        <color name="colorNotepadTitle">#FFFFFF</color>
        <color name="colorNotepadText">#EEEEEE</color>
    </resources>

可以看出，AS默认的白天模式和在黑夜模式的手机上表现出了不一样的效果，这是系统自己适配的，图标的适配也一样，使用动态编码替换黑白两种图标，就能更加适配主题。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 6][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 7][]

最后，在Java代码里来获取夜间模式的开启状态，便于我们动态做出更多选择。

//配置当前模式
        protected void configTheme()
        {
        
            //选择当前的主题模式
            int currentNightMode = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
            switch (currentNightMode) {
        
                case Configuration.UI_MODE_NIGHT_NO:
                    // 夜间模式未开启
    
                    break;
                case Configuration.UI_MODE_NIGHT_YES:
                    // 夜间模式已开启
    
                    break;
            }
        }

至此，简单的迁移和适配已经结束，更多API可以参阅Google官方文档。

原文链接：[https://blog.csdn.net/zwq939681378/article/details/111469662][https_blog.csdn.net_zwq939681378_article_details_111469662]  
作者：朱蔚钦

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70]: /images/20221120/0b99e127a38e4664a1c12d8b426d5653.png
[https_github.com_ZeroNinx_AS_Dev_tree_master_NotePad]: https://github.com/ZeroNinx/AS_Dev/tree/master/NotePad
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20201221205459209.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 2]: /images/20221120/1ab406818e664d2ab85bd102910da8ca.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 3]: /images/20221120/6eb37c5aa8ee496298561a7c1c089d8b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 4]: /images/20221120/16ec94dba25a474292207389e3e425f0.png
[https_developer.android.google.cn_guide_topics_ui_look-and-feel_darktheme]: https://developer.android.google.cn/guide/topics/ui/look-and-feel/darktheme
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 5]: /images/20221120/cf114bbc694349bc8c4de1779d08dc8c.png
[20201221203139290.png]: https://img-blog.csdnimg.cn/20201221203139290.png
[20201221203407668.png]: /images/20221120/571f1fda007643fd92002ca25010c25e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 6]: https://img-blog.csdnimg.cn/20201221205058319.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3p3cTkzOTY4MTM3OA_size_16_color_FFFFFF_t_70 7]: /images/20221120/69e0e28ca79b4a5d829ec79435b1ee15.png
[https_blog.csdn.net_zwq939681378_article_details_111469662]: https://blog.csdn.net/zwq939681378/article/details/111469662