0

0

0

修罗

站点介绍

只有了解事实才能获得真正的自由

如何实现应用深色模式功能

修罗 2023-01-05 240 0条评论 安卓

首页 / 正文

如何实现应用深色模式功能

核心原理

就是就尽可能的使用Material Design提供的组件,这样他就会应用默认的颜色,例如:使用了Material Design的Button,他会有默认的背景颜色,默认的文本颜色,默认的点击水波颜色,这样不同的颜色对应不同的属性,而深色模式只需要重新定义这些名词的颜色就行了;这样预定义颜色称为主题颜色系统(这里能查看默认有那些命名颜色属性,以及默认值是什么,用到那个位置),当然也可以自定义属性,然后针对白天,夜间设置不同的颜色;在官方深色适配实例文档能看到一个实例,能很方便的看到那个名称的颜色应用到哪里。

大体步骤

这是Google官方深色模式文档

继承指定主题

继承Theme.MaterialComponents.DayNight,新版本Android Studio创建的项目默认就是继承他。

定义不同的颜色值

分别在values/themes.xml,values-night/themes.xml,对不同名称的颜色设置不同值,例如:android:colorBackground 是所有根布局的背景色;

1.在两种主题分别重新定义根布局颜色

1689585227763.png

2.查看当前效果

1689585383154.png

3.切换深色模式

1689585400885.png

4.查看深色模式效果

1689585420587.png

如果用自定义控件可能不会自动使用,可以手动指定使用该名称的颜色,然后就是根据名称,设置不同的颜色,例如白条为红色,夜间设置为蓝色,这样就完成了背景色适配了,控件中手动引用如下:

android:background="?android:attr/colorBackground"

状态栏

不同系统版本的状态栏处理是比较麻烦的事情,所以这里使用QMUI框架中的StatusBarUtils工具类设置:

if (SuperDarkUtil.isDark(this)) {
    //状态栏文字白色
    QMUIStatusBarHelper.setStatusBarDarkMode(this);
}else{
    //状态栏文字黑色
    QMUIStatusBarHelper.setStatusBarLightMode(this);
}

是否是深色模式

/**
 * 深色模型工具类
 */
public class SuperDarkUtil {
    /**
     * 是否是深色模式
     */
    public static boolean isDark(Context context) {
        return (context.getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK) == Configuration.UI_MODE_NIGHT_YES;
    }
}

非矢量图

在drawable-xxhdpi,drawable-night-xxhdpi分别放白天和夜间模式图片,名称一样。

评论(0)


最新评论

  • 1

    1

  • 1

    1

  • -1' OR 2+158-158-1=0+0+0+1 or 'TKCTZnRa'='

    1

  • 1

    1

  • 1

    1

  • 1

    1

  • 1

    1

  • @@5Qa2D

    1

  • 1

    1

  • 1

    1

日历

2025年09月

 123456
78910111213
14151617181920
21222324252627
282930    

文章目录

推荐关键字: Linux webpack js 算法 MongoDB laravel JAVA jquery javase redis