Android基础--Shape渲染的使用



感觉好久都没有写博文了，感觉自己变懒了，真对不起…-_-… 也有部分原因是因为我想写的东西网上已经有了，再加上还有很多方面小马我也正在学习，所以….这段时间一直暂停更新我的博客文章，看到博客的访问量一天天的增加，很开心 。。。O_O。。。这一阵子也看了各种各样的书籍，技术类的、非技术类的，也找到了自身很多的不足之处，我会用更多的心思来弥补不足，希望大家一起努力、加油！

 

以上是对自己讲的一点废话，现在开始今天的主题，控件渲染Shade（也可以叫着色器，但坏小马不喜欢这么叫，着色器….怪怪的！）的使用，一直都有在关注这方面的东西，网上也有部分文章写得不错，但是还是觉得不过瘾，往往都是写一点点自己在工作中使用过的，今天小马就用点心总结下这方面的东西，希望对这块知识有兴趣的帅果、美驴们有所帮助或提高，果断先看效果再一步步看代码！希望大家仔细看看我在XML及.java中添加的注释，相信你不会后悔花时间在这文章上的，今天的

DEMO效果图如下：

 

好了，效果看完了，下一步开始看代码吧，亲…….静下心….一步步来！！！

 

PS:模拟器与eclipse效果中预览的以下部分有点不一样，可能是eclipse与模拟器二者之前存在Bug吧…吼吼…

工程目录如下:

 

首先，先做个小小的铺垫：

 

Android提供的Shader类主要是渲染图像以及一些几何图形。

 

Shader有几个直接子类：

 

BitmapShader :主要用来渲染图像

 

LinearGradient :用来进行线性渲染

 

RadialGradient :用来进行环形渲染

 

SweepGradient :扫描渐变---围绕一个中心点扫描渐变就像电影里那种雷达扫描，用来梯度渲染。

 

ComposeShader :组合渲染，可以和其他几个子类组合起来使用。

 

 

 

小记：Android控件渲染Shade的实现方式有两种，（一、JAVA代码实现；二、XML配置来实现），

 

小马自己比较偏向XML实现，原因很简单:

 

1.你代码实现写得再经典，不跑起来效果看不到！

 

2.跑一遍Android模拟器，思路可以断一大节！（我很笨，经常这样 T_T）！

 

3.JAVA代码的每个函数参数你也得一个个去啃（老板管效率，不管怎么实现，等你啃完参数时，XML已经看到效果了 O_o ……走起…..）！

 

4，这是最主要的一点，Eclipse或者I/O大会刚推出的Android Studio，实时显示，我就特别 喜欢立竿见影 ^_^ ！

 

5.二者各有利弊，JAVA代码实现可以动态且灵活滴，XML配置的统一但不杂乱 @_@！！

 

Now……..Ladies and 乡亲们，看举一种JAVA代码excmple，其余类型的与之类似，亲们自己“度娘 、谷哥 ”：

 

LinearGradient是线性渐变，用法如下：

Gradient是基于Shader类，所以我们通过Paint的setShader方法来设置这个渐变，代码如下:

Paint p=new Paint();
LinearGradient lg=newLinearGradien(0,0,100,100,Color.RED,Color.BLUE,Shader.TileMode.MIRROR);

Gradient是基于Shader类，所以我们通过Paint的setShader方法来设置这个渐变，代码如下:

p.setShader(lg);
canvas.drawCicle(0,0,200,p); //参数3为画圆的半径，类型为float型。

 

先不说效果了，PS：看着上面的代码，有没有想哭的冲动啊 ? ? ?感觉乱乱的，不知道是什么，然后单词gradient不懂，一查如下（晕）,看着挺牛，还是只是个渲染！不管了，继续往下看…

 

再看XML配置代码,如下:

 

一：主布局文件代码如下（为了方便，布局是直接拖的，大家不用太关注）：

view sourceprint?

01.<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"

02.    xmlns:tools="http://schemas.android.com/tools"

03.    android:layout_width="match_parent"

04.    android:layout_height="match_parent"

05.    android:background="@drawable/background"

06.    android:paddingBottom="@dimen/activity_vertical_margin"

07.    android:paddingLeft="@dimen/activity_horizontal_margin"

08.    android:paddingRight="@dimen/activity_horizontal_margin"

09.    android:paddingTop="@dimen/activity_vertical_margin"

10.    tools:context=".MainActivity">

11.    <com.xiaoma.shadedemo.TextViewBorder

12.        android:id="@+id/textView1"

13.        android:layout_width="wrap_content"

14.        android:layout_height="wrap_content"

15.        android:layout_alignParentLeft="true"

16.        android:layout_alignParentTop="true"

17.        android:layout_marginLeft="22dp"

18.        android:layout_marginTop="20dp"

19.        android:text=" JAVA实现带四条边框"

20.        android:textColor="@android:color/white"

21.        android:textSize="25sp"/>

22.    <com.xiaoma.shadedemo.TextViewBorderLeftRight

23.        android:id="@+id/TextViewBorder01"

24.        android:layout_width="wrap_content"

25.        android:layout_height="wrap_content"

26.        android:textColor="@android:color/white"

27.        android:layout_alignLeft="@+id/textView1"

28.        android:layout_below="@+id/textView1"

29.        android:layout_marginTop="20dp"

30.        android:text="JAVA实现带左右边框"

31.        android:textSize="25sp"/>

32.    <com.xiaoma.shadedemo.TextViewBorderUnder

33.        android:id="@+id/TextViewBorder02"

34.        android:layout_width="wrap_content"

35.        android:layout_height="wrap_content"

36.        android:layout_alignLeft="@+id/TextViewBorder01"

37.        android:textColor="@android:color/white"

38.        android:layout_below="@+id/TextViewBorder01"

39.        android:layout_marginTop="33dp"

40.        android:text="JAVA代码实现下边框"

41.        android:textSize="25sp"/>

42.    <TextView

43.        android:id="@+id/TextViewBorderUnder01"

44.        android:layout_width="wrap_content"

45.        android:layout_height="wrap_content"

46.        android:layout_alignLeft="@+id/button1"

47.        android:layout_below="@+id/TextViewBorder02"

48.        android:layout_marginTop="20dp"

49.        android:text="Shape XML实现边框"

50.        android:background="@drawable/shape_test"

51.        android:textColor="@android:color/white"

52.        android:textSize="25sp"/>

53.    <Button

54.        android:id="@+id/button1"

55.        android:layout_width="wrap_content"

56.        android:layout_height="wrap_content"

57.        android:layout_alignLeft="@+id/TextViewBorder02"

58.        android:layout_below="@+id/TextViewBorderUnder01"

59.        android:layout_marginTop="29dp"

60.        android:background="@drawable/shape_selector"

61.        android:text="Selector与Shape混用按钮"

62.        android:textColor="@android:color/black"/>

63.</RelativeLayout>

二：上面布局中使用的自定义控件代码及Shape渲染代码分别如下：

 

2.1：JAVA实现带四条边框(自定义TextView JAVA代码一)

view sourceprint?

001.packagecom.xiaoma.shadedemo;

002.importandroid.content.Context;

003.importandroid.graphics.Canvas;

004.importandroid.graphics.Color;

005.importandroid.graphics.Paint;

006.importandroid.util.AttributeSet;

007.importandroid.widget.TextView;

008.publicclass TextViewBorder extendsTextView

009.{

010.                                                                                                                                                                   

011.    /**

012.     * 下面两个方法在构造时需注意: 一:如果是XML文件加载的方式使用自定义控件到布局中是用以下方式, 二:如果是用纯代码的方式加载自定义的控制到而已中时用第二种方式

013.     */

014.                                                                                                                                                                   

015.    // 方式一：

016.    publicTextViewBorder(Context context, AttributeSet attrs)

017.    {

018.        super(context, attrs);

019.    }

020.                                                                                                                                                                   

021.    // 方式二：

022.    /*

023.     * public TextViewBorder(Context context) { // TODO Auto-generated constructor stub super(context); }

024.     */

025.                                                                                                                                                                   

026.    /**

027.     * 1. Rect对象 一个区域对象Rect(left, top, right, bottom) ， 是一个左闭右开的区域， 即是说使用 Rect.contains(left, top)为true，

028.     * Rect.contains(right, bottom)为false 2. drawLine方法 drawLine(float startX, float startY, float stopX, float stopY,

029.     * Paint paint) 也是一个左闭右开的区间，只会绘制到stopX-1,stopY-1 3. drawRect(Rect r, Paint paint) 当绘制空心矩形时，绘制的是一个左闭右闭的区域

030.     * 验证方法：下面就是可以验证左闭右开的区间方法，现在知道为什么要-1 了

031.     */

032.                                                                                                                                                                   

033.    @Override

034.    protectedvoid onDraw(Canvas canvas)

035.    {

036.        super.onDraw(canvas);

037.                                                                                                                                                                       

038.        Paint paint =new Paint();

039.                                                                                                                                                                       

040.        paint.setAntiAlias(true);

041.                                                                                                                                                                       

042.        paint.setColor(Color.GREEN);

043.                                                                                                                                                                       

044.        canvas.drawLine(0,0, this.getWidth() -1, 0, paint);// 绘制上边框

045.                                                                                                                                                                       

046.        canvas.drawLine(0,0, 0,this.getHeight() - 1, paint); // 绘制左边框

047.                                                                                                                                                                       

048.        canvas.drawLine(this.getWidth() - 1, 0,this.getWidth() - 1, this.getHeight() -1, paint); // 绘制右边框

049.                                                                                                                                                                       

050.        canvas.drawLine(0,this.getHeight() - 1, this.getWidth() -1, this.getHeight() -1, paint);// 绘制下边框

051.                                                                                                                                                                       

052.    }

053.                                                                                                                                                                   

054.    /*

055.     * 1. Rect对象

056.     *

057.     * 一个区域对象Rect(left, top, right, bottom) ， 是一个左闭右开的区域，即是说使用 Rect.contains(left, top)为true， Rect.contains(right,

058.     * bottom)为false

059.     *

060.     * 2.drawLine方法

061.     *

062.     * drawLine(float startX, float startY, float stopX, float stopY, Paint paint) 也是一个左闭右开的区间，只会绘制到stopX-1,stopY-1

063.     *

064.     * 验证方法：

065.     *

066.     * Canvas c = canvas; paint.setColor(Color.RED); c.drawLine(x, y, x+c.getWidth()-1, y, paint); c.drawLine(x,

067.     * y+height-1, x+c.getWidth(), y+height-1, paint); paint.setColor(Color.BLUE); c.drawPoint(x+c.getWidth()-1, y,

068.     * paint); 说明drawLine是没有绘制到右边最后一个点的

069.     *

070.     * 3.drawRect(Rect r, Paint paint)

071.     *

072.     * 当绘制空心矩形时，绘制的是一个左闭右闭的区域

073.     *

074.     * 验证方法：

075.     *

076.     * rect.set(x, y, x+width, y+height); paint.setStyle(Style.STROKE); paint.setColor(Color.BLUE); c.drawRect(rect,

077.     * paint); paint.setColor(Color.RED); c.drawLine(x, y, x+width, y, paint); c.drawLine(x, y+height, x+width,

078.     * y+height, paint); c.drawLine(x, y, x, y+height, paint); c.drawLine(x+width, y, x+width, y+height, paint);

079.     * 当绘制实心矩形时，绘制的是一个左闭右开的区域

080.     *

081.     * 验证方法：

082.     *

083.     * rect.set(x, y, x+width, y+height); paint.setColor(Color.RED); c.drawLine(x, y, x+width, y, paint); c.drawLine(x,

084.     * y+height, x+width, y+height, paint); c.drawLine(x, y, x, y+height, paint); c.drawLine(x+width, y, x+width,

085.     * y+height, paint); paint.setStyle(Style.FILL); paint.setColor(Color.BLUE); c.drawRect(rect, paint);

086.     * 这个规则跟j2me也是一样的，在j2me里，drawRect长宽会多画出1px。SDK的说明是：

087.     *

088.     * The resulting rectangle will cover an area (width + 1) pixels wide by (height + 1) pixels tall. If either width

089.     * or height is less than zero, nothing is drawn.

090.     *

091.     * 例如drawRect(10,10,100,1)绘制，结果是一个2px高的矩形,用fillRect(10,10,100,1)，结果是一个1px高的矩形

092.     *

093.     * 以上就是对Android绘图的具体介绍。

094.     */

095.                                                                                                                                                                   

096.}

097./**

098. * 在布局文件中引用 这样引用就行了..吼吼 <com.xiaoma.shadedemo.TextViewBorder android:id="@+id/a02_txtKSSJ" android:textColor="#000000"

099. * android:layout_marginLeft="10dip" android:layout_width="100dip" android:layout_height="wrap_content" />

100. */

2.2：JAVA实现带左右边框(自定义TextView JAVA代码二)

 

 

view sourceprint?

001.packagecom.xiaoma.shadedemo;

002.importandroid.content.Context;

003.importandroid.graphics.Canvas;

004.importandroid.graphics.Color;

005.importandroid.graphics.Paint;

006.importandroid.util.AttributeSet;

007.importandroid.widget.TextView;

008.publicclass TextViewBorderLeftRight extends TextView

009.{

010.                                                                                                                                                               

011.    /**

012.     * 下面两个方法在构造时需注意: 一:如果是XML文件加载的方式使用自定义控件到布局中是用以下方式, 二:如果是用纯代码的方式加载自定义的控制到而已中时用第二种方式

013.     */

014.                                                                                                                                                               

015.    // 方式一：

016.    publicTextViewBorderLeftRight(Context context, AttributeSet attrs)

017.    {

018.        super(context, attrs);

019.    }

020.                                                                                                                                                               

021.    // 方式二：

022.    /*

023.     * public TextViewBorder(Context context) { // TODO Auto-generated constructor stub super(context); }

024.     */

025.                                                                                                                                                               

026.    /**

027.     * 1. Rect对象 一个区域对象Rect(left, top, right, bottom) ， 是一个左闭右开的区域， 即是说使用 Rect.contains(left, top)为true，

028.     * Rect.contains(right, bottom)为false 2. drawLine方法 drawLine(float startX, float startY, float stopX, float stopY,

029.     * Paint paint) 也是一个左闭右开的区间，只会绘制到stopX-1,stopY-1 3. drawRect(Rect r, Paint paint) 当绘制空心矩形时，绘制的是一个左闭右闭的区域

030.     * 验证方法：下面就是可以验证左闭右开的区间方法，现在知道为什么要-1 了

031.     */

032.                                                                                                                                                               

033.    @Override

034.    protectedvoid onDraw(Canvas canvas)

035.    {

036.        super.onDraw(canvas);

037.                                                                                                                                                                   

038.        Paint paint =new Paint();

039.                                                                                                                                                                   

040.        paint.setAntiAlias(true);

041.                                                                                                                                                                   

042.        paint.setColor(Color.GREEN);

043.                                                                                                                                                                   

044.        canvas.drawLine(0,0, 0, getHeight(), paint);

045.                                                                                                                                                                   

046.        // canvas.drawLine(getWidth(), 0, getWidth() - 1, getHeight() - 1, paint);

047.        canvas.drawLine(this.getWidth() - 1, 0,this.getWidth() - 1, this.getHeight() -1, paint);

048.                                                                                                                                                                   

049.        // canvas.drawLine(0, 0, 0, this.getHeight() - 1, paint);

050.                                                                                                                                                                   

051.        // canvas.drawLine(this.getWidth() - 1, 0, this.getWidth() - 1, this.getHeight() - 1, paint);

052.                                                                                                                                                                   

053.        // canvas.drawLine(0, this.getHeight() - 1, this.getWidth() - 1, this.getHeight() - 1, paint);

054.                                                                                                                                                                   

055.    }

056.    /*

057.     * 1. Rect对象

058.     *

059.     * 一个区域对象Rect(left, top, right, bottom) ， 是一个左闭右开的区域，即是说使用 Rect.contains(left, top)为true， Rect.contains(right,

060.     * bottom)为false

061.     *

062.     * 2.drawLine方法

063.     *

064.     * drawLine(float startX, float startY, float stopX, float stopY, Paint paint) 也是一个左闭右开的区间，只会绘制到stopX-1,stopY-1

065.     *

066.     * 验证方法：

067.     *

068.     * Canvas c = canvas; paint.setColor(Color.RED); c.drawLine(x, y, x+c.getWidth()-1, y, paint); c.drawLine(x,

069.     * y+height-1, x+c.getWidth(), y+height-1, paint); paint.setColor(Color.BLUE); c.drawPoint(x+c.getWidth()-1, y,

070.     * paint); 说明drawLine是没有绘制到右边最后一个点的

071.     *

072.     * 3.drawRect(Rect r, Paint paint)

073.     *

074.     * 当绘制空心矩形时，绘制的是一个左闭右闭的区域

075.     *

076.     * 验证方法：

077.     *

078.     * rect.set(x, y, x+width, y+height); paint.setStyle(Style.STROKE); paint.setColor(Color.BLUE); c.drawRect(rect,

079.     * paint); paint.setColor(Color.RED); c.drawLine(x, y, x+width, y, paint); c.drawLine(x, y+height, x+width,

080.     * y+height, paint); c.drawLine(x, y, x, y+height, paint); c.drawLine(x+width, y, x+width, y+height, paint);

081.     * 当绘制实心矩形时，绘制的是一个左闭右开的区域

082.     *

083.     * 验证方法：

084.     *

085.     * rect.set(x, y, x+width, y+height); paint.setColor(Color.RED); c.drawLine(x, y, x+width, y, paint); c.drawLine(x,

086.     * y+height, x+width, y+height, paint); c.drawLine(x, y, x, y+height, paint); c.drawLine(x+width, y, x+width,

087.     * y+height, paint); paint.setStyle(Style.FILL); paint.setColor(Color.BLUE); c.drawRect(rect, paint);

088.     * 这个规则跟j2me也是一样的，在j2me里，drawRect长宽会多画出1px。SDK的说明是：

089.     *

090.     * The resulting rectangle will cover an area (width + 1) pixels wide by (height + 1) pixels tall. If either width

091.     * or height is less than zero, nothing is drawn.

092.     *

093.     * 例如drawRect(10,10,100,1)绘制，结果是一个2px高的矩形,用fillRect(10,10,100,1)，结果是一个1px高的矩形

094.     *

095.     * 以上就是对Android绘图的具体介绍。

096.     */

097.                                                                                                                                                               

098.}

099./**

100. * 在布局文件中引用 这样引用就行了..吼吼 <com.xiaoma.shadedemo.TextViewBorder android:id="@+id/a02_txtKSSJ" android:textColor="#000000"

101. * android:layout_marginLeft="10dip" android:layout_width="100dip" android:layout_height="wrap_content" />

102. */

2.3：JAVA代码实现下边框(自定义TextView JAVA代码三)

 

view sourceprint?

001.packagecom.xiaoma.shadedemo;

002.importandroid.content.Context;

003.importandroid.graphics.Canvas;

004.importandroid.graphics.Color;

005.importandroid.graphics.Paint;

006.importandroid.util.AttributeSet;

007.importandroid.widget.TextView;

008.publicclass TextViewBorderUnder extends TextView

009.{

010.                                                                                                                                                             

011.    /**

012.     * 下面两个方法在构造时需注意: 一:如果是XML文件加载的方式使用自定义控件到布局中是用以下方式, 二:如果是用纯代码的方式加载自定义的控制到而已中时用第二种方式

013.     */

014.                                                                                                                                                             

015.    // 方式一：

016.    publicTextViewBorderUnder(Context context, AttributeSet attrs)

017.    {

018.        super(context, attrs);

019.    }

020.                                                                                                                                                             

021.    // 方式二：

022.    /*

023.     * public TextViewBorder(Context context) { // TODO Auto-generated constructor stub super(context); }

024.     */

025.                                                                                                                                                             

026.    /**

027.     * 1. Rect对象 一个区域对象Rect(left, top, right, bottom) ， 是一个左闭右开的区域， 即是说使用 Rect.contains(left, top)为true，

028.     * Rect.contains(right, bottom)为false 2. drawLine方法 drawLine(float startX, float startY, float stopX, float stopY,

029.     * Paint paint) 也是一个左闭右开的区间，只会绘制到stopX-1,stopY-1 3. drawRect(Rect r, Paint paint) 当绘制空心矩形时，绘制的是一个左闭右闭的区域

030.     * 验证方法：下面就是可以验证左闭右开的区间方法，现在知道为什么要-1 了

031.     */

032.                                                                                                                                                             

033.    @Override

034.    protectedvoid onDraw(Canvas canvas)

035.    {

036.        super.onDraw(canvas);

037.                                                                                                                                                                 

038.        Paint paint =new Paint();

039.                                                                                                                                                                 

040.        paint.setAntiAlias(true);

041.                                                                                                                                                                 

042.        paint.setColor(Color.GREEN);

043.                                                                                                                                                                 

044.        // canvas.drawLine(0, 0, this.getWidth() - 1, 0, paint);

045.                                                                                                                                                                 

046.        // canvas.drawLine(0, getHeight(), getWidth() - 1, getHeight(), paint);

047.                                                                                                                                                                 

048.        // canvas.drawLine(this.getWidth() - 1, 0, this.getWidth() - 1, this.getHeight() - 1, paint);

049.                                                                                                                                                                 

050.        canvas.drawLine(0, getHeight() - 1, getWidth() - 1, getHeight() -1, paint);

051.                                                                                                                                                                 

052.    }

053.                                                                                                                                                             

054.    /*

055.     * 1. Rect对象

056.     *

057.     * 一个区域对象Rect(left, top, right, bottom) ， 是一个左闭右开的区域，即是说使用 Rect.contains(left, top)为true， Rect.contains(right,

058.     * bottom)为false

059.     *

060.     * 2.drawLine方法

061.     *

062.     * drawLine(float startX, float startY, float stopX, float stopY, Paint paint) 也是一个左闭右开的区间，只会绘制到stopX-1,stopY-1

063.     *

064.     * 验证方法：

065.     *

066.     * Canvas c = canvas; paint.setColor(Color.RED); c.drawLine(x, y, x+c.getWidth()-1, y, paint); c.drawLine(x,

067.     * y+height-1, x+c.getWidth(), y+height-1, paint); paint.setColor(Color.BLUE); c.drawPoint(x+c.getWidth()-1, y,

068.     * paint); 说明drawLine是没有绘制到右边最后一个点的

069.     *

070.     * 3.drawRect(Rect r, Paint paint)

071.     *

072.     * 当绘制空心矩形时，绘制的是一个左闭右闭的区域

073.     *

074.     * 验证方法：

075.     *

076.     * rect.set(x, y, x+width, y+height); paint.setStyle(Style.STROKE); paint.setColor(Color.BLUE); c.drawRect(rect,

077.     * paint); paint.setColor(Color.RED); c.drawLine(x, y, x+width, y, paint); c.drawLine(x, y+height, x+width,

078.     * y+height, paint); c.drawLine(x, y, x, y+height, paint); c.drawLine(x+width, y, x+width, y+height, paint);

079.     * 当绘制实心矩形时，绘制的是一个左闭右开的区域

080.     *

081.     * 验证方法：

082.     *

083.     * rect.set(x, y, x+width, y+height); paint.setColor(Color.RED); c.drawLine(x, y, x+width, y, paint); c.drawLine(x,

084.     * y+height, x+width, y+height, paint); c.drawLine(x, y, x, y+height, paint); c.drawLine(x+width, y, x+width,

085.     * y+height, paint); paint.setStyle(Style.FILL); paint.setColor(Color.BLUE); c.drawRect(rect, paint);

086.     * 这个规则跟j2me也是一样的，在j2me里，drawRect长宽会多画出1px。SDK的说明是：

087.     *

088.     * The resulting rectangle will cover an area (width + 1) pixels wide by (height + 1) pixels tall. If either width

089.     * or height is less than zero, nothing is drawn.

090.     *

091.     * 例如drawRect(10,10,100,1)绘制，结果是一个2px高的矩形,用fillRect(10,10,100,1)，结果是一个1px高的矩形

092.     *

093.     * 以上就是对Android绘图的具体介绍。

094.     */

095.                                                                                                                                                             

096.}

097./**

098. * 在布局文件中引用 这样引用就行了..吼吼 <com.xiaoma.shadedemo.TextViewBorder android:id="@+id/a02_txtKSSJ" android:textColor="#000000"

099. * android:layout_marginLeft="10dip" android:layout_width="100dip" android:layout_height="wrap_content" />

100. */

2.4：Shape XML实现边框(XML代码)

 

view sourceprint?

01.<?xmlversion="1.0"encoding="utf-8"?>

02.<shapexmlns:android="http://schemas.android.com/apk/res/android">

03.    <!-- <solid  android:color="#cceeff"/>   直接写这个的话，可以给控制添加一个整体的背景哦 -->

04.    <stroke

05.        android:width="0.5dp"

06.        android:color="#22ccff"/>

07.    <padding android:left="5dp"android:top="5dp"android:right="5dp"android:bottom="5dp"/>

08.                                                                                                                                                       

09.    <size

10.        android:height="0.5dp"

11.        android:width="5dp"/>

12. <!-- 目前没有什么用，可删除，留在这个地方防止乱猜 -->

13.                                                                                                                                                    

14.    <cornersandroid:radius="10dp"/>

15. <!-- 这个radius里面的值需要个整型，单位用dp，用其它单位亦无影响 -->

16.                                                                                                                                                    

17.</shape>

 2.5：Selector与Shape混用控件效果实现

 

view sourceprint?

01.<?xmlversion="1.0"encoding="utf-8"?>

02.<selectorxmlns:android="http://schemas.android.com/apk/res/android">

03.                                                                                                                                                   

04.    <!-- 今天主要讲的是shape渲染，shape主要类型分四种，效果如下，我们常用rectangle，也就是矩形渲染，其它的都太丑了！！ -->

05.                                                                                                                                                   

06.                                                                                                                                                   

07.    <itemandroid:state_pressed="true"><!--按钮按下时的渲染效果 -->

08.            <shapeandroid:shape="oval">

09.                                                                                                                                                           

10.                <cornersandroid:radius="10dp"/> <!-- 四个角的角度 -->

11.                                                                                                                                                   

12.                <!--gradient就是梯度渲染，简单说就是颜色渐变，type为渐变方式，总共三种 linear sweep  ridial,常用linear-->

13.                <gradientandroid:endColor="#eebbbb"android:startColor="#9900ee"android:type="linear"/>

14.                                                                                                                                                   

15.                <!-- padding属性是指定内容与控件边距，这个地方小马专门将距左边距设置较大，方便观察 -->

16.                <paddingandroid:bottom="5dp"android:left="20dp"android:right="5dp"android:top="5dp"/>

17.                                                                                                                                                    

18.                <!-- solid填充整个区域，颜色为FFDDFF，如果使用整个区域填充的话，上面的gradient梯度会失效，即：覆盖 -->

19.                <!-- <solid  android:color="#FFDDFF"/> -->

20.                                                                                                                                                               

21.                <!-- stroke为需要填充的边框，指定颜色及边框宽度  -->

22.                <strokeandroid:width="3dp"android:color="#000000"/>

23.            </shape>

24.                                                                                                                                                           

25.        <!-- <clip android:clipOrientation="vertical" android:gravity="right" android:drawable="@drawable/ic_launcher" /> --><!-- 试了下没用 -->

26.        <!-- <color android:color="#223344"/> -->

27.        <!-- <scale android:scaleWidth="15dp" android:scaleHeight=" 5dp" android:scaleGravity="center" /> -->

28.                                                                                                                                                       

29.     </item>

30.                                                                                                                                                   

31.    <item><!-- 默认 -->

32.            <shapeandroid:shape="rectangle">

33.                                                                                                                                                           

34.                <cornersandroid:radius="10dp"/> <!-- 四个角的角度 -->

35.                                                                                                                                                   

36.                <!--gradient就是梯度渲染，简单说就是颜色渐变，type为渐变方式，总共三种 linear sweep  ridial,常用linear-->

37.                <!-- 这个地方一定注意，在使用gradient标签中使用android:type的前提是必须android:gradientRadius="20dp"已经设置，否则会报错 -->

38.                <gradientandroid:endColor="#acefda"android:startColor="#0099ff"android:type="linear"/>

39.                                                                                                                                                   

40.                <!-- padding属性是指定内容与控件边距，这个地方小马专门将距左边距设置较大，方便观察 -->

41.                <paddingandroid:bottom="5dp"android:left="20dp"android:right="5dp"android:top="5dp"/>

42.                                                                                                                                                    

43.                <!-- solid填充整个区域，颜色为FFDDFF，如果使用整个区域填充的话，上面的gradient梯度会失效，即：覆盖 -->

44.                <!-- <solid  android:color="#FFDDFF"/> -->

45.                                                                                                                                                               

46.                <!-- stroke为需要填充的边框，指定颜色及边框宽度  -->

47.                <strokeandroid:width="3dp"android:color="#000000"/>

48.            </shape>

49.     </item>

50.                                                                                                                                                    

51.                                                                                                                                                   

52.</selector>

怎么样？看着JAVA自定义TextView代码是不是觉得特别的繁琐？今天的主题就是来解决这个问题的....…^_^.........下面着重来讲一下Selector与Shape混用控件效果Selector实现的细节，（请仔细看下XML里面的注释 O_O）

每个Item过是由Shape来进行渲染生成最终的效果，首先来看根Shape节点的常用属性<shape android:shape="rectangle">：

这个shape属性总共分三种 rectangle(矩形)、oval(椭圆) 、line(删除线)、ring(铃，这个存在不知道有什么意义),其效果分别如下：

1.rectangle

 

2.oval

 

3.line
 

4.ring

 

 

其中，gradient标签中的type为渐变方式，总共三种 linear sweep ridial,常用linear,其效果分别为（注意：ridial试了无任何效果 T_T）

 

1.linear效果

 

 

2.sweep效果



好了，代码及整体效果已经分解完毕了，如果认真从头到尾的看一边的话，肯定有所收获的，对了，以上的Shape渲染写好了，可以在任意控件上使用…不限于TextView，上面的例子只是拿TextView来开刀用的…大家别误会，呵呵….^_^…. ，最后，小马希望在文章中有什么不清楚或不明白或有错误的地方，请大家直接指出…有错必改的….这个源码小马已经上传到附件中，有兴趣或有用的朋友可以直接下载来跑跑改改看，有批评才有进步，希望有什么不好的，直接指出….在此先谢谢大家啦….

 

官网参考链接如下（只是没效果图，所以大家也懒得去看这个东西）

http://developer.android.com/guide/topics/resources/drawable-resource.html

 

这段时间也有在关注各种各样的东西，老听人说学这学那的人越来越多什么的，也希望大家不要随便听人家讲，我敢说….安卓虽然在很多人眼里看来简单、烂，但我觉得如果要深入的话，水还是很深的，如果用心，一定可以做的越来越好的，一步一步来，大家一起努力！做安卓的人越来越多，越有竞争！越有动力！！！这样才会进步！哈哈….加油加油加油！ O_O