前言

安卓里shape可以通过xml进行简单图形的绘制（单层；多层用layer-list），一般开发中就是绘制简单图形或者是静态背景（点击没变化的那种；如果要有变化一般使用）。

本文来介绍一手shape的使用。

创建

这是as自带的功能，我使用的as（as4.+)好像就没有不支持这个的。

在res/drawable目录下，new一个drawable resource file:

输入名字和根节点：

点击ok就创建完成了。

使用

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

</shape>

默认情况下，第一行声明了版本及编码，我们不用去动他。

第一行的shape属性及第二行的shape节点内，就是我们要编写的地方了。

shape节点的属性：

shape：

rectangle：矩形（默认）

oval：椭圆

ring:圆环必须要设置thickness及useLevel=false

下面是shape内部的节点：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="40dp"
    android:shape="rectangle">
    <!--    设置长宽 如果应用到view作为背景，这个长宽只能控制到横纵比，不能表示实际展示的长宽 -->
    <size
        android:width="110dp"
        android:height="100dp" />
    <!--    设置圆角，个人觉得这个是使用shape的一个重要理由，别的方式实现圆角有点麻烦。-->
    <!--    radius表示一下设置所有圆角，带位置的表示设置指定位置的圆角；带位置的优先级高。-->
    <corners
        android:bottomLeftRadius="10dp"
        android:radius="15dp" />
    <!--    设置对应位置的内边距；和size一样，当设置为背景时，会拉伸。-->
    <padding android:left="10dp" />
    <!--    填充颜色，只有一个color属性-->
    <solid android:color="@color/white" />
    <!--    描边 width: 宽度 dashWidth 虚线的每一条的宽度 dashGap 两个虚线之间的间距 -->
    <!--    <stroke-->
    <!--        android:width="2dp"-->
    <!--        android:dashWidth="1dp"-->
    <!--        android:dashGap="5dp" />-->

    <!--    渐变色 个人认为这个是最酷炫的了，简单设置就能达到很不错的效果-->
    <!--    type : 渐变类型 linear(默认）线性 radial放射（中心往外） sweep 扫描（从极坐标的原点0°开始扫描）-->
    <!--    angle : 角度 只能是45的倍数 默认为极坐标的原点0°-->
    <!--    centerX/centerY 渐变中心 是一个百分比的位置 取值 0-1.-->
    <!--    startColor/centerColor/endColor 渐变颜色-->
    <!--    gradientRadius 渐变的半径，只有当渐变类型为radial时才能使用-->
    <!--    useLevel 23/07/27 没太懂这个 用了之后颜色变化了-->

    <gradient
        android:angle="45"
        android:centerColor="#C850C0"
        android:endColor="#FFCC70"
        android:startColor="#4158D0"/>
</shape>

下面来一些效果和对应的xml:

渐变矩形：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <size
        android:width="200dp"
        android:height="200dp" />
    <gradient
        android:angle="135"
        android:centerColor="#C850C0"
        android:endColor="#FFCC70"
        android:startColor="#4158D0" />
    <corners android:radius="5dp" />
</shape>

渐变放射球：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size
        android:width="200dp"
        android:height="200dp" />
    <gradient
        android:gradientRadius="100dp"
        android:type="radial"
        android:centerX="0.5"
        android:centerY="0.5"
        android:endColor="#16A085"
        android:startColor="#F4D03F" />
</shape>

扫描圆环：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="40dp"
    android:shape="ring"
    android:useLevel="false">
    <size
        android:width="200dp"
        android:height="200dp" />
    <gradient
        android:centerX="0.5"
        android:centerY="0.5"
        android:endColor="#FAACA8"
        android:gradientRadius="100dp"
        android:startColor="#F4D03F"
        android:type="sweep" />
</shape>

虚线：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
    <stroke
        android:color="@color/white"
        android:width="1dp"
        android:dashWidth="5dp"
        android:dashGap="1dp" />
</shape>

结语

它的实现方式，其实就是转换成drawable对象了而已，不是什么高深的事情。日常开发中，我们学会使用即可。后续有空了会更新selector及layer-list等。

安卓 shape 使用详解

前言

创建