Android应用切换皮肤功能实现(二)

原文地址http://www.apkbus.com/forum.php?mod=viewthread&tid=149034&highlight=%E7%9A%AE%E8%82%A4

上次写完应用切换皮肤功能实现的时候，有网友提了些问题。我觉得上次说的还不够详细吧。现在接着再写详细点。
这次再在布局里增加了三个按钮图片的设置和一个字体颜色的设置。
1.其实上次只是讲到了切换皮肤时，只是替换了图片资源，其实连布局都可以切换。当然布局的切换要是apk类型的皮肤包才行。
首先我们写好3个布局，把三个按钮放在界面的上中下。
1）按钮在上面

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/main"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin" >

<TextView

android:id="@+id/text"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="点击界面到设置皮肤界面"

android:textColor="#000000"

android:textSize="20sp" >

</TextView>

<LinearLayout

android:layout_alignParentTop="true"

android:id="@+id/buttonLinear"

android:layout_width="fill_parent"

android:layout_height="wrap_content" >

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/prev"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/prev" />

</LinearLayout>

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/play"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/play" />

</LinearLayout>

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/next"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/next" />

</LinearLayout>

</LinearLayout>

</RelativeLayout>

复制代码

2）按钮在中间：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/main"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin" >

<TextView

android:id="@+id/text"

android:layout_alignParentBottom="true"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="点击界面到设置皮肤界面"

android:textColor="#000000"

android:textSize="20sp" >

</TextView>

<LinearLayout

android:layout_centerInParent="true"

android:id="@+id/buttonLinear"

android:layout_width="fill_parent"

android:layout_height="wrap_content" >

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/prev"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/prev" />

</LinearLayout>

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/play"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/play" />

</LinearLayout>

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/next"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/next" />

</LinearLayout>

</LinearLayout>

</RelativeLayout>

复制代码

3）按钮在下面：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/main"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin" >

<TextView

android:id="@+id/text"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:text="点击界面到设置皮肤界面"

android:textColor="#000000"

android:textSize="20sp" >

</TextView>

<LinearLayout

android:layout_alignParentBottom="true"

android:id="@+id/buttonLinear"

android:layout_width="fill_parent"

android:layout_height="wrap_content" >

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/prev"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/prev" />

</LinearLayout>

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/play"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/play" />

</LinearLayout>

<LinearLayout

android:layout_width="0.0dip"

android:layout_height="fill_parent"

android:layout_weight="1.0"

android:gravity="center" >

<ImageButton

android:id="@+id/next"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="center"

android:src="@drawable/next" />

</LinearLayout>

</LinearLayout>

</RelativeLayout>

复制代码

这些布局分别放在不同的apk包里。命名要相同，这里都叫activity_main.xml。
然后在BaseActivity里根据不同的皮肤上下文。就可以创建出不同的布局文件。这样就实现了同一个界面，在不同皮肤里。图片不同，布局也不同。
根据不同皮肤上下文，创建view的代码如下：

public static View createViewFromResource(Context context,String layoutName,ViewGroup root, boolean attachToRoot) {

View resultView =null;

try{

Context ct =getSkinContext(context);

int resid = ct.getResources().getIdentifier(layoutName, "layout", ct.getPackageName());

if(resid != 0){

resultView= currentInflater.inflate(resid, root, attachToRoot);

}else{

resid = context.getResources().getIdentifier(layoutName, "layout",context.getPackageName());

resultView= defalutInflater.inflate(resid, root, attachToRoot);

}

}catch(Exception e){

e.printStackTrace();

}

return resultView;

}

复制代码

2.另外一个是字体颜色的设置。因为不同的皮肤下，假如字体颜色不跟着皮肤变化的话，看着会非常的别扭。
我们只需要把字体颜色放在一个xml里。不同的皮肤，解析不同的xml得到颜色，就可以实现字体颜色根据皮肤变化了。
这部分代码如下：

public static int getColorByName(String name){

int res = -1;

try {

String xmlFileName ="skin_color.xml";

Document doc = getDocumentByFile(xmlFileName);

if(doc != null){

String value = getColorByName(doc,name);

res=Color.parseColor(value);

}

} catch (Exception e) {

e.printStackTrace();

}

return res;

}

private synchronized static Document getDocumentByFile(String xmlFileName) throws Exception{

String path = Constant.SKIN_DIR+"skin_color.xml";

File file = new File(path);

if(file.exists())

{

InputStream inputStream = null;

try {

inputStream = new FileInputStream(file);

return getDocument(inputStream);

} catch (Exception e) {

e.printStackTrace();

}

}

return getDocument(MyApplication.getApplication().getAssets().open(xmlFileName));

}

private static String getColorByName(Document doc,String name){

NodeList nodeList= doc.getElementsByTagName(name);

String res =null;

if(nodeList != null){

int len = nodeList.getLength();

if(len > 0){

Element el = (Element)nodeList.item(0);

res = el.getAttribute("value");

}else{

}

}

return res;

}

复制代码

下面放上切换皮肤的效果图。无图无真相嘛。
<ignore_js_op>

<ignore_js_op>

<ignore_js_op>

<ignore_js_op>

<ignore_js_op>

<ignore_js_op>


最后是源码，想要源码，就回复一下吧，反正又不会怀孕的。

本帖隐藏的内容

<ignore_js_op>

2.0.zip (6.5 MB, 下载次数: 117)