Android更换默认主题

相信刚接触Android开发的同学都很熟悉这个界面。

这是Android Studio创建新项目后，默认的Empty Activity的布局。

不知道有多少同学和我一样觉得App标题和头顶状态栏的紫色很丑。今天的笔记就是记录一下怎么修改主题颜色。

一、找到主题文件

我们打开项目的AndroidManifest.xml，可以看到有一行是用来指定主题的。

从这一句可以看出，我们的主题是通过@style资源来指定的。资源路径就在res/values下，名为themes.xml。

如果通过ctrl+左键跳转，会发现有两个。这是因为还有一个是深色主题，在res/values-night目录下也有一个themes.xml。

二、解析主题文件内容

在郭霖老师的《第一行代码》中也有提到更换主题颜色，书中的文件内容是这样的：

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
</resources>

郭霖老师在书中给出了各个属性代表的位置。这里引用一下Android Material设计图的Color说明。

也就是说，在原来的文件里，各个属性的含义大致如下：

属性名	代表位置
colorPrimary	操作栏背景。this is the color applied to the action bar background.
colorPrimaryDark	状态栏和导航栏背景。this is the color applied to the status bar and navigation bar.
colorAccent	控件背景。this is the color applied to framework controls.

而现在的文件内容是这样的

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.Graduation" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/purple_200</item>
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/black</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_200</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

首先我们可以看到，style的parent是不一样的。这里的parent是Theme.MaterialComponents.DayNight.DarkActionBar。

这里简单介绍一下MaterialComponents。MaterialComponents是Google官方设计团队发布了基于 Material Design 的组件库，是为了让我们开发的程序有一个统一的样式、品牌效应、互动效果以及操作界面产生的动作，是在Android原生组件的基础上添加了更加丰富的功能和显示效果，遵循Android界面设计的规范，能够更方便的设计产品，缩短开发设计时间。

那这些属性的含义如下：

属性名	含义
colorPrimary	您的应用的主要品牌颜色，主要用于主题
colorPrimaryVariant	您的主要品牌颜色的较浅/较暗变体，在主题中很少使用
colorOnPrimary	用于显示在原色上方的元素的颜色（例如，文本和图标，根据可访问性，通常为白色或半透明的黑色）
colorSecondary	您应用程式的次要品牌色彩，主要用于强调某些需要突出的小部件
colorSecondaryVariant	您的次要品牌颜色的较浅/较深变体，在主题中很少使用
colorOnSecondary	用于显示在辅助颜色顶部的元素的颜色

最后一个android:statusBarColor就是系统里的状态栏颜色了，这里状态栏颜色定义了和colorPrimaryVariant一致。

三、更改主题颜色

更改主题颜色的方法很简单，他们定义主题颜色的方式都是通过@color调用，所以只需要将你想要的颜色定义到res/colors里再调用即可。

例如，我这样改：

        <item name="colorPrimary">@color/teal_200</item>
        <item name="colorPrimaryVariant">@color/white</item>
        <item name="colorOnPrimary">@color/white</item>

这里我把主题颜色改成了薄荷绿，状态栏颜色改成了白色。

效果如下：

1、修改状态栏文字颜色

上面的效果我们会发现一个问题。当状态栏被我设置为白色之后，状态栏上的文字因为也是白色所以看不见了。这时候我们就需要去修改一下状态栏文字的颜色。这里提供Google原生的改变状态栏颜色的方法：

public static void setStatusWordColor(Activity activity, boolean dark) {
        View decorView = activity.getWindow().getDecorView();
        if (dark) {
            decorView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
        } else {
            decorView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
        }
    }

本质就是decorView两个标志位的切换。

然后在onCreate里调用一下

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        ThemeUtil.setStatusWordColor(this, true)
    }

现在就好了

2、删除标题栏

现在的app很少会有上方这个标题栏。要删除这个标题栏也很简单，只需要在onCreate()里加入这样一句话

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        supportRequestWindowFeature(Window.FEATURE_NO_TITLE)  //去除标题栏
        setContentView(R.layout.activity_main)
        ThemeUtil.setStatusWordColor(this, true)
    }

现在就没有标题栏了。

如果整个app里所有的Activity都不想要这个标题栏的话，那么我们还可以统一设置一下。

在之前找到的res/values/theme.xml中，我们有提到style的parent是Theme.MaterialComponents.DayNight.DarkActionBar。

这里就可以看到系统默认是选的有ActionBar的模板，我们只需要换成没有ActionBar的，那么整个App的Activity就都没有标题栏了。

<style name="Theme.Graduation" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    ...
</style>

四、小结

本篇笔记记录了文件主题的属性含义，如何修改主题颜色，如何修改状态栏文字颜色，如何删除标题栏。希望能对大家有一点帮助。

参考文章：

Android透明状态栏与状态栏文字颜色更改 - 简书 (jianshu.com)

【译】为Android设置Material Components主题 - 简书 (jianshu.com)

Material Components(MDC)简单使用介绍_fallinux的博客-CSDN博客_material-components-android