【靶点突破】网易云换肤方案探讨
- 老方案
- 网易云音乐换肤方案原理
- 动手实现一个网易云换肤方案的demo
- 动手打造换肤方案的轮子
- 黑白夜模式切换
Hello,大家好，我是Ellen,这是Android靶点突破系列文章，旨在帮助你更加了解Android技术开发的同时，把业务做到精致。思考自己的职业生涯，想成为怎样的技术人，想追求怎么样的生活。
至尊宝脚踏七彩祥云娶了紫霞，希望你也能成为她的自尊宝。
| from Ellen缘言
1.老方案
App皮肤切换老方案分为2点:
- 1.设置不同的Style，结合Activity的recreate & setTheme方法
- 2.通过全局Setting进行修改，回调通知所有存活的Activity & Fragment & Dialog等
如果是老的项目突然需要添加换肤功能，那么这将是一个极大的劳动工程，费时又费力，而且随着皮肤的增多，你的资源文件会越来越大，这首先很不方便管理，而且还会让apk的体积越来越大，开发起来吃力，用户体验也不好。
对于老方案的实现代码我这里就不讲解了，我会贴一个Github项目代码，读者可以自行去看看瞧瞧，代码注释写的很清晰，注意的是这里笔者只实现了Style & Setting两种方式，Style方式是切换Theme的方式，需要配置不同的style和自定义属性，Setting方式则更为灵活，它是通过属性对界面的皮肤进行控制，每个界面收到回调然后进行切换，还有其它很多实现方式，但核心缺点都是一样的，包体积越来越臃肿，管理性越来越差，我们重点要实现网易云音乐的换肤方案，这才是换肤的王道。当然你可以通过后端配置方式将资源都放在接口里，比较占apk的图片资源用url的方式，但是无疑增加皮肤切换的业务逻辑复杂度，随着项目业务越来越多，负责皮肤的bean对象也许会越来越多的属性。
2.网易云音乐换肤方案原理
网易云音乐相信你使用过，它的换肤可以算是秒切，那么它是怎样做到的呢？我们先来看看它的原理，然后追求精致，我们也要实现这种秒切皮肤的效果。
我们来看看，它的原理需要了解的如下:
- 1.LayoutInflater mFactory & mFactory2 反射替代成自定义的
- 2.解析空壳apk获取Resource替代原有的App Resource
步骤1:LayoutInflater mFactory & mFactory2 反射替代成自定义的
LayoutInflater通常我们用来解析布局文件的，将布局文件映射成一个一个的控件对象，下列代码就是将布局item_skin_manager映射为一个View对象:
LayoutInflater.from(parent.getContext()).inflate(R.layout.item_skin_manager, parent, false);
那么它是如何将布局文件映射为View对象的呢，我们来看看Android SDK版本31下inflate方法的源码:
public View inflate(@LayoutRes int resource, @Nullable ViewGroup root, boolean attachToRoot) {
//**********注意点1
final Resources res = getContext().getResources();
if (DEBUG) {
Log.d(TAG, "INFLATING from resource: \"" + res.getResourceName(resource) + "\" ("
+ Integer.toHexString(resource) + ")");
}
View view = tryInflatePrecompiled(resource, res, root, attachToRoot);
if (view != null) {
return view;
}
//**********注意点2
XmlResourceParser parser = res.getLayout(resource);
try {
//**********注意点3
return inflate(parser, root, attachToRoot);
} finally {
parser.close();
}
}
请注意上方代码笔者标注的"注意点1"和"注意点2"以及"注意点3"，后面我直接简称为点1和点2以及点3，从点1中我们可以看到它是获取了一个Resource res,再从点2看到，它获取了一个XML解析负责相关的类XmlResourceParser parser，这个parser应该提供了XML解析相关的,那么我们接下来看看点3标注的inflate方法:
public View inflate(XmlPullParser parser, @Nullable ViewGroup root, boolean attachToRoot) {
synchronized (mConstructorArgs) {
Trace.traceBegin(Trace.TRACE_TAG_VIEW, "inflate");
final Context inflaterContext = mContext;
final AttributeSet attrs = Xml.asAttributeSet(parser);
Context lastContext = (Context) mConstructorArgs[0];
mConstructorArgs[0] = inflaterContext;
View result = root;
try {
advanceToRootNode(parser);
final String name = parser.getName();
if (DEBUG) {
System.out.println("**************************");
System.out.println("Creating root view: "
+ name);
System.out.println("**************************");
}
if (TAG_MERGE.equals(name)) {
if (root == null || !attachToRoot) {
throw new InflateException("<merge /> can be used only with a valid "
+ "ViewGroup root and attachToRoot=true");
}
rInflate(parser, root, inflaterContext, attrs, false);
} else {
//**********注意点4
// Temp is the root view that was found in the xml
final View temp = createViewFromTag(root, name, inflaterContext, attrs);
ViewGroup.LayoutParams params = null;
if (root != null) {
if (DEBUG) {
System.out.println("Creating params from root: " +
root);
}
// Create layout params that match root, if supplied
params = root.generateLayoutParams(attrs);
if (!attachToRoot) {
// Set the layout params for temp if we are not
// attaching. (If we are, we use addView, below)
temp.setLayoutParams(params);
}
}
if (DEBUG) {
System.out.println("-----> start inflating children");
}
// Inflate all children under temp against its context.
rInflateChildren(parser, temp, attrs, true);
if (DEBUG) {
System.out.println("-----> done inflating children");
}
// We are supposed to attach all the views we found (int temp)
// to root. Do that now.
if (root != null && attachToRoot) {
root.addView(temp, params);
}
// Decide whether to return the root that was passed in or the
// top view found in xml.
if (root == null || !attachToRoot) {
result = temp;
}
}
} catch (XmlPullParserException e) {
final InflateException ie = new InflateException(e.getMessage(), e);
ie.setStackTrace(EMPTY_STACK_TRACE);
throw ie;
} catch (Exception e) {
final InflateException ie = new InflateException(
getParserStateDescription(inflaterContext, attrs)
+ ": " + e.getMessage(), e);
ie.setStackTrace(EMPTY_STACK_TRACE);
throw ie;
} finally {
// Don't retain static reference on context.
mConstructorArgs[0] = lastContext;
mConstructorArgs[1] = null;
Trace.traceEnd(Trace.TRACE_TAG_VIEW);
}
return result;
}
}
看点4老外注释的， Temp is the root view that was found in the xml，大概意思就是说Temp 是在 xml 中找到的根视图，原来我们的xml布局是这样的解析的哦，我们再来看看createViewFromTag方法：
View createViewFromTag(View parent, String name, Context context, AttributeSet attrs,
boolean ignoreThemeAttr) {
if (name.equals("view")) {
name = attrs.getAttributeValue(null, "class");
}
// Apply a theme wrapper, if allowed and one is specified.
if (!ignoreThemeAttr) {
final TypedArray ta = context.obtainStyledAttributes(attrs, ATTRS_THEME);
final int themeResId = ta.getResourceId(0, 0);
if (themeResId != 0) {
context = new ContextThemeWrapper(context, themeResId);
}
ta.recycle();
}
try {
//***********注意点5
View view = tryCreateView(parent, name, context, attrs);
if (view == null) {
final Object lastContext = mConstructorArgs[0];
mConstructorArgs[0] = context;
try {
if (-1 == name.indexOf('.')) {
view = onCreateView(context, parent, name, attrs);
} else {
view = createView(context, name, null, attrs);
}
} finally {
mConstructorArgs[0] = lastContext;
}
}
return view;
} catch (InflateException e) {
throw e;
} catch (ClassNotFoundException e) {
final InflateException ie = new InflateException(
getParserStateDescription(context, attrs)
+ ": Error inflating class " + name, e);
ie.setStackTrace(EMPTY_STACK_TRACE);
throw ie;
} catch (Exception e) {
final InflateException ie = new InflateException(
getParserStateDescription(context, attrs)
+ ": Error inflating class " + name, e);
ie.setStackTrace(EMPTY_STACK_TRACE);
throw ie;
}
}
我们再看点5，它通过tryCreateView方法获取到一个View,这个View就是Temp了，也就是解析布局获取到的View对象，我们在来看看tryCreateView方法:
public final View tryCreateView(@Nullable View parent, @NonNull String name,
@NonNull Context context,
@NonNull AttributeSet attrs) {
if (name.equals(TAG_1995)) {
// Let's party like it's 1995!
return new BlinkLayout(context, attrs);
}
View view;
if (mFactory2 != null) {
//*******注意点6
view = mFactory2.onCreateView(parent, name, context, attrs);
} else if (mFactory != null) {
//*******注意点7
view = mFactory.onCreateView(name, context, attrs);
} else {
view = null;
}
if (view == null && mPrivateFactory != null) {
view = mPrivateFactory.onCreateView(parent, name, context, attrs);
}
return view;
}
我们看到点6和点7，原来我们的View都是通过mFactory2或 mFactory创建出来的，我们看看下面代码:
public interface Factory2 extends Factory {
/**
* Version of {@link #onCreateView(String, Context, AttributeSet)}
* that also supplies the parent that the view created view will be
* placed in.
*
* @param parent The parent that the created view will be placed
* in; <em>note that this may be null</em>.
* @param name Tag name to be inflated.
* @param context The context the view is being created in.
* @param attrs Inflation attributes as specified in XML file.
*
* @return View Newly created view. Return null for the default
* behavior.
*/
@Nullable
View onCreateView(@Nullable View parent, @NonNull String name,
@NonNull Context context, @NonNull AttributeSet attrs);
}
public interface Factory {
/**
* Hook you can supply that is called when inflating from a LayoutInflater.
* You can use this to customize the tag names available in your XML
* layout files.
*
* <p>
* Note that it is good practice to prefix these custom names with your
* package (i.e., com.coolcompany.apps) to avoid conflicts with system
* names.
*
* @param name Tag name to be inflated.
* @param context The context the view is being created in.
* @param attrs Inflation attributes as specified in XML file.
*
* @return View Newly created view. Return null for the default
* behavior.
*/
@Nullable
View onCreateView(@NonNull String name, @NonNull Context context,
@NonNull AttributeSet attrs);
}
可以看到Factory和Factory2都是接口，那么mFactory2或 mFactory是啥呢？
@UnsupportedAppUsage
private Factory mFactory;
@UnsupportedAppUsage
private Factory2 mFactory2;
它是 LayoutInflater内私有属性成员，那么我们是否可以通过反射拦截XML解析成具体控件对象的过程呢？只要拦截了，那么我们是否可以拿到控件对象任性设置自己要的皮肤属呢？如果是通过设置属性的方式进行切换，那么我们估计也还是会像老方案那样，只会越来越复杂，那么怎么办呢？我们拿到控件对象啦，还记得前面提到的Resource,它是负责整个控件体系的资源设置的类，同样的原理，我们是否可以通过我们的Resource来进行设置呢，我们再来看看Resource是如何来的：
步骤2:解析空壳apk获取Resource替代原有的App Resource
通过上图我们可以确定Resource通过AssetManager来加载的，Asset是不是很熟悉，它是asset目录啊，怎么会加载项目的资源呢？难道它还可以解析目录下资源吗？
我们接着看看这个方法:
//这里的path就是apk所在目录
public int addAssetPath(String path) {
return addAssetPathInternal(path, false /*overlay*/, false /*appAsLib*/);
}
虽然这个方法是public的，但是被隐藏掉了，我们只能通过反射进行调用，也就是方案已经很明了，就是我们将每个皮肤的资源打进空壳apk内，然后通过AssetManager的addAssetPath方法解析空壳apk的资源，获取到一个Resource,然后我们通过反射LayoutInflater赋值自定义的mFactory&mFactory2来拦截控件创建过程，进行属性的替换，眼下我们还存在一个问题，那么如何new一个Resource对象，并且将空壳apk的资源打进去呢？我们看看Resource的构造器:
public Resources(AssetManager assets, DisplayMetrics metrics, Configuration config) {
this(null);
mResourcesImpl = new ResourcesImpl(assets, metrics, config, new DisplayAdjustments());
}
惊喜且意外的发现Resources(AssetManager assets, DisplayMetrics metrics, Configuration config)这个构造器完全满足我们的需求，但是metrics和config是啥呢，没关系，我们通过获取当前的Resource,将当前的Resource的metrics和config传进去即可，我们只需要设置我们重要的解析空客apk的assets即可，然后通过Resource为我们提供的解析资源的api给拦截的控件对象设置对应的皮肤属性即可。
3.动手实现一个网易云换肤方案的demo
经过网易云音乐换肤方案原理分析，我们要实现换肤的步骤如下:
- 0.准备好换肤对应的界面
- 1.反射赋值LayoutInflater mFactory & mFactory2,拦截控件对象创建过程
- 2.过滤出我们需要换肤的控件的属性
- 3.下载服务器空壳apk资源，加载空壳apk获取到一个当前皮肤的Resource skinResource
- 4.通过解析换肤属性的资源id在skinResource中寻找对应的值，并设置给控件对象
步骤0:准备好换肤对应的界面
由于只是例子讲解，笔者就不搞的太复杂，就弄一个Activity & 3个Fragment进行实现，通过res资源color.xml文件中"main_color属性进行更换",代码请到SwitchSkinDemo查看，这里不在啰嗦。
demo 演示gif如下所示: 待上传
步骤1:反射赋值LayoutInflater mFactory & mFactory2,拦截控件对象创建过程
要想反射赋值到mFactory & mFactory2，我们首先要先获取Activity对应的LayoutInflater,因为需要每个存活的Activity都需要进行反射赋值，很容易联想到，我们可以通过Application的registerActivityLifecycleCallbacks方法做到，话不多说我们上代码：
//皮肤管理类
public class SkinManager {
//单例对象
private volatile static SkinManager INSTANCE;
//Application对象
private Application application;
//皮肤名字集合
private List<String> skinNames = new ArrayList<>();
//记录当前应用的皮肤名
private String currentSkin = "skin_default.apk";
//记录默认的皮肤名
private static final String DEFAULT_SKIN_NAME = "skin_default.apk";
//应用Activity生命周期监听
private SkinActivityLifecycle skinActivityLifecycle;
private SkinManager(){
//初始化皮肤数据，当然这里可以网络下载即可，但是为了方便
//笔者就用assets目录copy到本地目录的方式模拟网络加载皮肤过程
skinNames.add("skin_blue.apk");
skinNames.add("skin_red.apk");
skinNames.add("skin_black.apk");
skinNames.add("skin_green.apk");
skinNames.add("skin_default.apk");
}
public List<String> getSkinData(){
return skinNames;
}
/**
* 切换皮肤
* @param skinName
*/
public void switchSkin(String skinName){
this.currentSkin = skinName;
skinActivityLifecycle.switchSkin();
}
/**
* 是否是默认皮肤
* @return
*/
public boolean isDefaultSkin(){
return currentSkin.equals(DEFAULT_SKIN_NAME);
}
/**
* 获取到当前的皮肤名
* @return
*/
public String getCurrentSkin(){
return currentSkin;
}
public static SkinManager getInstance(){
if(INSTANCE == null){
synchronized (SkinManager.class){
if(INSTANCE == null){
INSTANCE = new SkinManager();
}
}
}
return INSTANCE;
}
public Application getApplication(){
return application;
}
/**
* 皮肤管理初始化
* @param app
*/
public void initApp(Application app){
this.application = app;
//对所有Activity的声明周期进行监听
app.registerActivityLifecycleCallbacks(skinActivityLifecycle = new SkinActivityLifecycle());
}
}
因为服务器下载空壳apk的接口没有做，这里笔者用asset目录copy到本地目录的方式去模拟从服务器下载空壳apk的过程，请读者仔细阅读以上代码，笔者的皮肤切换机制里带有5种皮肤，分别是:
- skin_default.apk【黄色】
- skin_blue.apk【蓝色】
- skin_red.apk【红色】
- skin_black.apk【黑色】
- skin_green.apk【绿色】
笔者皮肤的属性只把包含color.xml下"main_color"这个资源字段，如下所示:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="purple_200">#FFBB86FC</color>
<color name="purple_500">#FF6200EE</color>
<color name="purple_700">#FF3700B3</color>
<color name="teal_200">#FF03DAC5</color>
<color name="teal_700">#FF018786</color>
<color name="black">#FF000000</color>
<color name="white">#FFFFFFFF</color>
//皮肤主色
<color name="main_color">#FFA500</color>
</resources>
并且笔者先将这个"main_color"修改为对应皮肤的颜色值，然后进行空壳打包，打完的包放进了项目目录下的assets目录下，然后我们把皮肤空壳apk准备好了，接下来我们就看看如何拿到每个Activity的LayoutInflater，然后反射赋值mFactory & mFactory2那两个属性，请看笔者上述SkinManager类中的initApp方法:
/**
* 皮肤管理初始化
* @param app
*/
public void initApp(Application app){
this.application = app;
//对所有Activity的声明周期进行监听
app.registerActivityLifecycleCallbacks(skinActivityLifecycle = new SkinActivityLifecycle());
}
我们可以看到笔者是通过SkinActivityLifecycle对所有的Activity进行生命周期监听的,其代码如下:
public class SkinActivityLifecycle implements Application.ActivityLifecycleCallbacks {
private List<Activity> activeActivityList = new ArrayList<>();
@Override
@SuppressLint("SoonBlockedPrivateApi")
public void onActivityCreated(@NonNull Activity activity, @Nullable Bundle bundle) {
activeActivityList.add(activity);
LayoutInflater layoutInflater = LayoutInflater.from(activity);
//反射setFactory2,Android Q及以上已经失效-> 报not field 异常
//Android Q以上setFactory2问题
//http://www.javashuo.com/article/p-sheppkca-ds.html
forceSetFactory2(layoutInflater);
}
/**
* 最新的方式，适配Android Q
* @param inflater
*/
private static void forceSetFactory2(LayoutInflater inflater) {
Class<LayoutInflaterCompat> compatClass = LayoutInflaterCompat.class;
Class<LayoutInflater> inflaterClass = LayoutInflater.class;
try {
Field sCheckedField = compatClass.getDeclaredField("sCheckedField");
sCheckedField.setAccessible(true);
sCheckedField.setBoolean(inflater, false);
Field mFactory = inflaterClass.getDeclaredField("mFactory");
mFactory.setAccessible(true);
Field mFactory2 = inflaterClass.getDeclaredField("mFactory2");
mFactory2.setAccessible(true);
//自定义的Factory2
SkinLayoutFactory skinLayoutFactory = new SkinLayoutFactory();
mFactory2.set(inflater, skinLayoutFactory);
mFactory.set(inflater, skinLayoutFactory);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (NoSuchFieldException e) {
e.printStackTrace();
}
}
@Override
public void onActivityStarted(@NonNull Activity activity) {
}
@Override
public void onActivityResumed(@NonNull Activity activity) {
}
@Override
public void onActivityPaused(@NonNull Activity activity) {
}
@Override
public void onActivityStopped(@NonNull Activity activity) {
}
@Override
public void onActivitySaveInstanceState(@NonNull Activity activity, @NonNull Bundle bundle) {
}
@Override
public void onActivityDestroyed(@NonNull Activity activity) {
activeActivityList.remove(activity);
}
public void switchSkin(){
for(Activity activity:activeActivityList){
//重新使用资源
if(!(activity instanceof SkinManagerActivity)) {
activity.recreate();
}
}
}
}
在上述代码中我们完成了mFactory & mFactory2的反射赋值，我们看到forceSetFactory2方法中，我们将SkinLayoutFactory对象通过反射赋值给了mFactory & mFactory2，那么SkinLayoutFactory我们应该在它里面写哪些逻辑呢，聪明的你应该知道mFactory2 & mFactory不过只是负责将XML中的控件标签映射为具体内存中的控件对象，我们不仅要实现这个，还要实现拦截并设置我们需要更换皮肤的属性，接下来我们就来看看如何实现。
步骤2:过滤出我们需要换肤的控件的属性
public class SkinLayoutFactory implements LayoutInflater.Factory2 {
//具体拦截逻辑都在该类里
private SkinAttribute skinAttribute;
public SkinLayoutFactory(){
skinAttribute = new SkinAttribute();
}
//系统自带的控件名包名路径
//因为布局中会直接使用<TextView没带全路径的，所以我们该手动加上
private static final String[] systemViewPackage = {
"androidx.widget.",
"androidx.view.",
"androidx.webkit.",
"android.widget.",
"android.view.",
"android.webkit."
};
//反射控件对应的构造器而使用
private static final Class[] mConstructorSignature = new Class[]{Context.class,AttributeSet.class};
//存储控件的构造器，避免重复创建
private static final HashMap<String, Constructor<? extends View>> mConstructor = new HashMap<>();
@Nullable
@Override
public View onCreateView(@Nullable View parent, @NonNull String name, @NonNull Context context, @NonNull AttributeSet attributeSet) {
View view = onCreateViewFromTag(name,context,attributeSet);
if(view == null){
view = onCreateView(name, context, attributeSet);
}
//筛选符合属性的View
skinAttribute.loadView(view,attributeSet);
return view;
}
/**
* 通过反射构建控件对象
* @param name
* @param context
* @param attributeSet
* @return
*/
@Nullable
@Override
public View onCreateView(@NonNull String name, @NonNull Context context, @NonNull AttributeSet attributeSet) {
Constructor<? extends View> constructor = mConstructor.get(name);
View view = null;
if(constructor == null){
try {
Class<? extends View> viewClass = context.getClassLoader().loadClass(name).asSubclass(View.class);
constructor = viewClass.getConstructor(mConstructorSignature);
mConstructor.put(name,constructor);
} catch (ClassNotFoundException | NoSuchMethodException e) {
e.printStackTrace();
}
}
if(constructor != null){
try {
view = constructor.newInstance(context,attributeSet);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InstantiationException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
}
return view;
}
private View onCreateViewFromTag(@NonNull String name, @NonNull Context context, @NonNull AttributeSet attributeSet){
if(name.indexOf(".") > 0){
//说明XML中该控件带有包名全路径
}
View view = null;
for(String packageName:systemViewPackage){
view = onCreateView(packageName+name,context,attributeSet);
if(view != null){
break;
}
}
return view;
}
}
这个类的作用不用笔者多说了，仔细看下代码就会一目了然，它存在以下作用:
- 1.将XML对应的控件标签映射为对应的具体控件对象，有具体包名则直接进行反射构建，无包名则需要先拼接对应的全路径包名然后再反射，例如TextView->android.widget.TextView
- 2.拦截构建出的控件对象，设置对应的皮肤属性
看以上代码，如下所示:
@Nullable
@Override
public View onCreateView(@Nullable View parent, @NonNull String name, @NonNull Context context, @NonNull AttributeSet attributeSet) {
View view = onCreateViewFromTag(name,context,attributeSet);
if(view == null){
view = onCreateView(name, context, attributeSet);
}
//筛选符合属性的View
skinAttribute.loadView(view,attributeSet);
return view;
}
SkinAttribute类具体负责拦截逻辑,具体代码如下所示:
public class SkinAttribute {
//过滤出皮肤需要的属性
private static final List<String> ATTRIBUTE = new ArrayList<>();
static {
ATTRIBUTE.add("background");
ATTRIBUTE.add("src");
ATTRIBUTE.add("textColor");
ATTRIBUTE.add("SkinTypeface");
//TabLayout
ATTRIBUTE.add("tabIndicatorColor");
ATTRIBUTE.add("tabSelectedTextColor");
}
public void loadView(View view, AttributeSet attributeSet) {
for (int i = 0; i < attributeSet.getAttributeCount(); i++) {
String attributeName = attributeSet.getAttributeName(i);
if (ATTRIBUTE.contains(attributeName)) {
String attributeValue = attributeSet.getAttributeValue(i);
if (attributeValue.startsWith("#")) {
//固定的Color值，无需修改
} else {
int resId = 0;
//判断前缀是否为？
int attrId = Integer.parseInt(attributeValue.substring(1));
if (attributeValue.startsWith("?")) {
int[] array = {attrId};
resId = SkinThemeUtils.getResId(view.getContext(), array)[0];
} else {
resId = attrId;
}
if (resId != 0) {
String skinName = SkinManager.getInstance().getCurrentSkin();
File skinFile = new File(view.getContext().getCacheDir(), skinName);
//拿到空壳App资源
if (!SkinManager.getInstance().isDefaultSkin()) {
//如果皮肤包不存在，那么先从asset里进行拷贝到SD卡【模拟从服务器下载过程】
if (!skinFile.exists()) {
//复制文件
FileUtils.copyFileFromAssets(view.getContext(), skinName,
view.getContext().getCacheDir().getAbsolutePath(), skinName);
}
}
SkinLoadApkPath skinLoadApkPath = new SkinLoadApkPath();
skinLoadApkPath.loadEmptyApkPath(skinFile.getAbsolutePath());
Resources skinResource = skinLoadApkPath.getSkinResource();
if (attributeName.equals("textColor")) {
TextView textView = (TextView) view;
textView.setTextColor(skinResource.getColorStateList(resId));
}
if (attributeName.equals("background")) {
view.setBackgroundColor(skinResource.getColor(resId));
}
if (attributeName.equals("tabIndicatorColor")) {
//TabLayout下划线颜色
TabLayout tabLayout = (TabLayout) view;
tabLayout.setSelectedTabIndicatorColor(skinResource.getColor(resId));
}
if (attributeName.equals("tabSelectedTextColor")) {
//TabLayout选中文本颜色
TabLayout tabLayout = (TabLayout) view;
tabLayout.setTabTextColors(Color.BLACK, skinResource.getColor(resId));
}
}
}
}
}
}
}
主要拦截设置皮肤属性的逻辑都在loadView方法里，先遍历控件对象对应的AttributeSet，然后过滤出自己需要的皮肤属性，负责过滤的集合是ATTRIBUTE，拿到我们需要更改的控件对象以及需要修改的皮肤属性，我们思考一个问题，如果想设置对应的皮肤属性，首先我们是不是要确定这个属性使用哪个资源id?,如果你XML用了"?"方式使用了Style的资源，那么这时又该如何正确获取该属性使用的资源id呢？其具体代码逻辑如下：
int attrId = Integer.parseInt(attributeValue.substring(1));
if (attributeValue.startsWith("?")) {
int[] array = {attrId};
resId = SkinThemeUtils.getResId(view.getContext(), array)[0];
} else {
resId = attrId;
}
如果你的XML使用了？访问XML资源，那么就需要使用SkinThemeUtils工具将其映射为具体的资源id,其代码如下:
public class SkinThemeUtils {
public static int[] getResId(Context context, int[] attrs){
int[] ints = new int[attrs.length];
TypedArray typedArray = context.obtainStyledAttributes(attrs);
for (int i = 0; i < typedArray.length(); i++) {
ints[i] = typedArray.getResourceId(i, 0);
}
typedArray.recycle();
return ints;
}
}
接下来我们是不是该解析空壳apk，然后再拿到对应的Resource,然后通过对应的Resource api已经对应的皮肤属性名和资源id,这样我们就能更改皮肤控件对应的皮肤属性值啦，从loadView方法看以下代码:
if (resId != 0) {
String skinName = SkinManager.getInstance().getCurrentSkin();
File skinFile = new File(view.getContext().getCacheDir(), skinName);
//拿到空壳App资源
if (!SkinManager.getInstance().isDefaultSkin()) {
//如果皮肤包不存在，那么先从asset里进行拷贝到SD卡【模拟从服务器下载过程】
if (!skinFile.exists()) {
//复制文件
FileUtils.copyFileFromAssets(view.getContext(), skinName,
view.getContext().getCacheDir().getAbsolutePath(), skinName);
}
}
SkinLoadApkPath skinLoadApkPath = new SkinLoadApkPath();
skinLoadApkPath.loadEmptyApkPath(skinFile.getAbsolutePath());
Resources skinResource = skinLoadApkPath.getSkinResource();
if (attributeName.equals("textColor")) {
TextView textView = (TextView) view;
textView.setTextColor(skinResource.getColorStateList(resId));
}
......
从以上代码看出SkinLoadApkPath类就是我们负责加载空壳apk的类，接下来我们看看如何解析空壳apk获取一个Resource对象:
3.下载服务器空壳apk资源，加载空壳apk获取到一个当前皮肤的Resource skinResource
public class SkinLoadApkPath {
private Resources skinResources;
public Resources getSkinResource(){
return skinResources;
}
/**
* 加载空壳Apk资源
*
* @param apkPath
*/
public void loadEmptyApkPath(String apkPath) {
try {
Resources appResources = SkinManager.getInstance().getApplication().getResources();
if(SkinManager.getInstance().isDefaultSkin()){
//使用默认资源，当前应用的Resource就是皮肤Resource
skinResources = appResources;
}else {
//反射addAssetPath方法进行解析空壳apk
AssetManager assetManager = AssetManager.class.newInstance();
Method addAssetPath = assetManager.getClass().getMethod("addAssetPath", String.class);
addAssetPath.invoke(assetManager, apkPath);
//使用空壳Apk资源,并传入当前App Resource的Metrics,Configuration获取Resource
skinResources = new Resources(assetManager,
appResources.getDisplayMetrics(), appResources.getConfiguration());
}
} catch (Exception e) {
Log.d("Skin","发生异常");
}
}
}
步骤4：通过解析换肤属性的资源id在skinResource中寻找对应的值，并设置给控件对象
空壳apk的Resource赋值到skinResources中了，SkinAttribute的loadView方法只需要传入空壳apk的路径即可获取到皮肤对应的Resource,接下来通过Resource的api,控件对象,资源id设置对应的属性值:
String skinName = SkinManager.getInstance().getCurrentSkin();
File skinFile = new File(view.getContext().getCacheDir(), skinName);
//拿到空壳App资源
if (!SkinManager.getInstance().isDefaultSkin()) {
//如果皮肤包不存在，那么先从asset里进行拷贝到SD卡【模拟从服务器下载过程】
if (!skinFile.exists()) {
//复制文件
FileUtils.copyFileFromAssets(view.getContext(), skinName,
view.getContext().getCacheDir().getAbsolutePath(), skinName);
}
}
SkinLoadApkPath skinLoadApkPath = new SkinLoadApkPath();
skinLoadApkPath.loadEmptyApkPath(skinFile.getAbsolutePath());
Resources skinResource = skinLoadApkPath.getSkinResource();
if (attributeName.equals("textColor")) {
TextView textView = (TextView) view;
textView.setTextColor(skinResource.getColorStateList(resId));
}
if (attributeName.equals("background")) {
view.setBackgroundColor(skinResource.getColor(resId));
}
if (attributeName.equals("tabIndicatorColor")) {
//TabLayout下划线颜色
TabLayout tabLayout = (TabLayout) view;
tabLayout.setSelectedTabIndicatorColor(skinResource.getColor(resId));
}
if (attributeName.equals("tabSelectedTextColor")) {
//TabLayout选中文本颜色
TabLayout tabLayout = (TabLayout) view;
tabLayout.setTabTextColors(Color.BLACK, skinResource.getColor(resId));
}
这里还要说明一点，demo中皮肤管理界面切换相应的皮肤时，会出现短暂的黑屏闪烁现象，其原因是调用了该界面的recreate方法导致的，为了更好的用户体验，此界面需要手动在Activity添加逻辑进行皮肤改变，这样用户在此界面切换皮肤时不会出现闪屏，并完成了皮肤切换效果，也就达到了网易云那种秒切效果。整体代码如下:
Github整体代码demo：SwitchSkinDemo
4.动手打造换肤的轮子
目前换肤笔者已经封装完毕，只是文档没有写，没有发布到Jitpack上，等文档写了，发布到Jitpack后，你就可以用到自己项目中啦，GitHub地址如下所示:
基于网易云换肤方案打造的轮子:LmySkinSwitcher
5.黑白夜模式切换
以上已经讲解完了网易云换肤方案的原理，而且还实践了代码，最后造成一个可以换肤的轮子，那么黑白夜模式切换自然也是一个水到渠成的事情，用上面的轮子去实践一把吧，打两个空壳apk,一个负责黑夜模式，一个负责白天模式，还有个问题是否跟随系统的黑白夜模式？在Application中提供了一个方法onConfigurationChanged用来判断当前系统处于黑夜还是白天模式，代码如下:
@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
if ((newConfig.uiMode & Configuration.UI_MODE_NIGHT_MASK) == Configuration.UI_MODE_NIGHT_NO) {
//白天模式
} else if ((newConfig.uiMode & Configuration.UI_MODE_NIGHT_MASK) == Configuration.UI_MODE_NIGHT_YES) {
//黑夜模式
}
}
详细的代码笔者这里就不演示了，请读者自行实践哦！
网友评论