shape用法详解

用代码生成图片，而且图片能随意的更改，既方便又节省空间，下面就介绍用shape生成自定义图形的方法

步骤：

1. 在res/drawable下新建一个xml文件；

2. 在代码中引用这个xml文件，引用方式和图片一样。

定义shape图形的语法如下：

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="utf-8"?>  
2. <shape  
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:shape=["rectangle" | "oval" | "line" | "ring"]      //共有4种类型，矩形（默认）/椭圆形/直线形/环形  
5.     // 以下4个属性只有当类型为环形时才有效  
6.     android:innerRadius="dimension"     //内环半径  
7.     android:innerRadiusRatio="float"    //内环半径相对于环的宽度的比例，比如环的宽度为50,比例为2.5,那么内环半径为20  
8.     android:thickness="dimension"   //环的厚度  
9.     android:thicknessRatio="float"     //环的厚度相对于环的宽度的比例  
10.     android:useLevel="boolean">    //如果当做是LevelListDrawable使用时值为true，否则为false.  
11.   
12.     <corners    //定义圆角  
13.         android:radius="dimension"      //全部的圆角半径  
14.         android:topLeftRadius="dimension"   //左上角的圆角半径  
15.         android:topRightRadius="dimension"  //右上角的圆角半径  
16.         android:bottomLeftRadius="dimension"    //左下角的圆角半径  
17.         android:bottomRightRadius="dimension" />    //右下角的圆角半径  
18.   
19.     <gradient   //定义渐变效果  
20.         android:type=["linear" | "radial" | "sweep"]    //共有3中渐变类型，线性渐变（默认）/放射渐变/扫描式渐变  
21.         android:angle="integer"     //渐变角度，必须为45的倍数，0为从左到右，90为从上到下  
22.         android:centerX="float"     //渐变中心X的相当位置，范围为0～1  
23.         android:centerY="float"     //渐变中心Y的相当位置，范围为0～1  
24.         android:startColor="color"      //渐变开始点的颜色  
25.         android:centerColor="color"     //渐变中间点的颜色，在开始与结束点之间  
26.         android:endColor="color"    //渐变结束点的颜色  
27.         android:gradientRadius="float"  //渐变的半径，只有当渐变类型为radial时才能使用  
28.         android:useLevel=["true" | "false"] />  //使用LevelListDrawable时就要设置为true。设为false时才有渐变效果  
29.   
30.     <padding    //内部边距  
31.         android:left="dimension"  
32.         android:top="dimension"  
33.         android:right="dimension"  
34.         android:bottom="dimension" />  
35.   
36.     <size   //自定义的图形大小  
37.         android:width="dimension"  
38.         android:height="dimension" />  
39.   
40.     <solid  //内部填充颜色  
41.         android:color="color" />  
42.   
43.     <stroke     //描边  
44.         android:width="dimension"   //描边的宽度  
45.         android:color="color"   //描边的颜色  
46.         // 以下两个属性设置虚线  
47.         android:dashWidth="dimension"   //虚线的宽度，值为0时是实线  
48.         android:dashGap="dimension" />      //虚线的间隔  
49. </shape>  

下面是几个示例：

1. 圆角矩形，扫描式渐变

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="utf-8"?>  
2. <shape  
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:shape="rectangle"  
5.     android:useLevel="false" >  
6.   
7.     <corners  
8.         android:topLeftRadius="10dp"  
9.         android:topRightRadius="10dp"  
10.         android:bottomLeftRadius="10dp"  
11.         android:bottomRightRadius="10dp" />  
12.   
13.     <gradient  
14.         android:type="sweep"  
15.         android:endColor="@android:color/holo_blue_bright"  
16.         android:startColor="@android:color/holo_green_dark"  
17.         android:centerColor="@android:color/holo_blue_dark"  
18.         android:useLevel="false" />  
19.   
20.     <size android:width="60dp" android:height="60dp" />  
21. </shape>  

结果：

2. 圆形，线性渐变

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="utf-8"?>  
2. <shape  
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:shape="oval"  
5.     android:useLevel="false" >  
6.   
7.     <gradient  
8.         android:type="linear"  
9.         android:angle="45"  
10.         android:startColor="@android:color/holo_green_dark"  
11.         android:centerColor="@android:color/holo_blue_dark"  
12.         android:endColor="@android:color/holo_red_dark"  
13.         android:useLevel="false" />  
14.   
15.     <size android:width="60dp" android:height="60dp" />  
16.   
17.     <stroke android:width="1dp"  
18.         android:color="@android:color/white" />  
19.   
20. </shape>  

结果：

3. 虚线

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="utf-8"?>  
2. <shape  
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:shape="line" >  
5.   
6.     <size android:width="60dp"  
7.         android:height="60dp" />  
8.   
9.     <stroke android:width="2dp"  
10.         android:color="@android:color/holo_purple"  
11.         android:dashWidth="10dp"  
12.         android:dashGap="5dp" />  
13. </shape>  

结果：

4. 环形，放射型渐变

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="utf-8"?>  
2. <shape  
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:shape="ring"  
5.     android:useLevel="false"  
6.     android:innerRadius="40dp"  
7.     android:thickness="3dp">  
8.   
9.     <gradient android:type="radial"  
10.         android:gradientRadius="150"  
11.         android:centerY="0.1"  
12.         android:centerX="0.2"  
13.         android:startColor="@android:color/holo_red_dark"  
14.         android:centerColor="@android:color/holo_green_dark"  
15.         android:endColor="@android:color/white" />  
16.   
17.     <size android:width="90dp"  
18.         android:height="90dp" />  
19.   
20. </shape>  

结果：

官方文档：

https://developer.android.com/guide/topics/resources/drawable-resource.html#Shape