Skip to content

从Material 2迁移到Material 3

Android Studio 中提供模板创建的项目或是以前开发的项目基本上都是 Material 2
但是其实可以将其升级到更加好看的 Material 3

更改全局主题样式

打开 res/values 文件夹,编辑 theme.xml 文件

  • theme.xml
    将高亮行中 parent 的值更改为 Theme.Material3.DayNight.NoActionBar
xml
<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Base.Theme.Nav" parent="Theme.Material3.DayNight.NoActionBar">
        <!-- Customize your light theme here. -->
        <!-- <item name="colorPrimary">@color/my_light_primary</item> -->
    </style>

    <style name="Theme.Nav" parent="Base.Theme.Nav" />
</resources>
  • theme.xml(night)
    将高亮行中 parent 的值更改为 Theme.Material3.Dark.NoActionBar
xml
<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Base.Theme.Nav" parent="Theme.Material3.Dark.NoActionBar">
        <!-- Customize your dark theme here. -->
        <!-- <item name="colorPrimary">@color/my_dark_primary</item> -->
    </style>
</resources>

修复系统状态&导航栏颜色Bug

打开 res/values 文件夹,编辑 theme.xml 文件

  • theme.xml
    添加绿色高亮行部分代码
xml
<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Base.Theme.Nav" parent="Theme.Material3.DayNight.NoActionBar">
        <!-- Customize your light theme here. -->
        <!-- <item name="colorPrimary">@color/my_light_primary</item> -->
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:windowLightStatusBar">true</item>
        <item name="android:navigationBarColor">@android:color/transparent</item>
        <item name="android:windowLightNavigationBar">true</item>
    </style>

    <style name="Theme.Nav" parent="Base.Theme.Nav" />
</resources>
  • theme.xml(night)
    添加绿色高亮行部分代码
xml
<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Base.Theme.Nav" parent="Theme.Material3.Dark.NoActionBar">
        <!-- Customize your dark theme here. -->
        <!-- <item name="colorPrimary">@color/my_dark_primary</item> -->
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:windowLightStatusBar">false</item>
        <item name="android:navigationBarColor">@android:color/transparent</item>
        <item name="android:windowLightNavigationBar">false</item>
    </style>
</resources>