三步实现Android应用内一键换肤，无需重启应用，无需编写多余代码

最新推荐文章于 2024-09-22 07:02:23 发布
最新推荐文章于 2024-09-22 07:02:23 发布
阅读量2.9k 收藏 38
点赞数 10
分类专栏： android 文章标签： android 一键换肤 skin-support
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36270361/article/details/115733971
版权

古人学问无遗力，少壮工夫老始成。
纸上得来终觉浅，绝知此事要躬行。 --《冬夜读书示子聿》 · 陆游

换肤效果演示

四种皮肤切换：默认白色、蓝色、绿色和玫瑰红：

在这里插入图片描述

前言

先给大家介绍一下现在比较主流的、Star比较多的换肤框架：

而我这篇文章讲的是基于Android-skin-support框架实现的Android应用内换肤，在此非常感谢这个换肤框架的作者，因为他的默默付出，使我们的开发更加简单快捷，而且这个换肤框架的功能非常强大：支持应用内换肤、插件式换肤（包括zip包资源换肤），学习成本低，快速上手，代码侵入性低还有最重要的用户体验极佳。

如何实现一键换肤？

下面内容是基于上面演示的demo：
使用的布局是android.support.constraint.ConstraintLayout
使用的控件有 ImageView、TextView、Button、RecyclerView、AlertDialog、RadioGroup和RadioButton：
在这里插入图片描述
layout文件示例：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/window_bg"
    tools:context=".MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_marginTop="14dp"
        android:layout_marginEnd="14dp"
        android:src="@drawable/dragon_ic"/>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:drawableEnd="@drawable/skin_ic"
            android:textColor="@color/textColor"
            android:textSize="28sp"
            android:textStyle="bold"
            android:text="@string/current_skin_text"/>

        <TextView
            android:id="@+id/tv_show"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="40dp"
            android:background="@drawable/input_bg"
            android:gravity="start|center_vertical"
            android:paddingStart="20dp"
            android:paddingEnd="0dp"
            android:textColor="@color/textColor"
            android:textSize="22sp"
            android:textStyle="bold"/>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/rv_bts"
            android:layout_width="420dp"
            android:layout_height="wrap_content"
            android:overScrollMode="never"/>

        <Button
            android:id="@+id/bt_switch_skin"
            android:layout_width="400dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="14dp"
            android:background="@drawable/button_selector"
            android:textColor="@android:color/black"
            android:textSize="22sp"
            android:textStyle="bold"
            android:text="@string/switch_skin_text"/>
    </LinearLayout>

</android.support.constraint.ConstraintLayout>

item_button.xml

<?xml version="1.0" encoding="utf-8"?>
<Button
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/bt_item"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="14dp"
    android:background="@drawable/button_selector"
    android:textColor="@android:color/black"
    android:textSize="22sp"
    android:textStyle="bold"/>

view_dialog.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/window_bg"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:gravity="center"
        android:background="@drawable/title_bg"
        android:textColor="@android:color/white"
        android:textSize="26sp"
        android:textStyle="bold"
        android:text="@string/dialog_title"/>

    <RadioGroup
        android:id="@+id/rg_skin_check"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@id/tv_title"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_marginTop="20dp"
        android:orientation="vertical">

        <RadioButton
            android:id="@+id/rb_blue"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableEnd="@drawable/rect_blue"
            android:drawablePadding="8dp"
            android:paddingStart="15dp"
            android:paddingEnd="0dp"
            android:textColor="@color/blue_skin_color"
            android:textSize="22sp"
            android:textStyle="bold"
            android:text="@string/blue_skin"/>

        <RadioButton
            android:id="@+id/rb_green"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableEnd="@drawable/rect_green"
            android:drawablePadding="8dp"
            android:layout_marginTop="10dp"
            android:paddingStart="15dp"
            android:paddingEnd="0dp"
            android:textColor="@color/green_skin_color"
            android:textSize="22sp"
            android:textStyle="bold"
            android:text="@string/green_skin"/>

        <RadioButton
            android:id="@+id/rb_rose_red"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableEnd="@drawable/rect_rose_red"
            android:drawablePadding="8dp"
            android:layout_marginTop="10dp"
            android:paddingStart="15dp"
            android:paddingEnd="0dp"
            android:textColor="@color/rose_red_skin_color"
            android:textSize="22sp"
            android:textStyle="bold"
            android:text="@string/rose_red_skin"/>

        <RadioButton
            android:id="@+id/rb_default"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            android:layout_marginTop="10dp"
            android:paddingStart="15dp"
            android:paddingEnd="0dp"
            android:textColor="@android:color/black"
            android:textSize="22sp"
            android:textStyle="bold"
            android:text="@string/default_skin"/>


    </RadioGroup>

</android.support.constraint.ConstraintLayout>
  • 导入
    demo中用到了android.support.constraint.ConstraintLayout，添加以下依赖：
    implementation 'skin.support:skin-support:3.1.4'
    implementation 'skin.support:skin-support-constraint-layout:3.1.4'

如果用到了material design控件或者CardView v7 控件可以添加下面依赖：

implementation 'skin.support:skin-support-design:3.1.4'            // skin-support-design material design 控件支持
implementation 'skin.support:skin-support-cardview:3.1.4'          // skin-support-cardview CardView 控件支持
  • 初始化
    如果项目中没有Application，可以新建Application，在onCreate()方法中初始化：
    @Override
    public void onCreate() {
        super.onCreate();
        SkinCompatManager.withoutActivity(this)
                .addInflater(new SkinConstraintViewInflater())
                .loadSkin();
     }

如果用到了material design控件或者CardView v7 控件，可以这样写：

    SkinCompatManager.withoutActivity(this)                         // 基础控件换肤初始化
            .addInflater(new SkinMaterialViewInflater())            // material design 控件换肤初始化[可选]
            .addInflater(new SkinConstraintViewInflater())          // ConstraintLayout 控件换肤初始化[可选]
            .addInflater(new SkinCardViewInflater())                // CardView v7 控件换肤初始化[可选]              
            .loadSkin();

项目中的Activity如果继承AppCompatActivity，需要重载getDelegate()方法：

    @NonNull
    @Override
    public AppCompatDelegate getDelegate() {
        return SkinAppCompatDelegateImpl.get(this, this);
    }
  • 最重要的一步，也是比较繁琐，准备皮肤包。 应用内换肤，皮肤名为: blue、green、rosered, 新增需要换肤的资源添加上面三种后缀，如图所示：在这里插入图片描述

如何新建皮肤资源？

右键app选择New -> Folder -> Res Folder
在这里插入图片描述
改变Res Folder路径，新建res-green和res-rosered同理：
在这里插入图片描述

三个换肤资源新建完成之后，在build.gradle中检查一下：

sourceSets {
        main {
            res.srcDirs = ['src/main/res', 'src/main/res-blue', 'src/main/res-green', 'src/main/res-rosered']
        }
    }

将各皮肤的资源文件复制进相应的文件夹，举例子：
默认的res文件夹：
在这里插入图片描述

新建的res-blue文件夹：
在这里插入图片描述
看到上面的区别了吗？基本上layout文件用到的drawable，需要换肤的都要加上相应皮肤资源名字的后缀！
还有res-blue下的colors，需要改变颜色的也要加上相应皮肤资源名字的后缀！
在这里插入图片描述

在这里插入图片描述
与res下的colors对比：
在这里插入图片描述
在这里插入图片描述

res-green和res-rosered皮肤资源准备步骤跟上面一致，就不再详细描述了。
在这里插入图片描述

  • 最后一步！一键换肤！

demo示例，加载皮肤资源：

            switch (checkedId) {
                    case R.id.rb_blue:
                        SkinCompatManager.getInstance()
                                .loadSkin("blue", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
                        skin = "蓝色";
                        break;

                    case R.id.rb_green:
                        SkinCompatManager.getInstance()
                                .loadSkin("green", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
                        skin = "绿色";
                        break;

                    case R.id.rb_rose_red:
                        SkinCompatManager.getInstance()
                                .loadSkin("rosered", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
                        skin = "玫瑰红";
                        break;

                    case R.id.rb_default:
                        SkinCompatManager.getInstance().restoreDefaultTheme();
                        break;

                    default:break;
                }

最后贴上MainActivity代码，仅供参考：

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.tv_show)
    TextView mTvShowText;
    @BindView(R.id.rv_bts)
    RecyclerView mRvBts;

    private String inputText = "";
    private AlertDialog mAlertDialog;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
        init();
    }

    private void init() {
        final List<ViewBean> viewBeans = new ArrayList<>();
        viewBeans.add(new ViewBean("A"));
        viewBeans.add(new ViewBean("B"));
        viewBeans.add(new ViewBean("C"));
        viewBeans.add(new ViewBean("D"));
        viewBeans.add(new ViewBean("E"));
        viewBeans.add(new ViewBean("F"));
        viewBeans.add(new ViewBean("1"));
        viewBeans.add(new ViewBean("0"));
        viewBeans.add(new ViewBean("清空"));
        ViewBeanAdapter viewBeanAdapter = new ViewBeanAdapter(R.layout.item_button, viewBeans);
        mRvBts.setLayoutManager(new GridLayoutManager(this, 3));
        mRvBts.setAdapter(viewBeanAdapter);
        viewBeanAdapter.setOnItemClickListener(new BaseQuickAdapter.OnItemClickListener() {
            @Override
            public void onItemClick(BaseQuickAdapter adapter, View view, int position) {
                if (position == 8) {
                    inputText = "";
                    mTvShowText.setText(inputText);
                    return;
                }
                String text = viewBeans.get(position).getName();
                inputText += text;
                mTvShowText.setText(inputText);
            }
        });

        mAlertDialog = new AlertDialog.Builder(this).create();
        View view = View.inflate(this, R.layout.view_dialog, null);
        RadioGroup rgSkinCheck = view.findViewById(R.id.rg_skin_check);
        rgSkinCheck.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                switch (checkedId) {
                    case R.id.rb_blue:
                        SkinCompatManager.getInstance()
                                .loadSkin("blue", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
                        break;

                    case R.id.rb_green:
                        SkinCompatManager.getInstance()
                                .loadSkin("green", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
                        break;

                    case R.id.rb_rose_red:
                        SkinCompatManager.getInstance()
                                .loadSkin("rosered", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
                        break;

                    case R.id.rb_default:
                        SkinCompatManager.getInstance().restoreDefaultTheme();
                        break;

                    default:break;
                }
            }
        });
        mAlertDialog.setView(view, 0, 0, 0, 0);
    }

    @OnClick(R.id.bt_switch_skin)
    public void onSwitchSkin() {
        mAlertDialog.show();
        if (null != mAlertDialog.getWindow())
            mAlertDialog.getWindow().setLayout(800, ViewGroup.LayoutParams.WRAP_CONTENT);
    }

    @NonNull
    @Override
    public AppCompatDelegate getDelegate() {
        return SkinAppCompatDelegateImpl.get(this, this);
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        if (null != mAlertDialog) mAlertDialog.dismiss();
    }
}

看到最后是不是觉得一键换肤非常简单呢！纸上得来终觉浅，绝知此事要躬行！非常感谢你能看到这里，如果能够帮助到你是我的荣幸！

Steven Jon
关注
专栏目录
Android hook技术实现一键换肤，移动应用开发项目案例
m0_61362539的博客
11-09 417
3. 利用HOOK技术实现优雅的“一键换肤" 什么是hook **如题，我是用hook实现一键换肤。那么什么是hook？ hook，钩子. 安卓中的hook技术，其实是一个抽象概念：对系统源码的代码逻辑进行"劫持"，插入自己的逻辑，然后放行。注意：hook可能频繁使用java反射机制···** "一键换肤"中的hook思路 "劫持"系统创建View的过程,我们自己来创建View 系统原本自己存在创建View的逻辑，我们要了解这部分代码，以便为我所用. 收集我.
手把手讲解 Android hook技术实现一键换肤
weixin_43887839的博客
02-18 447
前言 手把手讲解系列文章，是我写给各位看官，也是写给我自己的。文章可能过分详细，但是这是为了帮助到尽量多的人，毕竟工作5,6年，不能老吸血，也到了回馈开源的时候. 这个系列的文章： 1、用通俗易懂的讲解方式，讲解一门技术的实用价值 2、详细书写源码的追踪，源码截图，绘制类的结构图，尽量详细地解释原理的探索过程 3、提供Github 的 可运行的Demo工程,但是我所提供代码，更多是提供思路，抛...
安卓一键换肤，不重启activity，无侵入性，只需配置xml
11-09
安卓一键换肤，不重启activity，无侵入性，只需配置xml [注意：本资源来自网络，如有侵权，请联系我删除，谢谢。]
Android动态换肤开源库Colorful发布
Mr.Simple的专栏
09-09 9445
最近本人需要用到夜间模式，但是经过一番搜索似乎并没有看到好的开源实现，看到有一个类似的库MultipleTheme，但是需要自定义所有要实现换肤功能的View，感觉比较麻烦。因此本人花了点时间简单弄了一个实现该功能的开源库，命名为Colorful。Colorful是基于Theme，无需重启Activity、无需自定义View，方便的实现日间、夜间模式
Android实战：APP换肤功能，并自动适配手机深色模式
最新发布
2401_87255046的博客
09-22 1001
这一步需要我们与设计师协作，整理一套颜色、背景资源等供 App 使用。之后我们在 xml 里以 attr 的形式给它命名，本工程案例：#FCE4EC#F06292#EC407A#880E4F#FFFFFF#E3F2FD#90CAF9#42A5F5#0D47A1#FAFAFA#757575#424242#212121。
[Android实例] android　换肤
lili1985516的专栏
10-11 635
http://www.eoeandroid.com/thread-102060-1-1.html 看到好多人在问题与解答里面都问怎么换肤，搜了一下论坛里面好像没怎么人弄个实例出来，所以我来了，哈哈。。 下面的文字大部分是转载的，也懒得自己去打字了，文采不好
Android一键换肤功能：一种简单的实现
weixin_34082854的博客
05-19 657
 Android一键换肤功能：一种简单的实现 现在的APP开发，通常会提供APP的换肤功能，网上流传的换肤代码和实现手段过于复杂，这里有一个开源实现，我找了一大堆，发现这个项目相对较为简洁：https://github.com/hongyangAndroid/AndroidChangeSkin 但是该项目的代码不晓得是咋回事，导入到Android studio里面后报出很多错...
Android 换肤
mazaiting的博客
11-28 180
换肤框架 Android-skin-support 在Application中初始化 public class BaseApplication extends Application { @Override public void onCreate() { super.onCreate(); SkinCompatManager.w...
qt5.12通过qss实现一键换肤以及Font Awesome字体在qt中的应用，欢迎大家下载使用！！！
12-15
win10系统上基于qt5.12通过qss实现一键换肤以及Font Awesome字体在qt中的应用，欢迎大家下载使用！！！——————————————win10系统上基于qt5.12通过qss实现一键换肤以及Font Awesome字体在qt中的应用，...
Android应用开发中实现apk皮肤文件换肤的思路分析
01-21
在android的项目开发中，都会遇到后期功能拓展增强与主程序代码变更的现实矛盾，也就是程序的灵活度。 由于linux平台的安全机制，再加上dalvik的特殊机制，各种权限壁垒，使得开发一个灵活多变的程序，变得比较困难...
android换肤的实现方案,Android应用开发之Android一键换肤功能实现
weixin_34385935的博客
05-25 452
本文将带你了解Android应用开发之Android一键换肤功能实现，希望本文对大家学Android有所帮助。<市面上对数的App都提供换肤功能，这里暂且不讲白天和夜间模式下图是网易云音乐的换肤功能经典黑换肤其实就是替换资源(文字、颜色、图片等)一、换肤模式：1.内置换肤在Apk包中存在多种资源(图片、颜色值)用于换肤时候切换。自由度低，apk文件大一般用于没有其他需求的日间/夜间模式ap...
android app皮肤更换方案
08-03
NULL 博文链接：https://u-czh.iteye.com/blog/2001894
Android----一键换肤功能
qq_35874340的博客
01-08 630
前言 最近项目需要做一键换肤功能，作为移动端（手机app、平板）开发者来说，这是一个常用的功能。实现此功能，先聊聊初始设计方向，一键换肤功能，其实最好是在项目启动时期就有，这样的好处在于， 开发者在设计架构的时候，能够方便的对资源文件进行合理性命名（图片、颜色）。 例如：项目整体色调是绿色，那么标题栏的颜色如果是纯色。我们可能会在color的配置文件中这样写： <color name="base_bg_green_ti...
Android一键换肤原理简述
Gyso的博客
07-02 531
简介 Android对应用进行换肤操作，首先要生成一个对应的皮肤包，在要换肤的应用中收集需要换肤的控件，获取皮肤包里的资源，一键换肤时遍历View树，对要换肤的控件进行换肤。下面总结为4个步骤 步骤 1 通过Activity.onCreateView（）或 实现LayoutInfaltor.Factory2接口 创建收集可换肤控件 ​ 这项工作应该在YourActivity.class或者BaseActivity.class或者LifecycleObserver.class中实现。这个步骤的实现自行搜索。
android不重启换主题,GitHub - hehonghui/Colorful: 基于Theme的Android动态换肤库，无需重启Activity、无需自定义View，方便的实现日间、夜间模式。...
weixin_42511887的博客
05-28 703
Colorful 动态换肤开源库基于Theme的Android动态换肤开源库,以简单的方式实现夜间模式。【该方案可以用于切换ui样式，但是还不完善，有需要的同学可自行修改框架扩展自己需要的功能】效果如下：Demo工程依赖support v7，请自行添加依赖一、使用方式1.1 自定义属性1.2 在布局中使用自定义属性设置View的背景、文本颜色等属性activity_main.xml中的布局:xml...
Android通过Hook技术实现一键换肤
Tiger的专栏
06-06 1433
实现换肤的方案： a.静态修改theme主题方式 设置多套皮肤的theme； styles.xml <resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- Customize your theme here. --> <it
Android实现换肤功能（二）
lanyeming2012的专栏
08-10 1276
前几天关于换肤的功能已经为大家介绍了一种策略，今天为大家另一种方式在Android平台下的换肤功能的实现。
Android一键换肤功能实现
李建国的博客
03-21 789
市面上对数的App都提供换肤功能，这里暂且不讲白天和夜间模式下图是网易云音乐的换肤功能经典黑换肤其实就是替换资源（文字、颜色、图片等）一、换肤模式：1.内置换肤            在Apk包中存在多种资源(图片、颜色值)用于换肤时候切换。      自由度低，apk文件大  一般用于没有其他需求的日间/夜间模式app 2.动态换肤        通过运行时动态加载皮肤包网易云下载的资源包二、换...
评论 9
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值