Drawable子类之—— ShapeDrawable （图形定义）

本文出自 “阿敏其人” 博客，转载或引用请注明出处。

ShapeDrawable 一种创建的Drawable，可以理解为通过颜色来狗仔的图形，它既可以是纯色的图形，也可以是具有渐变效果的图形。

ShapeDrawable的xml的根元素是 shape

一、语法

.
.

二、子节点

分别这么几个：corners（角度）、gradient（渐变）、padding（距离）、size（大小）、solid（纯色填充）、stroke（描边）。

.
.

根元素：shape

• android:shape
  表示图形的形状，有四种选项

rectabgle 矩形
  oval 椭圆
  line 横线
  ring 圆环

针对line和ring
四个当中， line 和 ring 一定需要通过 标签来指定 线的宽和和颜色信息 等。

针对ring有5个特殊的属性

值	作用
android:innerRadius	圆内的内半径，当和innerRadiusRatio同时存在时，以innerRadius为准
android:thickness	厚度， 圆环的厚度 = 外半径 - 内半径 ，当和thicknessRatio一起存在时，以thickness为准
innerRadiusRatio	内半径在占整个Drawable宽度的比例，默认值是9。如果为n，那么 内半径 = 宽度 / n
android:thicknessRatio	厚度占整个Drawable的宽度的比例，默认值是3。如果为n，那么 厚度 = 宽度 / n 。
android:useLevel	一般都应该使用false，否则可能无法达到预期的效果，除非他被用来作为 LevelListDrawable 来使用

.
.

角度 （ 只适用于 shape ）

表示shape图形四个交的角度，即四个角的圆角程度。单位是px，他有5个属性

| corners的5个属性 | 作用 |
| android:radius | 为四个角同时设定相同的角度，优先级低，会被下面几个覆盖（因为人家是专门指定的）|
|android:topLeftRadius | 左上角的角度 |
| android:topRightRadius | 右上角的角度 |
| android:bottomLeftRadius | 左下角的角度 |
| android:bottomRightRadius | 右下角的角度 |

注意：每个圆角半径值都必须大于1，否侧就没有圆角。

.
.

纯色填充

表示纯色填充，利用 android:color 就可以指定shape的颜色。

渐变效果 （与solid互斥，纯色或者渐变只能要一个）

• 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的属性	作用
android:width	描边的宽度，越大则shape的边缘线越粗
android:color	描边的颜色
android:dashWidth	虚线的宽度
android:dashGap	虚线的空隙的间隔

注：如果 android:dashWidth 和 android:dashGap 两者有任意一个为0，那么虚线效果就无法显示。

.
.

这个没什么好讲的，就是padding，分上下左右
.
.

shape大小 （只是大小并不是指定了固定了大小）

android:width 指定shape宽
android:height 指定shape高

严格来说shape没有宽高，但是我们指定size就有了所谓的宽高。
当时当shape作为View 的背景的时候，shape还是会被拉伸的，所以这个宽高并不是指定多少就一定多少（对于Drawable都是没有绝对的宽高的）

三、Demo

首先先来四个最简单的图像，矩形、椭圆、线，圆形。

先上xml代码，后上展示图。

�就是这四个.png

线 simple_line.xml

.
.
椭圆 simple_oval.xml

.
.
矩形 simple_rectagle.xml

.
.
圆形 simple_ring.xml

图形展示.png

以上就是基本图形最基本的使用。

下面结合几个节点做一些demo

圆形的点击变换颜色

圆形的点击颜色变化.gif

.
.
Edittext的背景框和焦点变化

Edittext的焦点变化.gif

如果我想画一个矩形，只有底边怎么办？
就好像在TextView里面，我们需要底线，“我们是有底线的TextView”，但是呢，我又不想弄复制的布局，弄一个背景岂不是方便多了？
嗯，你可以这么做，但是单纯的shape是实现不了的，需要用到LayerDrawable。原理就是shape组合排列。
有兴趣可以跳转一下——Drawable子类之——LayerDrawable （图层叠加）

了解更多的Drawable分类 Drawable图像资源抽象类
本篇完。