文档章节

风格化的ToggleButton

鴿神丶
 鴿神丶
发布于 2016/01/03 14:38
字数 787
阅读 15
收藏 0

目标: 

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

步骤: 

1、设置XML属性

我们需要设置ToggleButton的背景,以及当ToggleButton为on或者off时到状态图。

首先,我们设置ToggleButton的背景,建立 /res/drawable/btn_toggle_bg.xml

<?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/3470224


本文转载自:http://blog.csdn.net/billpig/article/details/6634481

鴿神丶
粉丝 3
博文 43
码字总数 6887
作品 0
渝北
私信 提问
android 自定义View与Attr风格Style风格样式

一.自定义View的主题和风格样式 前言: android开发中,不可避免的要设定某一类按钮的按压,点击,聚焦等状态,通常对于这一类问题而言,最原始的方式就是在布局文件中亲自设定,然而对于一个...

IamOkay
2014/12/07
0
0
Android 自定义弹出对话框实例

在编写代码过程中,对于弹出框,事先写好的布局文件往往不能满足我们的需求,这时我们需要自己定义样式。 1、首先新建一个xml文件,这里以设置音效开关为例 myview.xml如下:

wty530
2015/04/13
0
0
转 Android 实现自动接听和挂断电话功能

添加权限 main.xml PhoneUtils.java是手机功能类,从TelephonyManager中实例化ITelephony并返回,源码如下: package com.testTelephony; import java.lang.reflect.Field; import java.lan......

bidaround
2014/09/03
352
0
Android控件笔记——多状态按钮ToggleButton

1、什么是ToggleButton: ToggleButton有两种状态:选中状态和未选中状态,并且需要为不同的状态设置不同的显示文本。 2、ToggleButton属性: android:checked="true" android:textOff="关"......

落叶-归根
2016/05/13
95
0
Android控件--ToggleButton

1.什么是ToggleButton ToggleButton有两种状态:选中和未选中状态 并且需要为不同的状态设置不同的显示文本 2.ToggleButton属性 android:checked="true" android:textOff="关" android:textO......

大道无名
2016/09/20
17
0

没有更多内容

加载失败,请刷新页面

加载更多

代码规范

代码格式化 安装vscode插件:Prettier - Code formatter 格式化配置:将下列配置写入到vscode的settings.json文件 (遵照代码格式化) "prettier.disableLanguages": ["vue"], "prettier.......

TreeZhou0511
57分钟前
3
0
python实现人工神经网络的一个例子

人工神经网络已经有无数的开源框架,比如tensorflow,caffe等,可以直接用。但最近需要做一个小样例,把基本思想讲一讲,因此自己写了一个demo,以供参考。 下面直接上代码,代码中有注释,比...

propagator
今天
4
0
远程dubugger

1、在tomcat的bin下/data/project/XXX/apache-tomcat-8.5.23/bin 在catalina.bat文件中新增如下即可 JAVA_OPTS="-Xmx1024m -Xms1024m -agentlib:jdwp=transport=dt_socket,server=y,suspend......

一只小青蛙
今天
1
0
jemter 连接MySQL

jemter 连接MySQL 点击测试计划,测试计划最后”添加目录或jar包到ClassPath“,点击浏览,添加mysql-connector.jar mysql-connector.jar的下载地址: https://mvnrepository.com/artifact/my...

xiaobai1315
今天
5
0
第一次尝试用python实现zabbix主机的批量添加批量删除及模板导入脚本

Python3入门练手尝试篇 API参考: zabbix API 4.0版本:https://www.zabbix.com/documentation/4.0/zh/manual/api #!/bin/python3import xlrd,os,json,requests,sys#参考zabbix API 4.0版本......

平头哥-Enjoystudy
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部