Android学习笔记四十三之Shape详解

Android中提供了shape形状给我们使用，我们可以通过shape画出虚线、圆角、渐变等多种效果，而且，shape是XML代码，比图片更小，在开发中，我们推荐使用shape，能用shape就用shape。

概述

　　用shape画形状，XML的根节点是shape，shape的取值有四个，简单的说就是，我们需要在根节点设置android:shape=”“属性，这个属性取值有4个：rectangle（长方形），oval（椭圆），line（线条），ring（圆环）。

需要注意一下几个属性，只有在设置画的形状是ring（圆环）的时候才会起作用：

• android:innerRadius=”“属性：这个属性是设置内环的半径。

• android:innerRadiusRatio=”“属性：这个属性是设置内环的比例，假设我设置的值是2，那么内环半径就是外圆半径除以2，注意，如果设置了android:innerRadius=”“属性，那么内环比例这个属性就不会起作用。

• android:thickness=”“属性：这个属性是设置圆环的厚度。

• android:thicknessRatio=”“属性：这个属性是设置圆环的厚度比例，假设我设置的值是2，那么圆环的厚度就是环半径除以2，但是如果设置了android:thickness=”“属性，那么圆环厚度比例属性就不生效。

• android:useLevel=”“属性：这个属性是设置使用级别，只有当我们的shape使用在只有当我们的shape使用在LevelListDrawable中的时候，这个值为true，否则为false。

shape可以在Layout和selector中使用，shape有6个子标签，分别是：

• corners圆角：圆角标签可以设置android:Radius=”“属性，表示4个角的半径，也可以通过下面4个属性单独设置

   android:topLeftRadius=""------>>设置左上角的半径 
   android:topRightRadius=""----->>设置右上角的半径 
   android:bottomLeftRadius=""--->>设置右下角的半径 
   android:bottomRightRadius=""-->>设置左下角的半径
  

• gradient渐变：设置shape的渐变色，有如下属性：

  • android:angle=”“属性：表示渐变的角度，必须是45的倍数，可以设置为0，0表示从左往右渐变，逆时针旋转，依次是45，90，135…..，90表示从下往上渐变，270表示从上往下渐变，依次下去

  • android:startColor=”“属性：设置渐变的起始颜色

  • android:centerColor=”“属性：设置渐变的过渡颜色

  • android:endColor=”“属性：设置渐变的结束颜色

  • android:type=”“属性：设置渐变的类型，有三种类型，分别是：linear（线性变化）,radial（辐射渐变）以及sweep（扫描渐变）

  • android:gradientRadius=”“属性，设置渐变半径，只有当渐变类型是radial（辐射渐变）的时候才需要设置

• padding内边距：内边距没有什么好说的，就是设置上、下、左、右四个方向的距离。

• size大下：大小也没什么好说的，就是设置宽度和高度

• solid填充：设置填充颜色，如果设置了这个属性，那么gradient属性就不生效

• stroke描边：设置边线的属性：虚线或者实线、大小、颜色。有如下属性：

  android:width=""------->>设置边边的宽度 
  android:color=""------->>设置边边的颜色 
  android:dashWidth=""--->>设置虚线的宽度 
  android:dashGap=""----->>设置虚线的间隔宽度
  

需要注意的是：dashWidth和dashGap属性，只要其中一个设置为0dp或者不设置，边框是实线边框

使用

上面我们讲了很多shape的便签和属性，都是概念性的东西，下面我们来具体使用一下

使用shape画一条虚线

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="line">
<!-- 设置虚线的样式-->
<stroke
    android:width="2dp"
    android:color="@color/colorPrimaryDark"
    android:dashGap="5dp"
    android:dashWidth="8dp"/>

<size android:height="20dp"/>

</shape>

使用shape画一条实线

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="line">
<!-- 设置虚线的样式-->
<stroke
    android:width="2dp"
    android:color="@color/colorPrimaryDark"
    />

<size android:height="20dp"/>

</shape>

使用shape画一个实线边框

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

<stroke
    android:width="2dp"
    android:color="@color/colorPrimaryDark"/>
<corners android:radius="8dp"/>
</shape>

使用shape画一个虚线边框

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

<stroke
    android:width="2dp"
    android:color="@color/colorPrimaryDark"
    android:dashGap="3dp"
    android:dashWidth="5dp"/>

<corners android:radius="8dp"/>
</shape>

使用shape画一个渐变边框

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle">
<corners
    android:bottomLeftRadius="8dp"
    android:bottomRightRadius="8dp"
    android:topLeftRadius="8dp"
    android:topRightRadius="8dp"/>
<stroke
    android:width="2dp"
    android:color="@color/colorPrimaryDark"/>
<gradient
    android:angle="180"
    android:endColor="#197600"
    android:startColor="#9cff00"/>
</shape>

使用shape画一个圆环

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="ring"
   android:useLevel="false">
<solid android:color="#006BB0"/>
<stroke
    android:width="1dp"
    android:color="#ffffff"/>
<size
    android:width="20dp"
    android:height="20dp"/>
</shape>

最终实现的效果图是：

需要注意的是，在Android3.0之后会开启硬件加速功能，所以我们需要在Activity中添加

android:hardwareAccelerated="false"

这一句代码，否则不会显示虚线

shape就简单介绍到这里了，我们可以使用shape画出很多形状，就看具体的需求了，使用shape比图片更小。