Android StateListDrawable 和 ShapeDrawable 使用

broadview_java

已于 2022-10-28 16:46:15 修改

阅读量1.4k

点赞数 2

分类专栏： Android App 文章标签： android Shape StateList

于 2022-07-14 21:37:43 首次发布

本文链接：https://blog.csdn.net/u012514113/article/details/125773383

版权

Android App 专栏收录该内容

35 篇文章 4 订阅

订阅专栏

1. StateListDrawable

StateListDrawable 对象所显示的Drawable对象会随目标组件的状态而改变而自动切换，定义StateListDrawable对象的XML文件的根元素为<selector../> 该元素可以包含多个<item../>元素，该元素可以指定如下属性

android：color 或 android：drawable ：指定颜色或Drawable对象

android:state_xxx : 指定一个特定的状态.

例如：

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

2. 状态值

属性值	含义
android:state_pressed	是否为按下状态
android:state_focused	是否为获取到焦点状态
android:state_selected	是否为选中状态
android:state_checked	是否为勾选状态
android:state_hovered	光标移动到了当前控件上的状态
android:state_active	是否为激活状态(view / drawable)
android:state_accelerated	drawable是否为硬件加速状态
android:state_window_focused	是否为窗口获取焦点状态
android:state_checkable	是否可以被勾选
android:state_enabled	是否可用

3. ShapeDrawable

ShapeDrawable 用于定义一个基本的几何图形，如矩形，圆形，线条等，定义ShapeDrawable的XML文件的根元素是<shape../>元素，该元素可以指定如下属性：

android：shape =【“rectangle” | “oval” | "line" | "ring"】

<?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="color"
        android:endColor="color"
        android:gradientRadius="integer"
        android:startColor="color"
        android:type=["linear" | "radial" | "sweep"]
        android:usesLevel=["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>

一个矩形框.xml文件

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="10dp"/>
    <solid android:color="@color/blue"/>
</shape>

具体定义：

1、shape标签

shape位于根标签，android:shape属性。它拥有四种形状。分别为：rectangle（默认，矩形）、oval（椭圆）、line（横线）、ring（圆环）

2、corners标签

作用于矩形的四周（仅适用于矩形），为四周设置角度。如上图所示，矩形四个角的弧度。利用这一个标签可以很方便的实现圆角矩形的效果。

3、stroke标签

表示描边（或添加边框）。如图中第一个矩形所示，外围的一圈灰色虚线效果。这里注意：android:dashWidth和android:dashGap任何一个不可以为0，否则虚线效果将不生效。当然，除了虚线，去除这两个属性即变为实线效果（如上图第二个矩形）。

4、solid标签

表示为shape填充（如上图矩形内部的填充颜色），很容易理解。

5、gradient标签

android:type属性，设置颜色渐变效果（如上图第二个矩形所示）。渐变模式有三种，分别为：linear（默认，线性渐变）、sweep（扫描渐变）、radial（径向渐变）

4. gradient属性值详解

<gradient> 是shape的颜色渐变属性

//定义使用渐变颜色填充
    <gradient
        android:angle="integer"
        android:centerX="integer"
        android:centerY="integer"
        android:centerColor="color"
        android:endColor="color"
        android:gradientRadius="integer"
        android:startColor="color"
        android:type=["linear" | "radial" | "sweep"]
        android:usesLevel=["true" | "false"] />

android:angle="integer"

android:startColor ：颜色渐变的开始颜色

android:endColor : 颜色渐变的结束颜色

android:angle设置渐变颜色角度，而且必须是45的整数倍，下面只展示了4种（0，90， 180，270）的效果图。

默认是 0.该属性只有在type=linear情况下起作用，默认的type为linear。

通过代码展示差异点： gradient_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:angle="45的整数倍值"
        android:startColor="#000000"
        android:endColor="#ffffff"
        />
</shape>

0：从左到右渐变效果图：

45：从左下角到右上角

90：从下往上渐变效果图：

135：从右下角到左上角

180 ：从右往左渐变效果图：

225：从右上角到左下角

270：从上往下渐变效果图：

315：从左上角到右下角

android:centerX : Float.(0 ------ 1.0) 相对X的渐变位置。

android:centerY : Float.(0 - -----1.0) 相对Y的渐变位置。

这两个属性只有在type不为linear情况下起作用

android:gradientRadius

Float. 渐变颜色的半径，单位应该是像素点. 需要 android:type="radial"

看下如下例子：radial_type_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:type="radial"
        android:startColor="#ff0000"
        android:endColor="#ffffff"
        android:centerX="0.5"
        android:centerY="0.5"
        android:gradientRadius="20dp"
        />
</shape>

效果图：