selector与shape

关于android开发，为了使我们的Button，ListView的item样式显得好看，以及体现出点击的效果，我们需要使用selector与shape。

这两个都是需要建在 drawable目录下的，例如新建一个btn_shape.xml，代码如下：

1.shape

<shape>
    <!--这是渐变  角度0表示水平渐变  90表示上下渐变-->
    <gradient android:angle="0" android:startColor="#cc110e"
        android:endColor="#bccc0e"
        ></gradient>
    <!--这是圆角  radius表示圆角的半径  半径越大  圆角越大-->
    <corners android:radius="8dp"></corners>
    <!--这是边框-->
    <stroke android:color="#00f" android:width="1dp"></stroke>
    <!--这是填充的颜色  这个会覆盖渐变效果-->
    <!--<solid android:color="#0f0"></solid>-->
 
    <!--还可以在shape里面设置padding 和size-->
</shape>

上面是主要的属性，根据自己的需要进行选择就好，不需要的属性可以直接删掉，例如渐变gradient，这个通常也不常用。

如果有大量的Button要设置同一个shape，那么可以在里面设置padding和size，这样可以省下很多重复的代码。

在Button控件设置背景：

android:background="@drawable/btn_shape"

效果图如下：

这样就实现了圆角(corners),水平渐变(gradient),边框(stroke).

2.selector

selector是用在控件被点击的时候，让控件产生变化，这些变化可以是背景，甚至是控件的形状（和shape一起使用就可以达到此效果）。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--这个item是指使用该selector的控件被点击时候的背景-->
    <item  android:state_pressed="true" android:drawable="@color/white">
    </item>   
  <!--这个item是指使用该selector的控件默认状态下的背景-->
    <item android:drawable="@color/lightgray"></item>
</selector>

android:drawable里面可以图片id，也可以是颜色,如果是颜色，要在values/colors/里面设置，例如：

<resources>
<color name="colorPrimary">#0080ff</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
</resources>

像这样，这是系统自带的三个color,我们可以在里面添加我们自己想要的color

其中每个<item>项都是表示一个状态，控件的状态从上向下遍历，遇到相符的，就会把相应item中drawable的值作为自身的background

我们可以为item设置的状态除了 state_pressed之外，还有：

 

大家看英文应该应该能猜到各个状态吧。

在需要使用selector的控件中加入 android:background="@drawable/btn_selector"

上面selector的效果：

未点击时的效果：

 

点击时，松开之前的效果：

 

所以，只要是可以用background属性的地方就可以使用selector与shape.

 

使用selector时非常非常要注意item的顺序，运行程序点击控件的时候，程序会按照item的顺序一个一个往下找，也许这时候就有bug了。例如这样：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/salmon"></item>
    <item android:state_pressed="true" android:drawable="@color/pink"></item>
</selector>

没有点击的时候颜色是@color/salmon

但是当你点击之后，你想要的是@color/pink，但是很遗憾，还是@color/salmon

因为直接找到了第一个满足条件，就设置了背景为@color/salmon。

如果交换这两个<item>的顺序，那么就能正常使用了。

或者加上一个条件<item  android:state_pressed="false" android:drawable="@color/salmon">

所以一般把无条件的<item>放到最后。

 

3.shape和selector综合使用

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 
    <item  android:state_pressed="true">
        <shape>
            <gradient android:angle="90" android:startColor="#3ee7d6"
                android:endColor="#793ee7"
                ></gradient>
            <corners android:radius="8dp"></corners>
        </shape>
    </item>
    <item>
        <shape>
            <!--这是渐变  角度0表示水平渐变  90表示上下渐变-->
            <gradient android:angle="0" android:startColor="#cc110e"
                android:endColor="#bccc0e"
                ></gradient>
            <!--这是圆角  radius表示圆角的半径  半径越大  圆角越大-->
            <corners android:radius="8dp"></corners>
        </shape>
    </item>
</selector>

 

效果图：

默认状态下：

 

点击状态下：

 

这样就实现了shape与selector的综合使用。

 

像这样，这是系统自带的三个color,我们可以在里面添加我们自己想要的color