文档章节

#爱加密杯#Android应用切换皮肤功能实现

科技创造
 科技创造
发布于 2015/03/23 14:41
字数 1349
阅读 12
收藏 0

 

 

  #爱加密杯#Android应用切换皮肤功能实现

当然布局的切换要是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.                 
  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>
复制代码




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.                 
  48.                 android:scaleType="center"
  49.                 android:src="@drawable/play" />
  50.         </LinearLayout>
  51.         <LinearLayout
  52.             android:layout_width="0.0dip"
  53.             android:layout_height="fill_parent"
  54.             android:layout_weight="1.0"
  55.             android:gravity="center" >
  56.             <ImageButton
  57.                 android:id="@+id/next"
  58.                 android:layout_width="wrap_content"
  59.                 android:layout_height="wrap_content"                
  60.                 android:scaleType="center"
  61.                 android:src="@drawable/next" />
  62.         </LinearLayout>
  63.     </LinearLayout>
  64. </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.                 
  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>
复制代码


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

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


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

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


下面放上切换皮肤的效果图。无图无真相嘛。
<ignore_js_op style='font: 15px/24px Arial, "Microsoft Yahei", "Hiragino Sans GB", "Simsun,sans-self"; color: rgb(51, 51, 51); text-transform: none; text-indent: 0px; letter-spacing: normal; word-spacing: 0px; display: block; white-space: normal; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal; background-color: rgb(255, 255, 255); -webkit-text-stroke-width: 0px;'><ignore_js_op style='font: 15px/24px Arial, "Microsoft Yahei", "Hiragino Sans GB", "Simsun,sans-self"; color: rgb(51, 51, 51); text-transform: none; text-indent: 0px; letter-spacing: normal; word-spacing: 0px; display: block; white-space: normal; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal; background-color: rgb(255, 255, 255); -webkit-text-stroke-width: 0px;'><ignore_js_op style='font: 15px/24px Arial, "Microsoft Yahei", "Hiragino Sans GB", "Simsun,sans-self"; color: rgb(51, 51, 51); text-transform: none; text-indent: 0px; letter-spacing: normal; word-spacing: 0px; display: block; white-space: normal; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal; background-color: rgb(255, 255, 255); -webkit-text-stroke-width: 0px;'><ignore_js_op style='font: 15px/24px Arial, "Microsoft Yahei", "Hiragino Sans GB", "Simsun,sans-self"; color: rgb(51, 51, 51); text-transform: none; text-indent: 0px; letter-spacing: normal; word-spacing: 0px; display: block; white-space: normal; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal; background-color: rgb(255, 255, 255); -webkit-text-stroke-width: 0px;'><ignore_js_op style='font: 15px/24px Arial, "Microsoft Yahei", "Hiragino Sans GB", "Simsun,sans-self"; color: rgb(51, 51, 51); text-transform: none; text-indent: 0px; letter-spacing: normal; word-spacing: 0px; display: block; white-space: normal; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal; background-color: rgb(255, 255, 255); -webkit-text-stroke-width: 0px;'><ignore_js_op style='font: 15px/24px Arial, "Microsoft Yahei", "Hiragino Sans GB", "Simsun,sans-self"; color: rgb(51, 51, 51); text-transform: none; text-indent: 0px; letter-spacing: normal; word-spacing: 0px; display: block; white-space: normal; -ms-word-wrap: break-word; font-size-adjust: none; font-stretch: normal; background-color: rgb(255, 255, 255); -webkit-text-stroke-width: 0px;'>

© 著作权归作者所有

科技创造
粉丝 37
博文 199
码字总数 174505
作品 0
徐汇
程序员
私信 提问
换肤方案,换肤策略,App插件式换肤实现方案

换肤的本质就是去替换资源文件。我们知道,Android应用程序由代码和资源组成。所以皮肤其实就是一个仅包含资源的apk文件。换肤三部曲:下载皮肤文件 ->获取资源 ->替换.Android程序的资源分为...

desaco
01/01
0
0
Android UI换皮肤或 白天黑夜模式

> 白天夜间模式场景,换肤框架 -- 关于三种『应用内主题切换』开源项目的一点思考- https://www.jianshu.com/p/2164fa5803b9 1.Theme的方案,在style文件中定义不同的主题即可 2.遍历View,对...

desaco
2018/08/27
0
0
Android实现换肤功能(二)

前两天写的上章关于换肤的功能获得了很好的反响,今天为大家介绍另一种方式。今天实现的策略也是网友建议的,然后我自己去写了个demo,大家自己评估下相比第一种方式的优势和劣势在哪里。 简...

Jack_1900
2014/08/10
1K
3
Android应用如何实现换肤功能

转载请注明出处,商用请与本人联系。 本系列专题培训适用范围:初级Android程序员,即有J2SE基础和Android初级水平。J2SE基础是指掌握JAVA语法,1.5、1.6新增的语法不完全掌握也没关系。了解...

嘻哈开发者
2014/03/10
221
0
Android 打造自己的个性化应用(一):应用程序换肤主流方式的分析与概述

Android平台api没有特意为换肤提供一套简便的机制,这可能是外国的软件更注重功能和易用,不流行换肤。系统不提供直接支持,只能自行研究。 换肤,可以认为是动态替换资源(文字、颜色、字体...

长平狐
2012/09/03
1K
0

没有更多内容

加载失败,请刷新页面

加载更多

CRM、DMP、CDP都是什么?有什么区别?

Markter对CRM系统(Customer Relationship Management System,客户关系管理系统),营销自动化等概念都已经比较熟悉,也许DMP(Data Management Platform,数据管理平台)也多多少少有些了解。...

怡海软件-CRM
12分钟前
4
0
中台是什么,到底要解决什么问题?

故事的开始 这个最早由阿里在2015年提出的“大中台,小前台”战略中延伸出来的概念,最近在国内大热。阿里、腾讯、百度、京东、美团、滴滴等一众互联网巨头,从去年到今年,接连开始组织架构...

喵二狸
24分钟前
3
0
Linux Centos 7 - MySQL 5.7离线安装

内部网络通过离线包的方式进行安装。 一、下载 下载地址:https://dev.mysql.com/downloads/mysql/ 进入页面后,点击右侧链接。 下载对应版本。 通过xftp6等工具上传到服务器上。 二、安装和...

华山猛男
24分钟前
3
0
EventBus 3 全解

EventBus 3 全解 [TOC] 使用 一个基于观察者模式的事件发布/订阅框架. 用于模块间通信和解耦, 使用方便,性能高. 基本使用 1. gradle导入依赖库 implementation 'org.greenrobot:eventbus:3....

马湖村第九后羿
26分钟前
4
0
HTTP 协议

什么是HTTP协议? HTTP是hypertext transport protocol的缩写,即超文本传输协议。 是用于万维网服务器与本地浏览器之间传输超文本的传送协议。可以使浏览器更加高效,使网络传输减少。能够保...

彩色泡泡糖
37分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部