Android Shape应用

1. Shape的形状有四种

android:shape="rectangle|oval|ring|line" 指定形状

<shape
    android:shape="rectangle" >
    <solid android:color="#ffff8c00" />
</shape>

<shape
    android:shape="oval">
    <solid android:color="#ffffc800"/>
</shape

<shape
    android:shape="ring"
    android:thickness="5dp"
    android:useLevel="false">
    <solid android:color="#ffff8800" />
</shape>

<shape
    android:shape="line" >
    <stroke
        android:width="5dp"
        android:color="#ffff8c00" />
</shape>

效果如下

2. solid

retangle、oval和ring都适用solid来填充颜色。

• android:color用来指定颜色。

3. stroke

• android:width指定线的宽度。
• android:color指定线的颜色。
• android:dashWidth指定虚线的宽度。
• android:dashGap指定虚线的间隔。

示例代码

<shape
    android:shape="rectangle" >
    <solid android:color="#ffff8c00" />
    <stroke
        android:width="2dp"
        android:color="#ff000000" />
</shape>

<shape
    android:shape="rectangle" >
    <stroke
        android:width="2dp"
        android:dashWidth="10dp"
        android:dashGap="5dp"
        android:color="#ffff8c00" />
</shape>

效果如下

4. corners

• android:radius指定四个角的半径
• android:topLeftRadius指定左上角的半径
• android:topRightRadius指定右上角的半径
• android:bottomLeftRadius指定左下角的半径
• android:bottomRightRadius指定右下角的半径

示例代码

<corners
    android:radius="10dp" />

<corners
    android:topLeftRadius="10dp"
    android:topRightRadius="10dp" />

效果如下

5. gradient

• android:startColor指定开始颜色
• android:endColor指定结束颜色
• android:type="linear | radial | sweep"指定颜色渐变的方式
  示例代码

  <gradient 
      android:startColor="#ffff8c00"
      android:endColor="#ffffffff"
      android:type="linear" />
  
  <gradient
      android:startColor="#ffff8c00"
      android:endColor="#ffffffff"
      android:type="radial"
      android:gradientRadius="60"/>
  
  <gradient
      android:startColor="#ffff8c00"
      android:endColor="#ffffffff"
      android:type="sweep" />
  

  效果如下
  
• android:gradientRadius指定radius的半径
• android:angle指定方向，0代表从左往右，90代表从下到上，180代表从有往左，angle必须是45的倍数
  效果如下
  
  gradient同样可以用于其他形状
  

6. ring的专用属性

• android:innerRadius指定内环的半径
• android:innerRadiusRatio环的宽度比率表示内环的半径，5时为占比0.2
• android:thickness指定环的厚度
• android:thicknessRatio环的宽度比率来表示环的厚度，5时为占比0.2
• android:useLevel为false

示例代码

<shape
    android:shape="ring"
    android:thickness="5dp"
    android:useLevel="false"/>

<shape
    android:shape="ring"
    android:thickness="10dp"
    android:innerRadius="20dp"
    android:useLevel="false"/>

<shape
    android:shape="ring"
    android:thickness="10dp"
    android:innerRadius="15dp"
    android:useLevel="false" />

<shape
    android:shape="ring"
    android:thicknessRatio="5"
    android:innerRadius="15dp"
    android:useLevel="false"/>

效果如下