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

2023-03-18 11:00:04

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

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

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:id="@+id/main"
  4. android:layout_width="match_parent"
  5. android:layout_height="match_parent"
  6. tools:context=".MainActivity"
  7. android:paddingBottom="@dimen/activity_vertical_margin"
  8. android:paddingLeft="@dimen/activity_horizontal_margin"
  9. android:paddingRight="@dimen/activity_horizontal_margin"
  10. android:paddingTop="@dimen/activity_vertical_margin" >
  11. <TextView
  12. android:id="@+id/text"
  13. android:layout_width="wrap_content"
  14. android:layout_height="wrap_content"
  15. android:layout_centerInParent="true"
  16. android:text="点击界面到设置皮肤界面"
  17. android:textColor="#000000"
  18. android:textSize="20sp" >
  19. </TextView>
  20. <LinearLayout
  21. android:layout_alignParentTop="true"
  22. android:id="@+id/buttonLinear"
  23. android:layout_width="fill_parent"
  24. android:layout_height="wrap_content" >
  25. <LinearLayout
  26. android:layout_width="0.0dip"
  27. android:layout_height="fill_parent"
  28. android:layout_weight="1.0"
  29. android:gravity="center" >
  30. <ImageButton
  31. android:id="@+id/prev"
  32. android:layout_width="wrap_content"
  33. android:layout_height="wrap_content"
  34. android:scaleType="center"
  35. android:src="@drawable/prev" />
  36. </LinearLayout>
  37. <LinearLayout
  38. android:layout_width="0.0dip"
  39. android:layout_height="fill_parent"
  40. android:layout_weight="1.0"
  41. android:gravity="center" >
  42. <ImageButton
  43. android:id="@+id/play"
  44. android:layout_width="wrap_content"
  45. android:layout_height="wrap_content"
  46. android:scaleType="center"
  47. android:src="@drawable/play" />
  48. </LinearLayout>
  49. <LinearLayout
  50. android:layout_width="0.0dip"
  51. android:layout_height="fill_parent"
  52. android:layout_weight="1.0"
  53. android:gravity="center" >
  54. <ImageButton
  55. android:id="@+id/next"
  56. android:layout_width="wrap_content"
  57. android:layout_height="wrap_content"
  58. android:scaleType="center"
  59. android:src="@drawable/next" />
  60. </LinearLayout>
  61. </LinearLayout>
  62. </RelativeLayout>

复制代码

2）按钮在中间：

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:id="@+id/main"
  4. android:layout_width="match_parent"
  5. android:layout_height="match_parent"
  6. tools:context=".MainActivity"
  7. android:paddingBottom="@dimen/activity_vertical_margin"
  8. android:paddingLeft="@dimen/activity_horizontal_margin"
  9. android:paddingRight="@dimen/activity_horizontal_margin"
  10. android:paddingTop="@dimen/activity_vertical_margin" >
  11. <TextView
  12. android:id="@+id/text"
  13. android:layout_alignParentBottom="true"
  14. android:layout_width="wrap_content"
  15. android:layout_height="wrap_content"
  16. android:layout_centerInParent="true"
  17. android:text="点击界面到设置皮肤界面"
  18. android:textColor="#000000"
  19. android:textSize="20sp" >
  20. </TextView>
  21. <LinearLayout
  22. android:layout_centerInParent="true"
  23. android:id="@+id/buttonLinear"
  24. android:layout_width="fill_parent"
  25. android:layout_height="wrap_content" >
  26. <LinearLayout
  27. android:layout_width="0.0dip"
  28. android:layout_height="fill_parent"
  29. android:layout_weight="1.0"
  30. android:gravity="center" >
  31. <ImageButton
  32. android:id="@+id/prev"
  33. android:layout_width="wrap_content"
  34. android:layout_height="wrap_content"
  35. android:scaleType="center"
  36. android:src="@drawable/prev" />
  37. </LinearLayout>
  38. <LinearLayout
  39. android:layout_width="0.0dip"
  40. android:layout_height="fill_parent"
  41. android:layout_weight="1.0"
  42. android:gravity="center" >
  43. <ImageButton
  44. android:id="@+id/play"
  45. android:layout_width="wrap_content"
  46. android:layout_height="wrap_content"
  47. android:scaleType="center"
  48. android:src="@drawable/play" />
  49. </LinearLayout>
  50. <LinearLayout
  51. android:layout_width="0.0dip"
  52. android:layout_height="fill_parent"
  53. android:layout_weight="1.0"
  54. android:gravity="center" >
  55. <ImageButton
  56. android:id="@+id/next"
  57. android:layout_width="wrap_content"
  58. android:layout_height="wrap_content"
  59. android:scaleType="center"
  60. android:src="@drawable/next" />
  61. </LinearLayout>
  62. </LinearLayout>
  63. </RelativeLayout>

复制代码

3）按钮在下面：

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:id="@+id/main"
  4. android:layout_width="match_parent"
  5. android:layout_height="match_parent"
  6. tools:context=".MainActivity"
  7. android:paddingBottom="@dimen/activity_vertical_margin"
  8. android:paddingLeft="@dimen/activity_horizontal_margin"
  9. android:paddingRight="@dimen/activity_horizontal_margin"
  10. android:paddingTop="@dimen/activity_vertical_margin" >
  11. <TextView
  12. android:id="@+id/text"
  13. android:layout_width="wrap_content"
  14. android:layout_height="wrap_content"
  15. android:layout_centerInParent="true"
  16. android:text="点击界面到设置皮肤界面"
  17. android:textColor="#000000"
  18. android:textSize="20sp" >
  19. </TextView>
  20. <LinearLayout
  21. android:layout_alignParentBottom="true"
  22. android:id="@+id/buttonLinear"
  23. android:layout_width="fill_parent"
  24. android:layout_height="wrap_content" >
  25. <LinearLayout
  26. android:layout_width="0.0dip"
  27. android:layout_height="fill_parent"
  28. android:layout_weight="1.0"
  29. android:gravity="center" >
  30. <ImageButton
  31. android:id="@+id/prev"
  32. android:layout_width="wrap_content"
  33. android:layout_height="wrap_content"
  34. android:scaleType="center"
  35. android:src="@drawable/prev" />
  36. </LinearLayout>
  37. <LinearLayout
  38. android:layout_width="0.0dip"
  39. android:layout_height="fill_parent"
  40. android:layout_weight="1.0"
  41. android:gravity="center" >
  42. <ImageButton
  43. android:id="@+id/play"
  44. android:layout_width="wrap_content"
  45. android:layout_height="wrap_content"
  46. android:scaleType="center"
  47. android:src="@drawable/play" />
  48. </LinearLayout>
  49. <LinearLayout
  50. android:layout_width="0.0dip"
  51. android:layout_height="fill_parent"
  52. android:layout_weight="1.0"
  53. android:gravity="center" >
  54. <ImageButton
  55. android:id="@+id/next"
  56. android:layout_width="wrap_content"
  57. android:layout_height="wrap_content"
  58. android:scaleType="center"
  59. android:src="@drawable/next" />
  60. </LinearLayout>
  61. </LinearLayout>
  62. </RelativeLayout>

复制代码

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

  1. public static  View createViewFromResource(Context context,String layoutName,ViewGroup root, boolean  attachToRoot) {
  2. View resultView =null;
  3. try{
  4. Context ct =getSkinContext(context);
  5. int resid = ct.getResources().getIdentifier(layoutName, "layout", ct.getPackageName());
  6. if(resid != 0){
  7. resultView= currentInflater.inflate(resid, root, attachToRoot);
  8. }else{
  9. resid = context.getResources().getIdentifier(layoutName, "layout",context.getPackageName());
  10. resultView= defalutInflater.inflate(resid, root, attachToRoot);
  11. }
  12. }catch(Exception e){
  13. e.printStackTrace();
  14. }
  15. return resultView;
  16. }

复制代码

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

  1. public static int getColorByName(String name){
  2. int res = -1;
  3. try {
  4. String xmlFileName ="skin_color.xml";
  5. Document doc  =  getDocumentByFile(xmlFileName);
  6. if(doc != null){
  7. String value = getColorByName(doc,name);
  8. res=Color.parseColor(value);
  9. }
  10. } catch (Exception e) {
  11. e.printStackTrace();
  12. }
  13. return res;
  14. }
  15. private synchronized static Document getDocumentByFile(String xmlFileName) throws Exception{
  16. String path = Constant.SKIN_DIR+"skin_color.xml";
  17. File file = new File(path);
  18. if(file.exists())
  19. {
  20. InputStream inputStream = null;
  21. try {
  22. inputStream = new FileInputStream(file);
  23. return getDocument(inputStream);
  24. } catch (Exception e) {
  25. e.printStackTrace();
  26. }
  27. }
  28. return getDocument(MyApplication.getApplication().getAssets().open(xmlFileName));
  29. }
  30. private static String getColorByName(Document doc,String name){
  31. NodeList nodeList= doc.getElementsByTagName(name);
  32. String res =null;
  33. if(nodeList != null){
  34. int len = nodeList.getLength();
  35. if(len > 0){
  36. Element el = (Element)nodeList.item(0);
  37. res = el.getAttribute("value");
  38. }else{
  39. }
  40. }
  41. return res;
  42. }

复制代码

下面放上切换皮肤的效果图。无图无真相嘛。
<ignore_js_op>Android应用切换皮肤功能实现(二)<ignore_js_op>Android应用切换皮肤功能实现(二)<ignore_js_op>Android应用切换皮肤功能实现(二)<ignore_js_op>Android应用切换皮肤功能实现(二)<ignore_js_op>Android应用切换皮肤功能实现(二)<ignore_js_op>Android应用切换皮肤功能实现(二)

最后是源码，想要源码，就回复一下吧，反正又不会怀孕的。Android应用切换皮肤功能实现(二)

本帖隐藏的内容

<ignore_js_op>Android应用切换皮肤功能实现(二) 2.0.zip (6.5 MB, 下载次数: 117)

上一篇：Redis入门和Java利用jedis操作redis


下一篇：Java中Jedis操作Redis与Spring的整合