Android基础---shape、selector、layer-list

shape

先来看语法：

<?xml version="1.0" encoding="utf-8"?><shape    xmlns:android="http://schemas.android.com/apk/res/android"    android:shape=["rectangle" | "oval" | "line" | "ring"] >    <corners        android:radius="integer"        android:topLeftRadius="integer"        android:topRightRadius="integer"        android:bottomLeftRadius="integer"        android:bottomRightRadius="integer" />    <gradient        android:angle="integer"        android:centerX="integer"        android:centerY="integer"        android:centerColor="integer"        android:endColor="color"        android:gradientRadius="integer"        android:startColor="color"        android:type=["linear" | "radial" | "sweep"]        android:useLevel=["true" | "false"] />    <padding        android:left="integer"        android:top="integer"        android:right="integer"        android:bottom="integer" />    <size        android:width="integer"        android:height="integer" />    <solid        android:color="color" />    <stroke        android:width="integer"        android:color="color"        android:dashWidth="integer"        android:dashGap="integer" /></shape>

android:shape

android:shape的几个值：rectagle矩形（默认），oval椭圆，line水平直线，ring环形。
其中android:shape=“ring”会单独多出几个属性：

• android:innerRadius：内环的半径
• android:innerRadiusRatio：
• android:thickness：
• android:thicknessRatio：
• android:useLevel：只有当我们的shape使用在LevelListDrawable中的时候，这个值为true，否则为false。

corners

圆角半径， 仅在shape=“rectangle”(默认)时使用，radius值越大角越圆，radius默认为0。

• android:radius：同时设置四个角的半径，会被下面每个特定的圆角属性覆盖。可以是0dp，表示没有圆角。

• android:topLeftRadius：设置左上角的半径

• android:topRightRadius：设置右上角的半径

• android:bottomLeftRadius：设置左下角的半径

• android:bottomRightRadius：设置右下角的半径

gradient

• android:angle：angle表示渐变的起始位置，这个值必须为45的倍数，包括0，且默认为0，0表示从左往右渐变，逆时针旋转，依次是45，90，135…..，90表示从下往上渐变（亲自测试过），270表示从上往下渐变，剩下的大家依次去推理。

• android:centerX：X轴上对渐变的中心的相对位置（0 - 1.0）

• android:centerY：Y轴上对渐变的中心的相对位置（0 - 1.0）

• android:startColor：表示渐变的起始颜色

• android:centerColor：表示渐变的过渡颜色

• android:endColor：表示渐变的结束颜

• android:gradientRadius：渐变半径，当android:type=“radial”时，需要设置

• android:type：表示渐变的类型，有三种，分别是：

  • ”linear” 线性变化（默认）
  • “radial” 辐射渐变，startColor即辐射中心的颜色，当type为radial时，我们要设置android:gradientRadius=“”，这个表示渐变的半径（线性渐变和扫描渐变不需要设置）
  • “sweep” 扫描渐变
• android:useLevel：只有当我们的shape使用在LevelListDrawable中的时候，这个值为true，否则为false。

padding

内容与视图边界的距离

• android:left：左边填充距离

• android:top：顶部填充距离

• android:right：右边填充距离

• android:bottom：底部填充距离

size

这个shape的大小。

• android:height：这个shape的高度

• android:width：这个shape的宽度

注意：默认情况下，这个shape会缩放到与他所在容器大小成正比。当你在一个ImageView中使用这个shape，你可以使用 android:scaleType="center"来限制这种缩放。

solid

填充这个shape的颜色

• android:color：颜色值，十六进制数，或者一个Color资源

stroke

这个shape使用的笔画，当android:shape=”line”的时候，必须设置改元素。

• android:width：笔画的粗细。

• android:color：笔画的颜色

• android:dashGap：每画一条线就间隔多少

• android:dashWidth：每画一条线的长度

dashWidth和dashGap两个属性，如果不设置则为实线，并且只要其中一个设置为0dp，则边框仍然为实线边框

Selector

selector就是状态列表（StateList）， 它分为两种，一种Color-Selector 和Drawable-Selector。

Drawable-Selector

drawable-selector 是背景图状态列表，可以跟图片一样使用，背景会根据组件的状态变化而变化。文件存储于

/res/drawable/filename.xml

Drawable-Selector有三个属性：

• android:constantSize=["true" | "false"]：drawable的大小是否当中状态变化，true表示是变化，false表示不变换，默认为false
• android:dither=[“true” | “false”]：当位图与屏幕的像素配置不一样时(例如，一个ARGB为8888的位图与RGB为555的屏幕)会自行递色(dither)。设置为false时不可递色。默认true
• android:variablePadding=["true" | "false"] ：内边距是否变化，默认false

drawable的item中可以有以下属性：

<item        android:drawable="@[package:]drawable/drawable_resource"//图片资源        android:state_pressed=["true" | "false"]//是否触摸        android:state_focused=["true" | "false"]//是否获取到焦点        android:state_hovered=["true" | "false"]//光标是否经过        android:state_selected=["true" | "false"]//是否选中        android:state_checkable=["true" | "false"]//是否可勾选        android:state_checked=["true" | "false"]//是否勾选        android:state_enabled=["true" | "false"]//是否可用        android:state_activated=["true" | "false"]//是否激活        android:state_window_focused=["true" | "false"] />//所在窗口是否获取焦点

下面是一个例子：

<?xml version="1.0" encoding="utf-8" ?><selector xmlns:android="http://schemas.android.com/apk/res/android"><!-- 默认时的背景图片-->    <item android:drawable="@drawable/pic1" /><!-- 没有焦点时的背景图片 -->    <item android:state_window_focused="false"                android:drawable="@drawable/pic1" /><!-- 非触摸模式下获得焦点并单击时的背景图片 -->    <item android:state_focused="true"                android:state_pressed="true"                android:drawable= "@drawable/pic2" /><!-- 触摸模式下单击时的背景图片-->    <item android:state_focused="false"                android:state_pressed="true"                android:drawable="@drawable/pic3" /><!--选中时的图片背景-->    <item android:state_selected="true"                android:drawable="@drawable/pic4" /><!--获得焦点时的图片背景-->    <item android:state_focused="true"                android:drawable="@drawable/pic5" /></selector>

注意：

Item顺序是有讲究的，条件限定越细致，则应该放到前面。比如这儿如果把1，2行和3，4行的item交换，那么pressed的就永远无法触发了，因为有item已经满足条件返回了。可以理解为代码中的if语句。

使用xml文件：

• 1.方法一：在listview中配置android:listSelector=”@drawable/xxx”
  或者在listview的item中添加属性android：background=”@drawable/xxx”

• 2.方法二：
  Drawable drawable = getResources().getDrawable(R.drawable.xxx);
  ListView.setSelector(drawable);
  但是这样会出现列表有时候为黑的情况，需要加上：android:cacheColorHint=”@android:color/transparent”使其透明。

以下是配置button中的文字效果：
drawable/button_font.xml

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

Button还可以实现更复杂的效果，例如渐变
drawable/button_color.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">                 /        <item android:state_pressed="true">//定义当button 处于pressed 状态时的形态。                <shape>                        <gradient android:startColor="#8600ff" />                        <stroke     android:width="2dp" android:color="#000000" />                        <corners android:radius="5dp" />                        <padding android:left="10dp" android:top="10dp"                                         android:bottom="10dp" android:right="10dp"/>                </shape>        </item>        <item android:state_focused="true">//定义当button获得 focus时的形态                <shape>                        <gradient android:startColor="#eac100"/>                        <stroke     android:width="2dp" android:color="#333333"    color="#ffffff"/>                        <corners android:radius="8dp" />                        <padding android:left="10dp" android:top="10dp"                                         android:bottom="10dp" android:right="10dp"/>                </shape>        </item></selector>

最后，需要在包含 button的xml文件里添加两项。假如是 main.xml 文件，

我们需要在里加两项。

     android：focusable="true"      android:backgroud="@drawable/button_color"

这样当你使用Button的时候就可以甩掉系统自带的那黄颜色的背景了，实现个性化的背景，配合应用的整体布局非常之有用啊。

Color-Selector

color-selector ，顾名思义就是颜色状态列表，可以跟color一样使用，颜色会随着组件的状态而改变。文件的位置存储于

/res/color/filename.xml

具体语法如下：

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item        android:color="hex_color"               //颜色值，#RGB,$ARGB,#RRGGBB,#AARRGGBB        android:state_pressed=["true" | "false"]//是否触摸        android:state_focused=["true" | "false"]//是否获得焦点        android:state_selected=["true" | "false"]//是否被状态        android:state_checkable=["true" | "false"]//是否可选        android:state_checked=["true" | "false"]//是否选中        android:state_enabled=["true" | "false"]//是否可用        android:state_window_focused=["true" | "false"] />//是否窗口聚焦</selector>

下面通过一个具体示例为大家展示：

在/res/color/文件夹下新建test_color_selector.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_pressed="true"          android:color="#ffff0000"/> <!-- pressed -->    <item android:state_focused="true"          android:color="#ff0000ff"/> <!-- focused -->    <item android:color="#ff000000"/> <!-- default --></selector>

调用：

    <Button        android:id="@+id/bt_about"        style="@style/Button_style"        android:layout_width="250dp"        android:layout_height="50dp"        android:layout_margin="5dp"        android:textColor="@color/test_color_selector"        android:text="@string/about" />

layer-list

引用：
shape：
android:shape属性详解 - dreamfly2007的专栏 - 博客频道 - CSDN.NET
android shape使用总结 - Android移动开发技术文章_手机开发 - 红黑联盟

selector：
安卓开发中selector的使用方法详解干货分享 麦子学院
Android Selector 与 Shape 基本用法 - 东名夜雨 的专栏 - 博客频道 - CSDN.NET
Android的selector，背景选择器 - 学习Android - 51CTO技术博客

layer-list:
Android之用layer-list，shape，selector画各种背景 - 柳絮丶 - 博客频道 - CSDN.NET
Android开发：shape和selector和layer-list的（详细说明） - - 博客频道 - CSDN.NET