在机智云平台生成APP后，如何用代码实现换肤

现在很多APP中都会有换肤功能，看着很神奇，一键点击app大换样，那么APP换肤是如何实现的？

首先我们要弄清楚换肤的定义，软件皮肤包括图标、字体、布局、交互风格等，换肤就是换掉皮肤包括的部分或所有资源。

 

从功能上来说，软件换肤可以划分三种：

1) 软件内置多个皮肤，不可由用户增加或修改；

最低的自由度，软件实现相对于后两种最容易。

 

2) 官方提供皮肤供下载，用户可以使用下载的皮肤；

用户可选择下载自己喜欢的皮肤，有些玩家会破解皮肤的定制方法，自己做皮肤使用，或者传到网上给大家用。

 

3) 官方提供皮肤制作工具或方法，用户可自制皮肤。

这种方式使用户有参与感，自由度较高。用户可根据自己的喜好定制软件的皮肤。有些软件官网提供皮肤定制的工具或者方法，我建议最好有可视化带向导的工具。用户只要自己找一些图片、修改文字的字体替换就可以了。用户可以上传自制的皮肤，提供其他用户下载，还可以赚得一些虚拟货币或者奖品什么的。这种一般都是打包为.zip格式的。扩展名可由各公司自定义，有制作工具的话直接导出来最方便。

 

前面提到的三种皮肤，从软件实现上来看，它们的本质区别是皮肤是否内置到应用程序中。对于内置的实现比较简单，只要在开发应用的过程中设计几套皮肤供用户选择。这里用到的知识不超过Android基础，不详细讲解。

 

机智云自助开发平台在线生成的APP，是基于机智云开源框架的APP，此开源框架已集成了皮肤定制功能。通过修改UIConfig.json文件即可实现快速换肤。

 

 

 

如图红框内所示，为自定义皮肤代码修改区，各含义如下：

 

buttonColor：按钮颜色

buttonTextColor：按钮文字颜色

navigationBarColor：导航栏颜色

navigationBarTextColor：导航栏文字颜色

configProgressViewColor：配置中界面

progress view 颜色

 

 

通过修改对应的颜色值即可实现快速换肤，参考如下示例：

 

1.肤色一

 

"buttonColor":"6ebe37",

"buttonTextColor":"ffffff",

"navigationBarColor":"6ebe37",

"navigationBarTextColor":"ffffff",

"configProgressViewColor":"000000",

 

实际效果图：

 

 

2. 肤色二

 

"buttonColor":"ff8a44",

"buttonTextColor":"ffffff",

"navigationBarColor":"ff8a44",

"navigationBarTextColor":"ffffff",

"configProgressViewColor":"000000",

 

实际效果图：

 

3. 肤色三

 

"buttonColor":" 16b599",

"buttonTextColor":"ffffff",

"navigationBarColor":" 16b599",

"navigationBarTextColor":"ffffff",

"configProgressViewColor":"000000",

实际效果图：

 

 

今天我们就只介绍了最简单的换肤实现方式，您赶紧登录机智云自助开发平台（ dev.gizwits.com ）在线生成一个APP代码包试试吧。

 

后续还会有更多高阶版技巧，和大家一起分享。比如下面这种......