Paint详细解析（1）—Shader(图像渲染)

1.构造方法详解

---

1)BitmapShader(图像渲染)

BitmapShader(Bitmap bitmap, Shader.TileMode tileX, Shader.TileMode tileY)

使用一张位图作为纹理来对某一区域进行填充，参数依次：

• bitmap：用来作为填充的位图；
• tileX：X轴方向上位图的衔接形式；
• tileY：Y轴方向上位图的衔接形式；

而这个Shader.TileMode有三种：

• CLAMP就是如果渲染器超出原始边界范围，则会复制边缘颜色对超出范围的区域进行着色
• REPEAT则是平铺形式重复渲染
• MIRROR则是在横向和纵向上以镜像的方式重复渲染位图。

---

2)ComposeShader(混合渲染)

ComposeShader(Shader shaderA, Shader shaderB, PorterDuff.Mode mode)

渲染效果的叠加，看到PorterDuff就知道什么了吧？比如将BitmapShader与LinearGradient的混合渲染 效果等。参数依次：

• shaderA：第一种渲染效果
• shaderB：第二种渲染效果
• mode：两种渲染效果的叠加模式

---

3)LinearGradient(线性渲染)

LinearGradient(float x0, float y0, float x1, float y1, int[] colors, float[] positions, Shader.TileMode tile);

实现某一区域内颜色的线性渐变效果，参数依次是：

• x0：渐变的起始点x坐标
• y0：渐变的起始点y坐标
• x1：渐变的终点x坐标
• y1：渐变的终点y坐标
• colors：渐变的颜色数组
• positions：颜色数组的相对位置
• tile：平铺方式

---

4)RadialGradient(环形渲染)

public RadialGradient (float x, float y, float radius, int[] colors, float[] positions, Shader.TileMode tile);

实现某一区域内颜色的环形渐变效果，参数依次是：

• x：环形的圆心x坐标
• y：环形的圆心y坐标
• radius：环形的半径
• colors：环形渐变的颜色数组
• positions：指定颜色数组的相对位置
• tile：平铺方式

---

5)SweepGradient(梯度渲染)

public SweepGradient (float cx, float cy, int[] colors, float[] positions)

扫描渲染，就是以某个点位中心旋转一周所形成的效果！参数依次是：

• cx：扫描的中心x坐标
• cy：扫描的中心y坐标
• colors：梯度渐变的颜色数组
• positions：指定颜色数组的相对位置

---

可能从文字上我们可以简单的知道下他们对应的一个大概作用，但是我们还是写个代码来 验证下他们所起的作用，毕竟有码(图)有真相吗~

2.使用代码示例：

运行效果图：

实现代码：

BitmapShaderView.Java：

[java] view plain copy

 

1. /** 
2.  * Created by Jay on 2015/11/4 0030. 
3.  */  
4. public class BitmapShaderView extends View {  
5.   
6.   
7.     private Bitmap mBitmap = null;  
8.     private ShapeDrawable sDrawable = null;  
9.     private Paint mPaint = null;  
10.     private int bitW = 0, bitH = 0;     //Bitmap宽高  
11.   
12.     private Shader mBitmapShader = null;   //Bitmap渲染  
13.     private Shader mLinearGradient = null; //线性渐变渲染  
14.     private Shader mComposeShader = null; //混合渲染  
15.     private Shader mRadialGradient = null; //环形渐变渲染  
16.     private Shader mSweepGradient = null; //梯度渲染  
17.   
18.   
19.     public BitmapShaderView(Context context) {  
20.         this(context, null);  
21.     }  
22.   
23.     public BitmapShaderView(Context context, AttributeSet attrs) {  
24.         super(context, attrs);  
25.         init();  
26.     }  
27.   
28.     public BitmapShaderView(Context context, AttributeSet attrs, int defStyleAttr) {  
29.         super(context, attrs, defStyleAttr);  
30.     }  
31.   
32.   
33.     private void init() {  
34.   
35.         mBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.img_cat);  
36.         bitW = mBitmap.getWidth();  
37.         bitH = mBitmap.getHeight();  
38.         mPaint = new Paint();  
39.   
40.         //创建BitmapShader  
41.         mBitmapShader = new BitmapShader(mBitmap, Shader.TileMode.MIRROR, Shader.TileMode.MIRROR);  
42.   
43.         //创建LinearGradient并设置渐变的颜色数组  
44.         mLinearGradient = new LinearGradient(0, 0, 100, 100,  
45.                 new int[]{Color.RED, Color.GREEN, Color.BLUE, Color.WHITE},  
46.                 null, Shader.TileMode.REPEAT);  
47.   
48.         //混合渲染，这里使用了BitmapShader和LinearGradient进行混合，可以试试其他~  
49.         mComposeShader = new ComposeShader(mBitmapShader, mLinearGradient, PorterDuff.Mode.DARKEN);  
50.   
51.         //环形渐变渲染  
52.         mRadialGradient = new RadialGradient(50, 200, 50,  
53.                 new int[]{Color.GREEN, Color.RED, Color.BLUE, Color.WHITE},  
54.                 null, Shader.TileMode.REPEAT);  
55.   
56.         //梯度渲染  
57.         mSweepGradient = new SweepGradient(30, 30, new int[]{Color.GREEN, Color.RED,  
58.                 Color.BLUE, Color.WHITE}, null);  
59.   
60.     }  
61.   
62.     @Override  
63.     protected void onDraw(Canvas canvas) {  
64.         super.onDraw(canvas);  
65.   
66.         //将图片裁剪为椭圆形  
67.         sDrawable = new ShapeDrawable(new OvalShape());  
68.         sDrawable.getPaint().setShader(mBitmapShader);  
69.         sDrawable.setBounds(0, 0, bitW, bitH);  
70.         sDrawable.draw(canvas);  
71.   
72.         //绘制线性渐变的矩形  
73.         mPaint.setShader(mLinearGradient);  
74.         canvas.drawRect(bitW, 0, bitW * 2, bitH, mPaint);  
75.   
76.         //绘制混合渲染效果  
77.         mPaint.setShader(mComposeShader);  
78.         canvas.drawRect(0, bitH, bitW , bitH * 2, mPaint);  
79.   
80.         //绘制环形渐变  
81.         mPaint.setShader(mRadialGradient);  
82.         canvas.drawCircle(bitW * 2.8f, bitH / 2, bitH / 2, mPaint);  
83.   
84.         //绘制梯度渐变  
85.         mPaint.setShader(mSweepGradient);  
86.         canvas.drawRect(bitW, bitH, bitW * 2, bitH * 2, mPaint);  
87.   
88.   
89.     }  
90. }  

就那么一百来行代码，就不用解释了吧，如果觉得有疑惑的，动手试试~