ShapeDrawable类

- 日理万妓 2023-06-19 05:29 2阅读 0赞

1，介绍：

ShapeDrawable对于Xml的shape标签，在实际开发中我们经常将其作为背景图片使用，因为ShapeDrawable可以帮助我们通过颜色来构造图片，也可以构造渐变效果的图片

2， ShapeDrawable使用方法

*  从代码中我们可以看出Shape的子元素包括、<gradient>、<padding>、<size>、<solid>、<stroke>，我们一个个分析

<?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:usesLevel=["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>

【1】android:shape

这个属性表示图像的形状，可以是rectangle（矩形）、oval（椭圆）、line（横线）、ring（圆环）。默认为rectangle。

这里对于ring值还有几个相关的属性：

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      属性 
    </div> </td> 
   <td> 
    <div>
      &nbsp; &nbsp; 含义 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:innerRadius&nbsp; 
    </div> </td> 
   <td> 
    <div>
      圆环的半径与android:innerRadiusRatio同时存在时，以android:innerRadius 为准 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:innerRadiusRatio&nbsp; 
    </div> </td> 
   <td> 
    <div>
      内半径占整个Drawable宽度的比例，默认值为9.如果为n，那么半径=宽度/n 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:thickness 
    </div> </td> 
   <td> 
    <div>
      圆环的厚度，即外半径减去内半径的大小与android：thicknessRatio同时存在时以android:thickness为准 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android：thicknessRatio 
    </div> </td> 
   <td> 
    <div>
      厚度占整个Drawable宽度比例，默认值为3，如果为n，那么厚度=宽度/n 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:useLevel 
    </div> </td> 
   <td> 
    <div>
      一般都应该使用false，否则可能无法达到预期显示效果，除非它被当做LevelListDrawable来使用。 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

3，shape的实现效果

【1】 <corners>

*  指定边角的半径，数值越大角越圆，数值越小越趋近于直角，参数为：

<corners

android:radius="integer"

android:topLeftRadius="integer"

android:topRightRadius="integer"

android:bottomLeftRadius="integer"

android:bottomRightRadius="integer" />

*  Android:radius直接指定4个角的半径，另外4个属性可以单独设置4个角的角度.

【2】 <gradient>

*  设置颜色渐变与<solid>为互斥标签，因为solid表示纯色填充，而gradient表示渐变填充。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      属性 
    </div> </td> 
   <td> 
    <div>
      &nbsp; 含义 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:angle 
    </div> </td> 
   <td> 
    <div>
      渐变的角度，默认为0，其值务必为45°的倍数，0表示从左到右，90表示从下到上。 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:centerX 
    </div> </td> 
   <td> 
    <div>
      渐变中心点的横坐标 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:centerY 
    </div> </td> 
   <td> 
    <div>
      渐变的中心点的纵坐标，渐变中心点会影响渐变的具体效果。 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:startColor 
    </div> </td> 
   <td> 
    <div>
      渐变的开始颜色 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:centerColor&nbsp; 
    </div> </td> 
   <td> 
    <div>
      渐变的中间颜色 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:endColor 
    </div> </td> 
   <td> 
    <div>
      渐变的结束颜色 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      &nbsp;android:gradientRadius 
    </div> </td> 
   <td> 
    <div>
      渐变的半径，当android:type=”radial”有效 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:useLevel 
    </div> </td> 
   <td> 
    <div>
      一般为false 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:type 
    </div> </td> 
   <td> 
    <div>
      渐变类别，linear(线性)为默认值，radial（径内渐变），sweep（扫描渐变） 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

*  渐变类别，linear(线性)为默认值，radial（径内渐变），sweep（扫描渐变）

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NyaWNrZXRfNw_size_16_color_FFFFFF_t_70][]

*   linear(线性)为默认值，radial（径内渐变），sweep（扫描渐变）区别如下

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NyaWNrZXRfNw_size_16_color_FFFFFF_t_70 1][]

【3】<solid>

*  表示纯色填充，通过android:color设置颜色即可。

【4】<stroke>

*  描述边框，属性如下：

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      属性 
    </div> </td> 
   <td> 
    <div>
      &nbsp; &nbsp; 含义 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:width 
    </div> </td> 
   <td> 
    <div>
      描述边框的宽度，数值越大，越边框越厚 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:color 
    </div> </td> 
   <td> 
    <div>
      边框的颜色 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:dashWidth 
    </div> </td> 
   <td> 
    <div>
      组成虚线的线段宽度 
    </div> </td> 
  </tr> 
  <tr> 
   <td> 
    <div>
      android:dashGap 
    </div> </td> 
   <td> 
    <div>
      &nbsp; 组成虚线的线段之间的间隔，间隔越大，虚线看起的间隙就越大 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

*  有点要明白的是android:dashWidth和android:dashGap有任意一个为0，则虚线无法预期显示。

【5】 <padding>

*  表示内容或子标签边距，4个属性top、bottom、left、right，需要注意的是这个标签的作用是为内容设置与当前应用此shape的View的边距，而不是设置当前View与父元素的边距。

【6】 <size>

*  设置背景大小，width和height俩属性。一般来说这个值不是shape的最终显示大小，因为shape作为背景时会根据View的大小而填充其背景，因此Shape的大小很多时候是View的大小决定的。

4，总结：

实际上在开发中我们经常会利用shapeDrawable来自定义出所需要的各种背景图像或者显示图片，同时也有益于减少对美工图片的依赖，另外一个好处通过自定义shapeDrawable图片会比美工图片的size小很多，这样我们就能减少不必要的size，以减轻apk的size，可谓两全其美，因此能用shapeDrawable定义图像时，应该尽量使用它。

更多关于Drawable 资料： [https://blog.csdn.net/cricket\_7/category\_9564229.html][https_blog.csdn.net_cricket_7_category_9564229.html]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NyaWNrZXRfNw_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191204190806687.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NyaWNrZXRfNw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NyaWNrZXRfNw_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20191204190802493.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NyaWNrZXRfNw==,size_16,color_FFFFFF,t_70
[https_blog.csdn.net_cricket_7_category_9564229.html]: https://blog.csdn.net/cricket_7/category_9564229.html