换肤功能接入及原理
2018-01-24 本文已影响220人
好大一只龍
前阵子开源出了自己的mp3剪切器项目,在鸿洋大神公众号的宣传下引来众人关注。本着持续维护的心,计划中项目要实现一个简单的应用内换肤功能。
经过调研发现一款很用心的开源的换肤框架Android-skin-support。它支持应用内换肤、插件式换肤和自定义加载的方式。在这里只介绍一下应用内换肤方式,希望能够抛砖引玉,详细的介绍可以参考它的github。先来看看效果Gif图。
效果图
[图片上传失败...(image-e2132e-1516800042573)]
使用方法
- 先来添加jcenter依赖库,
compile 'skin.support:skin-support:2.2.3'
compile 'skin.support:skin-support-design:2.2.3'
- Application类中增加初始化sdk代码
SkinCompatManager.withoutActivity(this) // 基础控件换肤初始化
.addInflater(new SkinMaterialViewInflater()) // material design 控件换肤初始化[可选]
.setSkinStatusBarColorEnable(false) // 关闭状态栏换肤,默认打开[可选]
.setSkinWindowBackgroundEnable(false) // 关闭windowBackground换肤,默认打开[可选]
.loadSkin();
- 设置需要换肤的控件,我这里主要为toolbar换肤。
<skin.support.widget.SkinCompatToolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
android:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:theme="@style/ThemeOverlay.AppCompat.ActionBar"
- 准备换肤的资源,我这里用的主题颜色以及颜色的名称,放入arrays.xml中。
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- 默认主题颜色 -->
<color name="theme_color">#000000</color>
<!-- theme array -->
<color name="theme_color_redbase">#FB5B81</color>
<color name="theme_color_blue">#0077D9</color>
<color name="theme_color_bluelight">#03A9F4</color>
<color name="theme_color_balck">#000000</color>
<color name="theme_color_teal">#009688</color>
<color name="theme_color_brown">#795548</color>
<color name="theme_color_green">#4CAF50</color>
<color name="theme_color_red">#FF5252</color>
<!-- 主题颜色, 用于换肤, 例如:@color/xx_redbase -->
<string-array name="theme_colors">
<item>@color/theme_color_redbase</item>
<item>@color/theme_color_blue</item>
<item>@color/theme_color_bluelight</item>
<item>@color/theme_color_balck</item>
<item>@color/theme_color_teal</item>
<item>@color/theme_color_brown</item>
<item>@color/theme_color_green</item>
<item>@color/theme_color_red</item>
</string-array>
<!-- 主题名称, 用于换肤, 例如:@color/xx_redbase -->
<string-array name="theme_names">
<item>redbase</item>
<item>blue</item>
<item>bluelight</item>
<item>balck</item>
<item>teal</item>
<item>brown</item>
<item>green</item>
<item>red</item>
</string-array>
</resources>
- 换肤api调用, 这里传入了选中的主题颜色名称,以及换肤的加载方式(应用内换肤)
SkinCompatManager.getInstance().loadSkin(
mThemeColorList.get(mThemeColorAdapter.getPosition()).getName(),
null,SkinCompatManager.SKIN_LOADER_STRATEGY_BUILD_IN);
问题
- 如何定位需要换肤的view,如何进行换肤操作?
- 如何遍历每个activity中的需要换肤的view?
浅析
- 定位需要被换肤view的思路 主要通过
LayoutInflaterFactory
获取到当前activity中所有的组件,通过过滤定位到需要换肤的view。可以参考鸿洋的这篇文章 Android 探究 LayoutInflater setFactory。
SkinCompatDelegate
类实现了LayoutInflaterFactory
接口,并实现了它的createView()
方法, 这里看SkinCompatViewInflater类的createView()
代码如下:
case "View":
view = new SkinCompatView(context, attrs);
break;
case "LinearLayout":
view = new SkinCompatLinearLayout(context, attrs);
break;
case "RelativeLayout":
view = new SkinCompatRelativeLayout(context, attrs);
break;
case "FrameLayout":
view = new SkinCompatFrameLayout(context, attrs);
break;
case "TextView":
view = new SkinCompatTextView(context, attrs);
break;
case "ImageView":
view = new SkinCompatImageView(context, attrs);
break;
可以看到在createView
遍历后将其替换了对应的Skin开头的对应的类。而Skin开头的类是什么呢, 来看SkinCompatView
类。
public class SkinCompatView extends View implements SkinCompatSupportable {
private SkinCompatBackgroundHelper mBackgroundTintHelper;
...
@Override
public void setBackgroundResource(int resId) {
super.setBackgroundResource(resId);
if (mBackgroundTintHelper != null) {
mBackgroundTintHelper.onSetBackgroundResource(resId);
}
}
@Override
public void applySkin() {
if (mBackgroundTintHelper != null) {
mBackgroundTintHelper.applySkin();
}
}
}
可以看到它实现了SkinCompatSupportable
接口以及其applySkin
方法,该方法就是换肤的实现方法了。
接着来看SkinCompatDelegate.onCreateView()
@Override
public View onCreateView(View parent, String name, Context context, AttributeSet attrs) {
View view = createView(parent, name, context, attrs);
if (view == null) {
return null;
}
if (view instanceof SkinCompatSupportable) {
mSkinHelpers.add(new WeakReference<>((SkinCompatSupportable) view));
}
return view;
}
上文已经将view转换为Skin开头的View(实现了SkinCompatSupportable
的View)可以看到将其缓存到了mSkinHelpers数组中。再看SkinCompatDelegate.applySkin()
public void applySkin() {
if (mSkinHelpers != null && !mSkinHelpers.isEmpty()) {
for (WeakReference ref : mSkinHelpers) {
if (ref != null && ref.get() != null) {
((SkinCompatSupportable) ref.get()).applySkin();
}
}
}
}
该方法就是换肤的操作了,遍历缓存中所有的view,执行其换肤方法applySkin
。这里我们再看一下applySkin里面的实现,来看SkinBuildInLoader.getTargetResourceEntryName()
。
@Override
public String getTargetResourceEntryName(Context context, String skinName, int resId) {
return context.getResources().getResourceEntryName(resId) + "_" + skinName;
}
- 第二个问题,可以通过BaseActivity的方式来达到目的,但是有更好的方式。来看
SkinActivityLifecycle
的构造方法application.registerActivityLifecycleCallbacks(this);
。注册之后没个activity的声明周期回调都会在该类中回调到, 如onActivityCreated()
。
@Override
public void onActivityCreated(Activity activity, Bundle savedInstanceState) {
if (isContextSkinEnable(activity)) {
installLayoutFactory(activity);
updateStatusBarColor(activity);
updateWindowBackground(activity);
if (activity instanceof SkinCompatSupportable) {
((SkinCompatSupportable) activity).applySkin();
}
}
}
在每个activity创建后都会对应执行到installLayoutFactory(activity)
方法,从而达到对每个activity 换肤view做收集换肤的目的。
到此,基本原理,都阐述完了,具体不懂的更详细的还要结合源码来看,如下: