Android中Shape、Layer、Selector的使用

1.Shape
通过Shape可以在xml中绘制各种形状
在res/drawable文件夹下,新建一个文件:shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    >
</shape>

Shape文件根元素是<shape>,可以根据shape属性指定基本形状,允许的值有:rectangle(矩形),oval(椭圆),line(线条), ring(环)。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="oval"
    >
</shape>

仅当形状定义为ring时,下列属性才可用:
innerRadius //内环半径,可覆盖innerRadiusRatio
innerRadiusRatio //内环的厚度比,即环的宽度比表示内环半径
thickness //环的厚度,可覆盖thicknessRatio
thicknessRatio //环的厚度比,即环的宽度比表示环的厚度

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="ring"
 android:innerRadius="integer"          
 android:innerRadiusRatio="float"      
 android:thickness="integer"             
 android:thicknessRatio="float"    
    >
</shape>

shape有corners、gradient、padding、size、solid、stroke这几个子标签

corners圆角
当android:shape="rectangle"时使用
radius="integer" // 圆角半径,该值设置时下面四个属性失效
bottomLeftRadius="integer" // 左下角圆角半径
bottomRightRadius="integer" // 右下角圆角半径
topLeftRadius="integer" // 左上角圆角半径
topRightRadius="integer" // 右上角圆角半径

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
     android:shape="rectangle">
    <corners 
        android:radius="integer"    
        android:bottomLeftRadius="integer"
        android:bottomRightRadius="integer"
        android:topLeftRadius="integer"
        android:topRightRadius="integer"/>
</shape>

gradient渐变
type="linear|radial|sweep" // 分别为线性、放射性、扫描性渐变,默认为线性渐变linear
angle="integer" // 渐变角度,当上面type为线性渐变linear时有效。角度为45的倍数,0度时从左往右渐变,角度方向逆时针
centerColor="color" // 渐变中间位置颜色
startColor="color" // 渐变开始位置颜色
endColor="color" // 渐变结束位置颜色
centerX="float" // type为放射性渐变radial时有效,设置渐变中心的X坐标,取值区间[0,1],默认为0.5,即中心位置
centerY="float" // type为放射性渐变radial时有效,设置渐变中心的Y坐标,取值区间[0,1],默认为0.5,即中心位置
gradientRadius="integer" // type为放射性渐变radial时有效,渐变的半径

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient  
        android:type="linear|radial|sweep" 
        android:angle="integer"            
        android:centerColor="color"     
        android:startColor="color"         
        android:endColor="color"       
        android:centerX="float"           
        android:centerY="float"        
        android:gradientRadius="integer"/>
</shape>

padding内边距
bottom="integer" // 设置底部边距
left="integer" // 左边边距
right="integer" // 右边
top="integer" // 顶部

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <padding
        android:left="20dp"
        android:right="20dp"
        android:top="20dp"
        android:bottom="20dp"/>
</shape>

size尺寸
height="integer" // 宽度
width="integer" // 高度

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <size
        android:width="integer"
        android:height="integer"/>
</shape>

solid填充
color="color" // shape的填充色

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid
        android:color="color"/>
</shape>

stroke描边
color="color" // 描边的颜色
width="integer" // 描边的宽度
dashGap="integer" // 虚线间隔
dashWidth="integer" // 虚线宽度

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:color="color"
        android:width="integer"
        android:dashGap="integer"
        android:dashWidth="integer"/>
</shape>

2.Layer
layer-list可以将多个图片按照顺序层叠起来,让其看起来像一个图一样
在res/drawable文件夹下,新建一个文件:layer.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
</layer-list>

Layer文件根元素是<layer-list>,layer-list只有item一个子标签

item
width="integer" //宽高
height="integer" //高
left="integer" //marginleft
right="integer" //marginright
top="integer" //margintop
bottom="integer" //类似marginbottom
drawable="@drawable/drawable" //设置图片
gravity="center|center_horizontal|center_vertical"

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:width="integer"
        android:height="integer"
        android:left="integer"
        android:right="integer"
        android:top="integer"
        android:bottom="integer"
        android:drawable="@drawable/drawable" 
        android:gravity="center|center_horizontal|center_vertical"/>
</layer-list>

3.Selector
selector多个item子标签,而相应的状态是在item标签中定义的。selector可以作为两种资源使用:drawable和color。作为drawable资源使用时,放于drawable目录下,item必须指定android:drawable属性;作为color资源使用时,则放于color目录下,item必须指定android:color属性。
在res/drawable文件夹下,新建一个文件:selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
</selector>

android:state_enabled: 设置触摸或点击事件是否可用状态,一般只在false时设置该属性,表示不可用状态
android:state_pressed: 设置是否按压状态,一般在true时设置该属性,表示已按压状态,默认为false
android:state_selected: 设置是否选中状态,true表示已选中,false表示未选中
android:state_checked: 设置是否勾选状态,主要用于CheckBox和RadioButton,true表示已被勾选,false表示未被勾选
android:state_checkable: 设置勾选是否可用状态,类似state_enabled,只是state_enabled会影响触摸或点击事件,而state_checkable影响勾选事件
android:state_focused: 设置是否获得焦点状态,true表示获得焦点,默认为false,表示未获得焦点
android:state_window_focused: 设置当前窗口是否获得焦点状态,true表示获得焦点,false表示未获得焦点,例如拉下通知栏或弹出对话框时,当前界面就会失去焦点;另外,ListView的ListItem获得焦点时也会触发true状态,可以理解为当前窗口就是ListItem本身
android:state_activated: 设置是否被激活状态,true表示被激活,false表示未激活,API Level 11及以上才支持,可通过代码调用控件的setActivated(boolean)方法设置是否激活该控件
android:state_hovered: 设置是否鼠标在上面滑动的状态,true表示鼠标在上面滑动,默认为false,API Level 14及以上才支持

引用资源为图片时

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 当前窗口失去焦点时 -->
    <item android:drawable="@drawable/d1" android:state_window_focused="false" />
    <!-- 不可用时 -->
    <item android:drawable="@drawable/d2" android:state_enabled="false" />
    <!-- 按压时 -->
    <item android:drawable="@drawable/d3" android:state_pressed="true" />
    <!-- 被选中时 -->
    <item android:drawable="@drawable/d4" android:state_selected="true" />
    <!-- 被激活时 -->
    <item android:drawable="@drawable/d5" android:state_activated="true" />
    <!-- 默认时 -->
    <item android:drawable="@drawable/d6" />
</selector>

引用资源为颜色时

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 当前窗口失去焦点时 -->
    <item 
      android:color="@android:color/black"      
      android:state_window_focused="false" />
    <!-- 不可用时 -->
    <item 
       android:color="@android:color/background_light" 
       android:state_enabled="false" />
    <!-- 按压时 -->
    <item 
      android:color="@android:color/holo_blue_light" 
      android:state_pressed="true" />
    <!-- 被选中时 -->
    <item 
      android:color="@android:color/holo_green_dark" 
      android:state_selected="true" />
    <!-- 被激活时 -->
    <item 
      android:color="@android:color/holo_green_light" 
      android:state_activated="true" />
    <!-- 默认时 -->
    <item 
      android:color="@android:color/white" />
</selector>

另外Selector的item中可以使用Layer和Shape,Layer的item中也可以使用Selector和Shape
可以通过不同的组合来实现一些有意思的东西。

PS.东西不难,但不用真的容易忘

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,542评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,596评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,021评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,682评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,792评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,985评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,107评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,845评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,299评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,612评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,747评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,441评论 4 333
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,072评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,828评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,069评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,545评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,658评论 2 350

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,846评论 25 707
  • 概述 今天我们来探究一下android的样式。其实,几乎所有的控件都可以使用 background属性去引用自定义...
    CokeNello阅读 4,817评论 1 19
  • 记得刚开始学Android时,看着自己完全用系统控件写出的不忍直视的界面,对于如何做出不一样的按钮,让它们在不同状...
    biloba阅读 1,701评论 1 11
  • 更多Android总结知识点 Android中的13种Drawable小结 Android的八种对话框的实现 An...
    侯蛋蛋_阅读 3,946评论 0 5
  • 昨天家里电灯泡坏了,书房里面黑漆漆的,我没有“挑灯夜读”的习惯,所以昨天就早早休息了,拉下的功课今天来补充。 今天...
    火色石榴花阅读 262评论 0 0