Paint画笔高级应用

207 阅读5分钟
   paint常用的API
 // mPaint.setColor(Color.RED);// 设置颜色    
 // mPaint.setARGB(255, 255, 255, 0); // 设置 Paint对象颜色,范围为0~255
 //mPaint.setAlpha(200); // 设置alpha不透明度,范围为0~255       
 // mPaint.setAntiAlias(true); // 抗锯齿       
 // mPaint.setStyle(Paint.Style.FILL);  // 描边效果
// mPaint.setStrokeWidth(4);//描边宽度//     
 //  mPaint.setStrokeCap(Paint.Cap.ROUND); //圆角效果//       
 // mPaint.setStrokeJoin(Paint.Join.MITER);//拐角风格//        
 // mPaint.setShader(new SweepGradient(200, 200, Color.BLUE, Color.RED)); //设置环形渲染器//      
 //  mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DARKEN)); //设置图层混合模式//        
 // mPaint.setColorFilter(new LightingColorFilter(0x00ffff, 0x000000)); //设置颜色过滤器//       
 // mPaint.setFilterBitmap(true); //设置双线性过滤//        
 // mPaint.setMaskFilter(new BlurMaskFilter(10, BlurMaskFilter.Blur.NORMAL));//设置画笔遮罩滤镜 ,传入度数和样式//       
 // mPaint.setTextScaleX(2);// 设置文本缩放倍数//        
 // mPaint.setTextSize(38);// 设置字体大小//       
 // mPaint.setTextAlign(Paint.Align.LEFT);//对其方式//       
 // mPaint.setUnderlineText(true);// 设置下划线////       
 // String str = "Android高级工程师";//      
 //  Rect rect = new Rect();//       
 // mPaint.getTextBounds(str, 0, str.length(), rect); //测量文本大小,将文本大小信息存放在rect中//      
 //  mPaint.measureText(str); //获取文本的宽//       
 // mPaint.getFontMetrics(); //获取字体度量对象


private Paint mPaint;

public GradientLayout(Context context, AttributeSet attrs, int defStyleAttr)
{
    super(context, attrs, defStyleAttr);
    mPaint = new Paint();
    mPaint.setColor(Color.RED);//设置画笔颜色
    //Android中的颜色值通常遵循RGB/ARGB标准,使用时通常以“ # ”字符开头的8位16进制表示。其中ARGB 依次代表透明度(Alpha)、红色(Red)、绿色(Green)、蓝色(Blue),取值范围为0 ~ 255(即16进制的0x00 ~ 0xff)。
    //A 从0x00到0xff表示从透明到不透明,RGB 从0x00到0xff表示颜色从浅到深。当RGB全取最小值(0或0x000000)时颜色为黑色,全取最大值(255或0xffffff)时颜色为白色。
    //mPaint.setARGB(255, 255, 255, 0); // 设置 Paint对象颜色,范围为0~255
    mPaint.setAntiAlias(true); // 抗锯齿
    mPaint.setStyle(Paint.Style.FILL); //描边效果
    mPaint.setStrokeWidth(40);//线宽
    //如果是画一条直线 加上  mPaint.setStrokeCap(Paint.Cap.ROUND) 就是圆角效果
    mPaint.setStrokeCap(Paint.Cap.ROUND); //圆角效果

  
}



mPaint.setStrokeJoin(Paint.Join.MITER);//拐角风格

Paint的一个基本方法setStrokeJoin,它对应Paint.Join的枚举值。

public enum Join {

    MITER   (0),

    ROUND   (1),

    BEVEL   (2);

}

这个方法是设置拐角的样式,默认值是MITER


Join.MITER:结合处为锐角
Join.ROUND:结合处为圆弧
Join.BEVEL:结合处为直线

Path path  = new Path();
path.moveTo(100,100);
path.lineTo(450,100);
path.lineTo(100,300);
mPaint.setStrokeJoin(Paint.Join.MITER);//锐角
canvas.drawPath(path,mPaint);

path.moveTo(100,400);
path.lineTo(450,400);
path.lineTo(100,600);
mPaint.setStrokeJoin(Paint.Join.BEVEL);//直线
canvas.drawPath(path,mPaint);

path.moveTo(100,700);
path.lineTo(450,700);
path.lineTo(100,900);
mPaint.setStrokeJoin(Paint.Join.ROUND);//圆弧
canvas.drawPath(path,mPaint);




高级渲染

首先是高级渲染部分。所谓高级渲染,其实就是通过setShader(Shader shader)方法来设置图像效果。
Shader是渲染器的意思,canvas.drawXXX()画出了具体的形状,而画笔的shader则定义了图形的着色和外观。

1线性渲染 LinearGradient

//    1.线性渲染,LinearGradient(float x0, float y0, float x1, float y1, @NonNull @ColorInt int colors[], @Nullable float positions[], @NonNull TileMode tile)//
//    (x0,y0):渐变起始点坐标//
//    (x1,y1):渐变结束点坐标//
//    color0:渐变开始点颜色,16进制的颜色表示,必须要带有透明度
//    olor1:渐变结束颜色
//    colors:渐变数组    new int[]{Color.RED, Color.BLUE, Color.GREEN}
//    positions:位置数组,position的取值范围[0,1],作用是指定某个位置的颜色值,如果传null,渐变就线性变化。//       new float[]{0.f,0.7f,1}
//    TileMode  tile:用于指定控件区域大于指定的渐变区域时,空白区域的颜色填充方法
public enum TileMode {
    /**
     * replicate the edge color if the shader draws outside of its
     * original bounds
     */
    CLAMP   (0),默认
    /**
     * repeat the shader's image horizontally and vertically
     */
    REPEAT  (1),重复
    /**
     * repeat the shader's image horizontally and vertically, alternating
     * mirror images so that adjacent images always seam
     */
    MIRROR  (2);镜子

    TileMode(int nativeInt) {
        this.nativeInt = nativeInt;
    }
    final int nativeInt;
}


Shader mShader = new LinearGradient(0, 0, 500, 500, new int[]{Color.RED, Color.BLUE},null, Shader.TileMode.CLAMP);//
mPaint.setShader(mShader);////
//canvas.drawCircle(250, 250, 250, mPaint);//
canvas.drawRect(0, 0, 500, 500, mPaint);




positions数组不为空时 new float[]{0.5f,1}

Shader mShader = new LinearGradient(0, 0, 500, 500, new int[]{Color.RED, Color.BLUE},new float[]{0.5f,1}, Shader.TileMode.CLAMP);//
mPaint.setShader(mShader);////
//canvas.drawCircle(250, 250, 250, mPaint);//
canvas.drawRect(0, 0, 500, 500, mPaint);





Shader.TileMode 为 Shader.TileMode.REPEAT 模式时

Shader mShader = new LinearGradient(0, 0, 500, 500, new int[]{Color.RED, Color.BLUE},null, Shader.TileMode.REPEAT);
mPaint.setShader(mShader);////
canvas.drawRect(0, 0, 1000, 1000, mPaint);




Shader.TileMode 为 Shader.TileMode.MIRROR模式时




Shader mShader = new LinearGradient(0, 0, 200, 200, new int[]{Color.RED, Color.BLUE},null, Shader.TileMode.MIRROR);
mPaint.setShader(mShader);////
canvas.drawCircle(500,500,500,mPaint);




2环形渲染SweepGradient

 环形渲染,RadialGradient(float centerX, float centerY, float radius, @ColorInt int colors[], @Nullable float stops[], TileMode tileMode)////
 centerX ,centerY:shader的中心坐标,开始渐变的坐标////
 radius:渐变的半径////
 centerColor,edgeColor:中心点渐变颜色,边界的渐变颜色////
 colors:渐变颜色数组////
 stoops:渐变位置数组,类似扫描渐变的positions数组,取值[0,1],中心点为0,半径到达位置为1.0f////
 tileMode:shader未覆盖以外的填充模式。////         *///
 Shader mShader = new RadialGradient(500, 500, 500, new int[]{Color.GREEN, Color.YELLOW, Color.RED}, null, Shader.TileMode.CLAMP);//
 mPaint.setShader(mShader);//
 canvas.drawCircle(500, 500, 500, mPaint);




3扫描渲染 SweepGradient

扫描渲染 SweepGradient(float cx, float cy, @ColorInt int color0,int color1)  
cx,cy 渐变中心坐标
color0,color1:渐变开始结束颜色   
Shader   mShader = new SweepGradient(250, 250, Color.RED, Color.GREEN);//
mPaint.setShader(mShader);//
canvas.drawCircle(250, 250, 250, mPaint);


4位图渲染,BitmapShader

//  位图渲染,BitmapShader(@NonNull Bitmap bitmap, @NonNull TileMode tileX, @NonNull TileMode tileY)//////
// Bitmap:构造shader使用的bitmap
// tileX:X轴方向的TileMode
// tileY:Y轴方向的TileMode REPEAT, 绘制区域超过渲染区域的部分,重复排版
//  CLAMP, 绘制区域超过渲染区域的部分,会以最后一个像素拉伸排版
//  MIRROR, 绘制区域超过渲染区域的部分,镜像翻转排版        

x轴方向 采用 Shader.TileMode.REPEAT
y 轴方向 采用  Shader.TileMode.MIRROR

mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
Shader mShader = new BitmapShader(mBitmap, Shader.TileMode.REPEAT, Shader.TileMode.MIRROR);//
mPaint.setShader(mShader);//
// canvas.drawRect(0,0,500, 500, mPaint);////
canvas.drawCircle(500, 500, 500, mPaint);



5 组合渲染,

/**        
 *  组合渲染,         
 *  ComposeShader(@NonNull Shader shaderA, @NonNull Shader shaderB, Xfermode mode)        
 *  ComposeShader(@NonNull Shader shaderA, @NonNull Shader shaderB, PorterDuff.Mode mode)       
 *  shaderA,shaderB:要混合的两种shader         * Xfermode mode: 组合两种shader颜色的模式         
 *  PorterDuff.Mode mode: 组合两种shader颜色的模式      
 *  */

PorterDuff.Mode.MULTIPLY 图层混合模式

mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
BitmapShader bitmapShader = new BitmapShader(mBitmap, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT);
LinearGradient linearGradient = new LinearGradient(0, 0, 1000, 1600, new int[]{Color.RED, Color.GREEN, Color.BLUE}, null, Shader.TileMode.CLAMP);
Shader mShader = new ComposeShader(bitmapShader, linearGradient, PorterDuff.Mode.MULTIPLY);
mPaint.setShader(mShader);
canvas.drawCircle(250, 250, 250, mPaint);