Drawable种类繁多，ShapeDrawable 是一种很常见的Drawable,可以理解为通过颜色来构造的图形，它既可以是纯色的图形，也可以是具有渐变效果的图形。
一、ShapeDrawable语法
ShapeDrawable语法稍显复杂，如下所示：
<?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>
需要注意的是<shape>标签创建的Drawable，其实体类实际上是GradientDrawable，下面分别介绍各个属性的含义。
二、各属性含义
-
android:shape
根元素shape表示图形的形状，有四个选项：
- rectangle 矩形
- oval 椭圆
- line 横线
- ring 圆环
另外四个当中，line 和 ring 一定需要通过<stroke>标签来指定线的宽和和颜色信息等。
-
<corners>
表示shape图形四个交的角度，即四个角的圆角程度。单位是px，只适用于矩形shape。
android:radius优先级较低，会被其他四个属性覆盖。属性含义望文生义即可。注意：每个圆角半径值都必须大于1，否侧就没有圆角。
-
<solid>
表示纯色填充，利用 android:color 就可以指定shape的颜色。
-
<gradient>
渐变效果，和<solid>标签互斥。
| gradient标签属性 | 作用 |
|---|---|
| android:angle | 渐变的角度，默认是0，其值必须是45的整数倍。0表示从左边到右，90表示从上到下。具体效果随着角度的调整而产生变化，角度影响渐变方向。 |
| android:centerX | 渐变中心的横坐标点 |
| android:centerY | 渐变中心的纵坐标点 |
| android:startColor | 渐变色的起始色 |
| android:centerColor | 渐变色的中间色 |
| android:endColor | 渐变色的结束色 |
| android:type | 渐变的类型，分3种，linear（线性渐变），radio（径向渐变），sweep（扫描线渐变），默认值是 线性渐变 。 |
| android:gradientRadius | 渐变的半径（仅当 android:type 为radio时有效） |
| android:useLevel | 一般为false，当Drawable作为StateListDrawable时有效。 |
-
<stroke>
Shape的描边，有如下几个属性：
| stroke标签属性 | 作用 |
|---|---|
| android:width | 描边的宽度，越大则shape的边缘线越粗 |
| android:color | 描边的颜色 |
| android:dashWidth | 虚线的宽度 |
| android:dashGap | 虚线的空隙的间隔 |
注：如果 android:dashWidth 和 android:dashGap 两者有任意一个为0，那么虚线效果就无法显示。
-
<padding>
不是shape的空白，而是包含它的View的空白
-
<size>
shape没有宽/高的概念，总结来说，标签设置的宽高就是ShapeDrawable的固有宽高（这时调用getIntrinsicWidth获得的就不是-1了），但是作为View的背景时，它还是会拉伸或缩小自适应View的大小。
三、示例代码
3.1 搜索框渐变背景：
xml代码：
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:angle="90"
android:startColor="@color/color_fed952"
android:endColor="#ff9b00"
/>
</shape>
实际效果：
渐变实际效果.png
3.2 搜索框文字背景：
xml代码：
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<corners android:radius="6dp"/>
<solid android:color="@color/white"/>
</shape>
其实就是个editText的背景是白色的圆角矩形，配合上渐变背景，最后搜索框整体效果图：
整体效果图.png
3.3 搜索框布局文件代码
xml代码：
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bg_home_search"
android:padding="8dp"
>
<TextView
android:id="@+id/qrcode_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:background="@drawable/bar_code_scan_icon"
/>
<TextView
android:id="@+id/category_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="@drawable/category"
/>
<TextView
android:id="@+id/search_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_toLeftOf="@id/category_view"
android:layout_toRightOf="@id/qrcode_view"
android:background="@drawable/bg_home_edittext"
android:gravity="center"
android:padding="6dp"
android:text="@string/home_edittext_hint"
android:textColor="@color/color_cdcdcd"
android:textSize="16sp"
/>
</RelativeLayout>
