相信刚接触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说明。

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

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

<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界面设计的规范，能够更方便的设计产品，缩短开发设计时间。

那这些属性的含义如下：

最后一个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