文档章节

Android UI:XML文件配置按钮等背景方案

古沐风
 古沐风
发布于 2014/01/24 19:53
字数 777
阅读 3176
收藏 5

  (1)在开发中,我们经常会遇到一些纯色或带边框的简单样式的按钮或div,很多时候,都是用九宫格的背景图片来贴上去。但仔细想来,使用图片也带来了一些性能上的问题,包括过多的图片文件会导致渲染页面的时候需要加载渲染很多图片,以及图片也会带来安装包的增加,最后就是用图片很麻烦的说,就如能够用xml文件配出来,就不用再等UED了。

    (2)按钮文字颜色在不同的状态下也不一样,最开始比较傻,直接通过代码来动态改变,想想就恶心。其实这也是可以通过XML配置出来的。

    

    好,下面就进入正题吧。

注:以下并不局限于按钮,照样可以用于各种view的background。

一)、配置按钮背景

    Android能够支持shape、selector等。shape顾名思义就是定义一个形状,包括边框、填充色、圆角等。如下实例:

  1. <shape  
        xmlns:android="http://schemas.android.com/apk/res/android"  
        android:shape="rectangle">  
        <gradient android:startColor="#FFFF0000"  
            android:endColor="#80FF00FF"  
            android:angle="270" />  
        <padding android:left="50dp"  
            android:top="20dp" android:right="7dp"  
            android:bottom="7dp" />  
        <corners android:radius="8dp" />  
        <solid android:color="#b4000000" /> 
      <stroke android:width="2.0dip"  
            android:color="#b4ffffff"  
            android:dashWidth="3.0dip"  
            android:dashGap="0.0dip" />
    </shape>

简单说明下:

gradient   -- 对应颜色渐变。 startcolor、endcolor就不多说了。 android:angle 是指从哪个角度开始变。

solid      --  填充色。

stroke   --  边框,其中width就是边框线的宽度。

corners  --  是否添加圆角,radius就是圆角的半径。

padding   -- 定义内容离边界的距离。 与android:padding_left、android:padding_right这些是一个道理。


细心的读者就会想到,这个shap好像只描述了一种状态啊,怎么表示按钮的其他状态呢?那就得用到selector了。

selector顾名思义表示选择器的意思,就是能够根据不同的状态选择响应的参数。好了,直接亮代码吧,多说无益:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#53cbff" />
            <corners android:radius="3dp" />
        </shape>      
    </item>
        
    <item android:state_selected="true">
        <shape android:shape="rectangle">
            <solid android:color="#53cbff" />
            <corners android:radius="3dp" />
        </shape>
    </item>
        
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#44b2ff" />
            <corners android:radius="3dp" />
        </shape>
    </item>
</selector>



效果就不再展示了,就是一个蓝色的按钮。

二)、配置按钮的颜色方案

    我们经常会遇到常态是按钮背景是深的,按下去后是浅色背景,这时候就需要按钮文字颜色也能够随之改变,否则效果就大打折扣了。

    肯定,你也会想到其实只要和selector配合使用就好了,如下:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true" android:color="#ffffff"/>
    <item android:state_selected="true" android:color="#ffffff"/>
    <item android:state_pressed="true" android:color="#ffffff"/>
    <item android:color="#aaaaaa"/>
</selector>


使用的时候在android:textColor="@drawable/****"就好了。

好了,具体怎么灵活使用以及他们的含义就自己用实践去摸索吧。


© 著作权归作者所有

共有 人打赏支持
古沐风
粉丝 9
博文 7
码字总数 9598
作品 0
杭州
私信 提问
Android 中UI设计的一些技巧

今天给大家分享的是Android中UI设计的一些技巧,本节内容主要有两点:一是Android按钮(Button)的UI设计,二是:ListView以及GridView的UI设计。 按钮的状态: 我们一般搞UI设计,按钮通常有三个...

鉴客
2011/09/18
551
0
Android自定义Button按钮显示样式

转自:http://www.2cto.com/kf/201108/100751.html Android自定义Button按钮显示样式 现在的用户对APP的外观看得很重要,如果APP内所有元件都用Android默认样式写,估计下面评论里就有一堆在...

天高空
2011/12/22
489
0
Android 用户界面(User Interface)概要

在Android应用程序中,使用View和ViewGroup对象来创建用户界面。有很多类型的View和ViewGroup类,它们都是View类的后代。 View对象是Android平台上用户界面的基础单元。View类用于叫做“wid...

长平狐
2012/10/16
368
0
设置Button背景渐变效果和点击效果

1、设置背景渐变效果,在drawable目录下建buttonshape.xml文件, 内容为: <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" a......

方毅超
2014/05/16
0
0
android自定义button样式

在Android开发应用中,默认的Button是由系统渲染和管理大小的。而我们看到的成功的移动应用,都是有着酷炫的外观和使用体验的。因此,我们在开发产品的时候,需要对默认按钮进行美化。在本篇...

sumpower
2014/02/25
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Linux iptables之mangle表使用案例

mangle表的用途 mangle表的主要功能是根据规则修改数据包的一些标志位,以便其他规则或程序可以利用这种标志对数据包进行过滤或策略路由。 mangel表使用示例 示例1-策略路由1 内网的客户机通...

月下狼
57分钟前
3
0
OSChina 周日乱弹 —— 兼职我想去学学布偶戏

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @clouddyy : 《火炎 - 女王蜂》 《火炎 - 女王蜂》 手机党少年们想听歌,请使劲儿戳(这里) @小鱼丁 :还在睡觉突然接到一个小哥哥电话“x...

小小编辑
今天
77
5
租房软件隐私保护如同虚设

近日,苏州市民赵先生向江苏新闻广播新闻热线025-84658888反映,他在“安居客”手机应用软件上浏览二手房信息,并且使用该软件自动生成的虚拟号码向当地一家中介公司进行咨询。可电话刚挂不久...

linux-tao
今天
3
0
分布式项目(五)iot-pgsql

书接上回,在Mapping server中,我们已经把数据都整理好了,现在利用postgresql存储历史数据。 iot-pgsql 构建iot-pgsql模块,这里我们写数据库为了性能考虑不在使用mybatis,换成spring jd...

lelinked
今天
6
0
一文分析java基础面试题中易出错考点

前言 这篇文章主要针对的是笔试题中出现的通过查看代码执行结果选择正确答案题材。 正式进入题目内容: 1、(单选题)下面代码的输出结果是什么? public class Base { private Strin...

一看就喷亏的小猿
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部