App一键换肤功能

article/2025/7/12 7:41:54

实现应用皮肤随意切换,这里只做基础展示,一个是常规肤色,一个是夜晚模式肤色

效果如下:

步骤如下:

1、引入换肤三方框架

2、在Application中对换肤SkinCompatManager进行初始化

3、在main下新建自己对应肤色res文件夹(后缀可自定义,此列举res-night),和res-night下的子项资源,注意color和drawable下的命名尾部都必须跟上 ‘ _night ’ 

4、在app gradle 中添加资源地址

sourceSets {main {res.srcDirs = ['src/main/res', 'src/main/res-night']}}

5、代码实现换肤

代码如下:

1、 引入换肤三方框架

    implementation 'skin.support:skin-support:3.1.0-beta1'                   // skin-support 基础控件支持implementation 'skin.support:skin-support-design:3.1.0-beta1'            // skin-support-design material design 控件支持[可选]implementation 'skin.support:skin-support-cardview:3.1.0-beta1'          // skin-support-cardview CardView 控件支持[可选]implementation 'skin.support:skin-support-constraint-layout:3.1.0-beta1' // skin-support-constraint-layout ConstraintLayout 控件支持[可选]

2、在Application中对换肤SkinCompatManager进行初始化

        SkinCompatManager.withoutActivity(this)                         // 基础控件换肤初始化.addInflater(new SkinMaterialViewInflater())            // material design 控件换肤初始化[可选].addInflater(new SkinConstraintViewInflater())          // ConstraintLayout 控件换肤初始化[可选].addInflater(new SkinCardViewInflater())                // CardView v7 控件换肤初始化[可选].setSkinStatusBarColorEnable(false)                     // 关闭状态栏换肤,默认打开[可选].setSkinWindowBackgroundEnable(false)                   // 关闭windowBackground换肤,默认打开[可选].loadSkin();

3、在main下新建自己对应肤色res文件夹

res-night下的color.xml

<?xml version="1.0" encoding="utf-8"?>
<resources><color name="colorPrimary_night">#008577</color><color name="colorPrimaryDark_night">#00574B</color><color name="colorAccent_night">#D81B60</color><color name="tool_bar_night">#fff</color>
</resources>

4、在app gradle 中添加资源地址

sourceSets {main {res.srcDirs = ['src/main/res', 'src/main/res-night']}}

5、代码实现换肤

public class MainActivity extends AppCompatActivity {private Button btnNormal;private Button btnNight;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);supportRequestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);btnNormal = findViewById(R.id.btn_normal);btnNight = findViewById(R.id.btn_night);btnNormal.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {SkinCompatManager.getInstance().restoreDefaultTheme();}});btnNight.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {// 指定皮肤插件SkinCompatManager.getInstance().loadSkin("night", null, SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);}});}
}


http://chatgpt.dhexx.cn/article/2sYa1Xf5.shtml

相关文章

微信小程序——如何一键换肤

小程序一键换肤不难&#xff0c;在这之前需要了解CSS的 var() 函数 方法如下&#xff1a; 先在page页面里创建一个包含所有元素的view标签&#xff0c;并为其配置style颜色的数据绑定&#xff1a; js如下&#xff1a; 此后我们只需要通过this.setData({})的方法改变data里…

Android hook技术实现一键换肤,移动应用开发项目案例

3. 利用HOOK技术实现优雅的“一键换肤" 什么是hook**如题,我是用hook实现一键换肤。那么什么是hook? hook,钩子. 安卓中的hook技术,其实是一个抽象概念:对系统源码的代码逻辑进行"劫持",插入自己的逻辑,然后放行。注意:hook可能频繁使用java反射机制**…

react+antd+vite配置一键换肤功能(步骤详细)

一、首先需要下载less、less-loader&#xff0c;然后在vite.config.js中配置如下 二、再全局引入node_modules中的less文件 三、引入antd中全局化配置组件,详细配置请参考官网ConfigProvider 四、最后通过ConfigProvider.config中的参数进行动态配置&#xff0c;从而改变主题…

Vue Element-ui 一键换肤的方案(第二种)

目录 前言 1、新建类名 2、定义变量 3、使用 4、关于切换主题的逻辑 总结 前言 因为涉及到除了ui库以外的样式需要配置两个风格或者更多的颜色&#xff0c;所以有了这个方案的出现。 1、新建类名 首先在style找到element这个文件夹&#xff0c;在base-variable.scss里&am…

前端项目一键换肤vue+element(ColorPicker)

前端项目一键换肤 1.需要配色的都是用变量声明 2.增加颜色选择器 3.改变颜色&#xff0c;更改初始值 1.需要配色的都是用变量声明 /* 全局样式 */ body {// 无需改变--light_color_aside: #f6f6f6;// 主题色--light_colourt: #E60027;--theme_color: #EC5E59;--light_color_b…

前端 “一键换肤“ 的几种方案

作者&#xff1a;熊的猫 原文&#xff1a;https://juejin.cn/post/7063010855167721486 前端 “一键换肤“ 的几种方案 前言 现在越来越多的网站都提供了拥有换肤&#xff08;切换主题&#xff09;功能&#xff0c;如 ElementUI&#xff0c;既是为了迎合用户需求&#xff0c;或…

element-plus简易一键换肤

哈喽&#xff0c;大家好我是小衰&#xff0c;勤勤恳恳一码农&#xff0c;低级前端工程师&#xff0c;不吃甲方零食下午茶&#xff0c;热爱用双手解决问题&#xff0c;白天用双手敲代码 晚上用双手做一些正能量的事情&#xff0c;夜深了&#xff0c;由于小哀在公司勤勤恳恳的努力…

vue 一键换肤 换主题

该一键换肤只是定义好几个颜色&#xff0c;并进行简单的切换。 在src下的assets文件下面定义一个css文件夹&#xff0c;在对应的文件里面定义_handle.scss和_themes.scss文件&#xff0c;如下&#xff1a; image.png 2.在_themes.scss文件里面定义好需要用到的几个样式。如下…

如何利用 SCSS 实现一键换肤

环境准备 首先我们需要安装 scss 解析环境 npm i sass // 注意 sass-loader 安装需要指定版本 如果安装最新版本会报错 this.getOptions 这个方法未定义 npm i -D sass-loader10.1.0 // 利用 normalize.css 初始化页面样式 npm i -S normalize.css 小技巧 这里讲一个小技巧&a…

项目实现一键换肤的功能

在publick下面分别建立两个文件 一个是默认的一个是夜间的 然后在app。vue入口文件 mounted(){let colorName localStorage.getItem(themes) || defaultlet link document.createElement(link)link.type text/csslink.relstylesheetlink.href /themes/${colorName}.cssdocu…

从零开始Vue3+Element Plus后台管理系统(17)——一键换肤的N种方案

暗黑模式 基于Element Plus和Tailwind CSS灵活的设计&#xff0c;我们很容易在项目中实现暗黑模式&#xff0c;具体可以参考之前的文章《从零开始写一个Vue3Element Plus的后台管理系统(二)——Layout页面布局的实现》 换肤方案 如果需要给用户提供更多主题&#xff0c;更丰…

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

古人学问无遗力&#xff0c;少壮工夫老始成。 纸上得来终觉浅&#xff0c;绝知此事要躬行。 --《冬夜读书示子聿》 陆游 换肤效果演示 四种皮肤切换&#xff1a;默认白色、蓝色、绿色和玫瑰红&#xff1a; 前言 先给大家介绍一下现在比较主流的、Star比较多的换肤框架&#…

前端 “一键换肤“ 的 N 种方案

前端瓶子君&#xff0c;关注公众号 回复算法&#xff0c;加入前端编程面试算法每日一题群 前言 现在越来越多的网站都提供了拥有换肤&#xff08;切换主题&#xff09;功能&#xff0c;如 ElementUI[2]&#xff0c;既是为了迎合用户需求&#xff0c;或是为了凸显自己特点&#…

Python装逼指南——五行代码实现批量抠图

你是否曾经想将某张照片中的人物抠出来&#xff0c;然后拼接到其他图片上去&#xff0c;从而可以即使你在天涯海角&#xff0c;我也可以到此一游&#xff1f; 专业点的人使用 PhotoShop 的“魔棒”工具可以抠图&#xff0c;非专业人士可以使用各种美图 APP 来实现&#xff0c;但…

iter()函数联队*、zip()实现序列“定长”拆分——基于iterator特性拆解繁复的单行“装逼代码”,搞明白序列定长拆分“秘法”

Python 官网&#xff1a;https://www.python.org/ Free&#xff1a;大咖免费“圣经”教程《 python 完全自学教程》&#xff0c;不仅仅是基础那么简单…… My CSDN主页、My HOT博、My Python 学习个人备忘录好文力荐、 老齐教室 自学并不是什么神秘的东西&#xff0c;一个人一…

如何在你朋友面前装逼4(程序代码)

大家好&#xff0c;我是不讲武德。今天我来教大家在电脑上画画&#xff0c;非常简单 --------------------------------------------------------------------------------------------------------------------- 第一步&#xff1a;新建一个文本文档 第二步&#xff1a;打开…

dtree树形菜单带搜索复选框单选框插件

dtree树形菜单带搜索复选框单选框插件 用于选择部门或者选择部门下人员 效果如下图 dtree树形菜单带搜索不带单选框复选框 dtree选择部门或者选择部门下人员复选框单选框插件 带搜索 https://download.csdn.net/download/qq_27559331/9885259

OA与帆软BI跨系统用户、部门、岗位同步总结

目录 前言&#xff1a; 一、初衷 1、需要准备啥&#xff1f; 2、同步接口或者数据集 3、建立服务器数据集 代码&#xff1a; 效果&#xff1a; 二、正式同步 1、建立服务器数据集 2、建立服务器树状数据集 3、选择对应关系进行同步 4、等待与设置同步频率 5、注意事项 …

JAVA 对接钉钉API(人员、部门、官方智能工作流)20210527

前言 应公司要求&#xff0c;公司人事HR系统需要对接钉钉考勤数据&#xff0c;所以需要获取钉钉的打卡记录、出差、外出、请假、调岗的数据&#xff0c;然后转换成HR系统数据。 对接前准备 创建应用 1、首先需要管理员登录钉钉开放平台&#xff0c;创建应用。 说明 只有管理…