Android主题切换—夜间/白天模式探究

最新推荐文章于 2025-07-11 10:45:14 发布

Sunzxyong

最新推荐文章于 2025-07-11 10:45:14 发布

阅读量8.7k

点赞数 8

CC 4.0 BY-SA版权

分类专栏：插件化开发与项目架构文章标签： android 主题切换夜间白天模式 style

本文链接：https://blog.youkuaiyun.com/u010687392/article/details/48088571

本文探讨了Android应用中实现夜间和白天模式切换的原理与方法，包括如何定义白天和夜间主题，以及如何通过代码动态切换。文章还提到了在不同界面中应用主题切换的策略，并给出了具体的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

现在市面上众多阅读类App都提供了两种主题：白天or夜间。
这里写图片描述

这里写图片描述

上述两幅图片，正是两款App的夜间模式效果，所以，依据这个功能，来看看切换主题到底是怎么实现的（当然现在github有好多PluginTheme开源插件，很多时候可以使用这些插件，不过我并不想讲怎么用那些插件，正所谓会用轮子还不如会造轮子）。

关于更换主题和换肤

这里提到是做换主题功能，当然与之类似的就是换肤，换肤现在比较流行的是采用插件化动态加载技术来实现的，这样可以起到热插拔作用，需要皮肤时候用户自主的在网上下载便是了，不用皮肤时便删了皮肤插件包而不会影响宿主App的功能，这样就不必把一大堆皮肤图片放在本地而增加apk的大小，关于用插件化实现换肤功能这仅仅是插件化技术的冰山一角，关于插件化技术更多的作用，可以看看360前两天开源的 DroidPlugin插件框架、OpenAltas框架、还有主席的DL框架。

好了，言归正传，现在我们需要实现的是主题切换功能，关于主题切换其实是切换整个App的颜色风格、排版风格、字体风格等，其中并不会有过多的图片资源的切换，如有过多的图片的更换那就是换肤的功能了。
现在我们要实现夜间/白天模式的切换功能，如下效果图：
这里写图片描述

可以看到上面的效果正是夜间和白天两种模式的切换功能，切换至夜间模式时整个App的背景色、字体颜色、按钮颜色、标题栏颜色等全部需要切为夜间模式的颜色，当切回白天模式又切回原来的颜色，来看看怎么做的？

实现主题切换

首先就是需要在app中准备两套主题：

白天主题

<resources>

    <style name="DayTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">#03A9F4</item>
        <item name="android:textColorPrimary">#ffffff</item>
        <item name="android:windowBackground">@color/background_material_light</item>
        <item name="colorAccent">#00BCD4</item>
        <item name="colorControlNormal">#00BCD4</item>

        <item name="titleStyle">@style/DayTitleStyle</item>
        <item name="contentStyle">@style/DayContentStyle</item>
        <item name="buttonBg">#2196F3</item>
        <item name="buttonTextColor">#ffffff</item>
        <item name="checkTextColor">#2196F3</item>
        <item name="switchTextColor">#2196F3</item>
    </style>

    <style name="DayTitleStyle">
        <item name="android:textColor">#212121</item>
        <item name="android:textSize">20sp</item>
        <item name="android:layout_margin">8dp</item>
    </style>

    <style name="DayContentStyle">
        <item