自定义View绘图篇(二)-Paint

2018-10-13  本文已影响0人  Active_Loser

1、常用方法

方法 描述 方法 描述
setARGB 设置绘制的颜色，a代表透明 setAlpha 设置绘制图形的透明度
setColor 设置绘制的颜色 setAntiAlias 设置是否使用抗锯齿功能，会消耗资源
setDither 是否使用图像抖动处理，图片平滑和清晰 setStyle 设置画笔的样式，如FILL，FILL_OR_STROKE，或STROKE
setStrokeWidth 设置笔刷的粗细度 setStrokeCap 设置笔刷的图形样式， 如圆Cap.ROUND,或方形样式Cap.SQUARE
setFilterBitmap 是否在图像进行动画时滤掉对Bitmap图像的优化操作 setSrokeJoin 设置接合处的状态,MITER(锐角)、ROUND(圆弧)、BEVEL(直线)
setTextSize 设置绘制文字的字号大小 setTextColor 设置文字颜色
setTextAlign 设置绘制文字的对齐方向 setTextScaleX 设置绘制文字x轴的缩放比例
setTextSkewX 设置斜体文字，skewX为倾斜弧度 setUnderlineText 设置带有下划线的文字效果
setStrikeThruText 设置带有删除线的效果 setFakeBoldText 模拟实现粗体文字，设置在小字体上效果会非常差

2、设置字体setTypeface

Typeface:

使用：

paint.setTypeface(Typeface.DEFAULT)；

3、文字基线

计算文本的垂直方向的中间线与所占布局中间线的偏移量的方法为：

tip 内容引用自https://www.jianshu.com/p/15b8163ee8e7

image

其中baseline为基线，基线以上为负值，以下为正值。即top, ascent为负值，descent, bottom为正值。

image

4、实现滤镜效果setMaskFilter

4.1、BlurMaskFilter(模糊)

构造方法：

BlurMaskFilter(float radius, Blur style)

BlurMaskFilter bmf = new BlurMaskFilter(10f, BlurMaskFilter.Blur.OUTER);
paint.setMaskFilter(bmf);
canvas.drawText("我是一段模糊的文本~", 100, 100, paint);

setLayerType(View.LAYER_TYPE_SOFTWARE, null);     //关闭硬件加速

4.2、EmbossMaskFilter(浮雕)

通过指定环境光源的方向和环境光强度来添加浮雕效果，是图片更具与立体效果

EmbossMaskFilter(float[] direction, float ambient, float specular, float blurRadius)

float[] direction = new float[]{ 1, 1, 3 };   // 设置光源的方向
float light = 0.4f;     //设置环境光亮度
float specular = 8;     // 定义镜面反射系数
float blur = 3.0f;      //模糊半径
EmbossMaskFilter emboss=new EmbossMaskFilter(direction,light,specular,blur);
paint.setMaskFilter(emboss);
canvas.drawText("我是一段具有浮雕效果的文本~", 100, 100, paint);

setLayerType(View.LAYER_TYPE_SOFTWARE, null);     //关闭硬件加速

5、图形重叠处理setXfermode

注意事项：

关闭硬件加速

再API 11后，在程序集中加入了对GPU的支持，而当我们的targetSdkVersion >= 14以上版本都是默认开启硬件加速的，而有些函数是不支持硬件加速的，因此需要关闭，关闭方式有以下三种：

使用离屏缓冲

saveLayer绘图流程：

这是因为在调用saveLayer时，会生成了一个全新的bitmap，这个bitmap的大小就是我们指定的保存区域的大小，新生成的bitmap是全透明的，在调用saveLayer后所有的绘图操作都是在这个bitmap上进行的。若没有设置，我们先把整个画布给染成了绿色，然后再画上了一个圆形，所以在应用xfermode来画源图像的时候，目标图像当前Bitmap上的所有图像了，也就是整个绿色的屏幕和一个圆形了。所以这时候源图像的相交区域是没有透明像素的，透明度全是100%，即saveLayer是为了区分哪一步的图形应该与合成模式和Bitmap去合成。

 int saved = canvas.saveLayer(null, null, Canvas.ALL_SAVE_FLAG);
 canvas.restoreToCount(saved);

处理方式：

这里涉及2个概念：源图像（SRC）：图上黄色圆形，目标图形（DST)：图上蓝色矩形。先设置重叠处理模式，再绘制时先绘制源图像，再绘制目标图形，会形成下面不同结果。

5.1、实现刮刮卡

思路：

  1. 使用Canvas绘制背景，以及展示给用户的中奖信息。
  2. 创建一个Bitmap用于保存给予用户展示的灰色层以及处理用户触摸path路径的交互。
  3. 将bitmap绘制Canvas中达到效果。

tip：做一个遮盖层，然后随着用户的刮开透明，完整代码：快速传送门。

6、设置渐变

 setShader(Shader shader)

6.1、线性渐变

LinearGradient(float x0, float y0, float x1, float y1, int color0, int color1, Shader.TileMode tile) 。

参数：

6.2、辐射渐变

中心向周围辐射状的渐变

RadialGradient(float centerX, float centerY, float radius, int centerColor, int edgeColor, TileMode tileMode)。

参数：

6.3、扫描渐变

SweepGradient(float cx, float cy, int color0, int color1)

参数：
cx cy ：扫描的中心
color0：扫描的起始颜色
color1：扫描的终止颜色

Shader shader = new SweepGradient(300, 300, Color.BLUE, Color.RED);
        mPaint.setShader(shader);
        canvas.drawCircle(300, 300, 200, mPaint);

6.4、BitmapShader

用 Bitmap 的像素来作为图形或文字的填充

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

参数：

Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.scratch);
        Shader shader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
mPaint.setShader(shader);
canvas.drawCircle(300, 300, 200, mPaint);
1539423445652.png

7、路径样式

设置路径样式

setPathEffect(PathEffect effect)

7.1、圆形拐角效果

CornerPathEffect(float radius)

参数：

path.moveTo(100, 100);
path.lineTo(200,200);
path.lineTo(400, 100);
path.lineTo(400, 400);
path.lineTo(600, 100);
mPaint.setPathEffect(new CornerPathEffect(100));
canvas.drawPath(path, mPaint);

7.2、虚线效果

DashPathEffect(float intervals[], float phase)

参数：

//.........
mPaint.setPathEffect(new DashPathEffect(new float[]{5,5},2));
canvas.drawPath(path, mPaint);

7.3、离散路径效果

DiscretePathEffect(float segmentLength, float deviation)

参数：

//.......
mPaint.setPathEffect(new DiscretePathEffect(4,5));
canvas.drawPath(path, mPaint);

7.4、Path形状效果

PathDashPathEffect(Path shape, float advance, float phase,Style style)

参数：

path.moveTo(100, 100);
path.lineTo(200,200);
path.lineTo(400, 100);
path.lineTo(400, 400);
path.lineTo(600, 100);

Path stampPath = new Path();
stampPath.moveTo(0, 20);
stampPath.lineTo(10, 0);
stampPath.lineTo(20, 20);
stampPath.close();
stampPath.addCircle(0, 0, 3, Path.Direction.CCW);

mPaint.setPathEffect(new PathDashPathEffect(stampPath, 35, 0, PathDashPathEffect.Style.TRANSLATE));
canvas.drawPath(path, mPaint);
上一篇 下一篇

猜你喜欢

热点阅读