Android到默认UI比iOS到默认UI在美观程度上还是有一定到差距的,我们希望能够美化UI,并且替换掉系统默认的UI风格,使得程序在使用这些UI的时候都默认使用我们自定义到UI。本文以ToggleButton为例,介绍如何使用,下图是效果图。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+android:id/background" android:drawable="@android:color/transparent" />
<item android:id="@+android:id/toggle" android:drawable="@drawable/btn_toggle" />
</layer-list>

在这里,我们使用layer-list把ToggleButton分成2个图层,底层是背景(设置成透明),顶层是selector效果图

接下来,设置ToggleButton的on和off的selector效果图:

建立/res/drawable/btn_toggle.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:drawable="@drawable/btn_toggle_no" />
<item android:state_checked="true" android:drawable="@drawable/btn_toggle_yes" />
</selector>

使用到以下两张图,也可通过以下链接查找http://bit.ly/pn5dmA

    
到此,我们已经把ToggleButton的效果已经制作完毕.

2、设置Style & Theme

ToggleButton到效果图已经制作完毕,接下来,我们就要把这种效果设置成一种统一的风格,否则我们在使用的时候必须每次都得显示指定这种
风格,在这里,即:在声明ToggleButton的时候,每次都得指定
android:background="@drawable/btn_toggle_bg"。

我们希望达到到效果是,当我们每次使用ToogleButton的时候,默认就是使用我们所设置的风格。在此之前,最好先阅读下android自带到文档:basics of creating Android themes,对style和theme有一定的了解。

接下来,建立/res/drawable/themes.xml文件

<style name="Widget.Button.Toggle" parent="android:Widget">
<item name="android:background">@drawable/btn_toggle_bg</item>
<item name="android:textOn">@null</item>
<item name="android:textOff">@null</item>
<item name="android:clickable">true</item>
<item name="android:disabledAlpha">?android:attr/disabledAlpha</item>
</style>

在这里,要把textOn和textOff的属性设置为null,否则,系统会在按钮上显示文字,这个可根据使用情况而定。

然后,把该风格设置成主题

<style name="YourThemeName" parent="@android:Theme.Black">
<!-- 告诉Android当创建ToggleButton的时候使用自定义风格 -->
<item name="android:buttonStyleToggle">@style/Widget.Button.Toggle</item>
<!-- 在这里可以添加更多的选项... -->
</style>

之后,只需要在AndroidManifest.xml的<application>标签里设置主题即可(android:theme="@style/YourThemeName")

3、注意事项

  • <重要>为了提供更通用到效果,应该把图片设置成.9.png格式,使图片可扩展
  • 很多人都以疑问,到底如何知道这些控件或者主题到属性? 这些都在Android到源代码里面可以找到,具体位置在\base\core\res\res\values\里
  • 项目源码下载:http://download.csdn.net/source/347022

Android 风格化的 Toggle Buttons的更多相关文章

  1. Android解决AVD Hardware Buttons 和DPAD无法使用问题

    如图所示按键用鼠标点击时无法响应. 解决方案: 以我创建的AVD名为Tablet为例 1.找到用户目录(我的用户目录yummy),然后进入如下目录 mac: ~/yummy/.android/avd/ ...

  2. In Depth : Android Shutdown Sequence

    What happened when I long press power button ?What is shutdown sequence ?How is it different from de ...

  3. Android API 指南

    原文链接:http://android.eoe.cn/topic/android_sdk Android API 指南 - Android API Guides 应用的组成部分 - Applicati ...

  4. Android开发之API应用指南

    原文:http://android.eoe.cn/topic/android_sdk 编辑流程 这里主要是和Android技术相关的开发指南,很多都是来源于官方的API Guides( http:// ...

  5. android基础组件---->Checkboxe的使用

    由于使用比较简单,这篇博客涵盖Checkboxes和Radio Buttons和Toggle Buttons.好了我们开始今天的学习.我被世俗隐瞒,转身又被自己撞倒.从莫须有的罪名起步,行色简单,心术 ...

  6. Android Lint Checks

    Android Lint Checks Here are the current list of checks that lint performs as of Android Studio 2.3 ...

  7. Android 自学之基本界面组件(下)

    按钮(Button)与图片按钮(ImageButton)组件的功能和用法 Button继承了TextView,ImageButton继承了Button.不管是Button还是ImageButton,他 ...

  8. android开发之merge结合include优化布局

    merge结合include优化android布局,效果不知道,个人感觉使用上也有很大的局限,不过还是了解一下,记录下来. 布局文件都要有根节点,但android中的布局嵌套过多会造成性能问题,于是在 ...

  9. android开发布局优化之ViewStub

    使用ViewStub可以延迟加载一个布局文件,提高显示速率.刚开始接触到,记录下来. 关于viewstub的使用,我们可以在不同的布局中使用,比如可以根据设备的大小动态决定显示哪个界面. viewst ...

随机推荐

  1. Android 内存溢出管理与测试

    今天发现正在做的项目,时不时的会报错:dalvikvm heap out of memory on a 7458832-byte allocation (堆分配的内存溢出) 为什么会内存溢出呢?我以前 ...

  2. iOS开发——企业证书(免审核 299$)

    (最近准备考试……空闲截图整理成博客)

  3. (转)Quartz.NET管理类

    最近做项目设计到Quartz.NET,写了一个Quartz.NET管理类,在此记录下. public class QuartzManager<T> where T : class,IJob ...

  4. android测试的相关概念以及单元测试

    1.测试的相关概念  1.根据是否知道源代码分类: 黑盒测试: a - b - c  边值测试    白盒测试: 根据源代码写测试方法 或者 测试用例; 2.根据测试的粒度分类: 方法测试:写完一个方 ...

  5. ZOJ 2392 The Counting Problem(模拟)

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=1368 题目大意:计算从S到T中所有的数,其中0,1,2,3,4,5, ...

  6. 初识XML及简单工厂运用--网络电视精灵

    网络电视精灵 任务描述 1. 解析XML文件中的数据 三个简单的xml文件; <?xml version="1.0" encoding="utf-8" ? ...

  7. TreeSet集合

    TreeSet集合 TreeSet集合是一个依靠TreeMap实现的有序集合,内部存储元素是自动按照自然排序进行排列,所以如果想要保留存储时的顺序,那么就不建议使用TreeSet. TreeSet继承 ...

  8. width(),innerHTML(),outerHTML()

    HTML代码: <div id="box"> <p>哈哈,随便写点内容</p> <p>删除的实例</p> <p&g ...

  9. JQuery 事件器的介绍

    基本用法 $(元素). 事件( 事件属性); 常见事件 示例 说明 $(selector).click()  被选元素的点击事件 $(selector).dblclick()  被选元素的双击事件 $ ...

  10. 推荐一个优秀的前端框架——Bootstrap

    Bootstrap是Twitter推出的一个开源的用于前端开发的工具包.它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架.Bootstra ...