Android ShapeDrawable学习

ShapeDrawable简介

ShapeDrawable 是一种常见的Drawable，可以认为是通过颜色来构造图形，既可以是纯色的，也可以是渐变色的。其语法如此下：

<?xml version="1.0" encoding="utf-8"?>
<!-- 用shape 标签创建Drawable-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle|oval|line|ring">
<corners
android:bottomLeftRadius="integer"
android:bottomRightRadius="integer"
android:radius="integer"
android:topLeftRadius="integer"
android:topRightRadius="integer" />

<solid android:color="color"/>
<!--
<solid>标签与<gradient>互斥
-->
<gradient
android:angle="integer"
android:centerColor="color"
android:centerX="integer"
android:centerY="integer"
android:endColor="color"
android:gradientRadius="integer"
android:startColor="color"
android:type="linear|radial|sweep"
android:useLevel="false|true"></gradient>

<stroke
android:width="integer"
android:color="color"
android:dashGap="integer"
android:dashWidth="integer"></stroke>

<padding
android:left="integer"
android:right="integer"
android:bottom="integer"
android:top="integer"></padding>

<size
android:width="integer"
android:height="integer"></size>
</shape>

看了是不是觉得然而并没有什么用呢？下面对各标签做简单的介绍。

1.android：shape

shape：表示图形的形状，有四个值：rectangle-矩形（默认）,oval-椭圆，line-横线，ring-圆环。注：line和ring必须通过 stroke 标签指定宽度和颜色等信息。

2.< corners>标签

只是适用于shape为rectangle，其单位为px。五个属性如下：

android:radius——四个角都设定一样的角度，优先级比较低，会被其他四个属性覆盖。

android:topLeftRadius —— 左上角

android:topRightRadius —— 右上角

android:bottomLeftRadius —— 左下角

android:bottomRightRadius —— 右下角

3.< gradient>渐变填充

与《solid》互斥，gradient表示渐变效果填充，而solid则表示纯色填充，属性如下：

android:angle——渐变角度，默认0，其值必须为45的倍数，0——从左到右，90——从下到上。。。

android:centerX——渐变中心点的横坐标。中心点会影响渐变的具体效果

android:centerY——渐变纵坐标。

android:startColor——渐变开始颜色

android:centerColor——渐变中间颜色

android:endColor——渐变结束颜色

android:type ——渐变类别，三个值：linear-线性，radial-径向渐变，sweep-扫描线渐变

android：useLevel——一般为false，当StateListDrawable时为true。

android:gradientRadius——渐变半径，仅当type为radial时有效。

4.< solid>纯色填充

android:color——填充颜色

5.< stroke>描边

android:width——描边的宽度

android:color——描边的颜色

android:dashWidth——组成虚线线段的宽度

android:dashGap——虚线之间的间隙

6.< padding>

包含view的空白，有四个属性：

android:left|right|top|bottom。

7.< size>

shape 的大小，两个属性，width和height。

ShapeDrawable简单例子

矩形绿色填充

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="60dp"
android:radius="10dp"
android:topLeftRadius="20dp"
android:topRightRadius="30dp" />
<solid android:color="#60ce54" />
<size
android:width="200dp"
android:height="50dp" />
</shape>

矩形颜色渐变填充

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="60dp"
android:radius="10dp"
android:topLeftRadius="20dp"
android:topRightRadius="30dp" />

<gradient
android:centerX="3"
android:centerY="3"
android:startColor="#f70818"
android:endColor="#00ff00"/>
<size
android:width="200dp"
android:height="50dp" />
</shape>

椭圆

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<stroke
android:width="6dp"
android:color="#f4a404" />
<size android:width="20dp"
android:height="30dp"/>
</shape>

简单的例子就到这里。