Android Paint总结

本文主要总结一下Paint对象的常用Api以及着色器等对象的使用

Paint对象在开发过程中经常会用到,先看下Paint的常用Api

  mPaint = new Paint();//初始化
        mPaint.setColor(Color.RED);//设置颜色
        mPaint.setARGB(255,255,255,0);//设置paint对象颜色,范围0~255
        mPaint.setAlpha(200);//设置透明度 范围0~255
        mPaint.setAntiAlias(true);//设置抗锯齿
        mPaint.setStyle(Paint.Style.STROKE);//设置描边效果STROKE(描边) FILL(填充) 和FILL_AND_STROKE(同时作用)
        mPaint.setStrokeWidth(4);//设置描边宽度
        mPaint.setStrokeCap(Paint.Cap.ROUND);//设置圆角效果  BUTT(默认) ROUND(圆角) SQUARE(方形)
        mPaint.setStrokeJoin(Paint.Join.MITER);//设置拐角风格  MITER(默认) ROUND(圆角填充) BEVEL(切除)
        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);//设置文本缩放倍数  默认是1
        mPaint.setTextSize(38);//设置字体大小
        mPaint.setTextAlign(Paint.Align.LEFT);//设置对其方式
        mPaint.setUnderlineText(true);//设置下划线
        String str="Paint测试效果";
        Rect rect = new Rect();
        mPaint.getTextBounds(str,0,str.length(),rect);//测量文本大小,将文本大小信息存放在rect中
        mPaint.measureText(str);//获取文本的宽
        mPaint.getFontMetrics();//获取字体度量对象

很常见和很基础的Api就不多说了,备注写的很清楚,也可以在Android Studio中打开源码看一眼。
有几个需要简单说明的先说一下:
setStrokeCap 设置圆角效果:有三个模式 BUTT(默认) ROUND(圆角) SQUARE(方形)
我们看下对应的效果图

圆角效果.png
1.BUTT 为默认的效果,如图
2.ROUND 为圆角效果,会在结尾补充圆角效果
3.SQUARE 为方形效果,会在结尾补充矩形效果
setStrokeJoin 设置拐角风格,MITER(默认) ROUND(圆角填充) BEVEL(切除),看下效果图
拐角风格.png
1.MITER 为默认效果,如图
2.BEVEL 是一种"切除拐角"的效果
3.ROUND 是一种"圆角填充拐角"的效果
setFilterBitmap 设置双线性过滤,这个直接看对比图吧,左边的是未设置,右边的是设置了双线性过滤 双线性过滤前后效果.png
可以看到设置双线性过滤可以让图片中色彩变化更平滑。
另外简单介绍一下FontMetrics字体度量对象,先看张图:
字体度量对象.jpg
可以看到,字体度量的各方面属性都封装在了这个对象里,主要包含: baseline,ascent,top,descent,bottom,leading等属性

下面主要介绍一些不是很常用但是也是比较重要的几个Api和相关对象等:

• setShader 设置渲染器(着色器)
  有一下几种渲染器可以选用

1.*LinearGradient * 线性渲染器

它的构造方法有两个,第一个: LinearGradient(float x0, float y0, float x1, float y1, int color0, int color1,TileMode tile) 

x0,y0表示起始点坐标。x1,y1表示结束点坐标。color0表示起始点颜色值,color1表示结束点颜色值。 tile表示端点范围之外的着色规则,类型为TileMode。这个比较简单绘制出来是线性颜色渐变,这里不贴图和代码了。
第二个: LinearGradient(float x0, float y0, float x1, float y1, int colors[],
float positions[], TileMode tile)
positions可以为null ,但是如果不是null,positions.length()应该和colors.length()相等,对应的是相对位置的颜色值
看一下代码和展示效果:

        mPaint.setAntiAlias(true);
        mPaint.setStyle(Paint.Style.FILL);
        LinearGradient shader = new LinearGradient(0, 0, 500, 500,new int[]{Color.RED,Color.BLUE},null ,Shader.TileMode.CLAMP);
        mPaint.setShader(shader);
        canvas.drawRect(0,0,500,500,mPaint);

LinearGradient

2.RadialGradient环形渲染器 :

看下代码和效果:

 RadialGradient radialGradient = new RadialGradient(250, 250, 250, new int[]{Color.GREEN, Color.YELLOW, Color.RED}, null, Shader.TileMode.CLAMP);
        mPaint.setShader(radialGradient);
        canvas.drawCircle(250,250,250,mPaint);

环形渲染器

3.SweepGradient 扫描渲染,类似雷达效果

看下代码和效果:

SweepGradient sweepGradient = new SweepGradient(250, 250, Color.GREEN, Color.RED);
        mPaint.setShader(sweepGradient);
        canvas.drawCircle(250,250,250,mPaint);

扫描渲染

4.位图渲染 BitmapShader

我先看下正常效果:绘制一个矩形,矩形的宽高等于Bitmap的宽高

        BitmapShader bitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        mPaint.setShader(bitmapShader);
        canvas.drawRect(0,0,bitmap.getWidth(),bitmap.getHeight(),mPaint);

image.png
我们看到效果是将Bitmap正常的会知道了Canvas上
接下来我们看下将绘制的矩形的宽高设置为Bitmap的2倍的情况

        BitmapShader bitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        mPaint.setShader(bitmapShader);
        canvas.drawRect(0,0,bitmap.getWidth()*2,bitmap.getHeight()*2,mPaint);

image.png
我们看到了一个奇怪的效果,决定这个效果的两个参数BitmapShader构造的后两个参数,当绘制区域超过Bitmap本身大小时候,超出区域的绘制,有后面两个参数决定
*TileMode.CLAMP 表示超出区域以图片最后一个像素填充,如图
*TileMode.REPEAT 表示超出区域平铺,重复绘制图片
*TileMode.MIRROR 表示镜像绘制
第一个参数表示X轴方向,第二个参数表示Y轴方向,两个参数可以自由组合,三种效果依次如下图: image.png

TileMode作用于LinearGradient的效果同上.

5.组合渲染

使用ComposeShader可以将两种渲染模式组合使用

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

ComposeShader构造的最后一个参数PorterDuff.Mode表示两种渲染Shader混合使用的的模式,代码使用的是混合模式,效果如下图:

image.png

对于PorterDuff.Mode图层混合模式的使用,请见Android 图层混合模式PorterDuff.Mode