android自定义控件-paint详解

703 阅读3分钟

这是我参与更文挑战的第3天,活动详情查看: 更文挑战

github代码(所在分支paint)

github.com/ananananzhu…

Paint Api介绍

设置画笔颜色
 public void setColor(@ColorInt int color)
设置画笔宽度
paint.setStrokeWidth(10)

在画笔宽度为0的情况下,仍然能以1像素进行绘制,但是画布缩放的时候绘制线条的宽度不会变 如果画笔的宽度为1那么放大画布一倍的时候,线条的宽度会变为2

抗锯齿
setAntiAlias(true) 

true:柔化处理
false:不柔化处理

抗锯齿是指在图像中,物体边缘总会或多或少的呈现三角形的锯齿,而抗锯齿就是指对图像边缘进行柔化处理,使图像边缘看起来更平滑,更接近实物的物体

画笔透明度
public void setAlpha(int a)

a:范围0-255

0:透明

255:完全不透明

设置透明度和颜色
 public void setARGB(int a, int r, int g, int b)

参数范围都是0-255

设置画笔样式
 public void setStyle(Style style)

Paint.Style.FILL:填充内部(例如这种模式画一个圆圆内部颜色是被填充的)

Paint.Style.STROKE :描边(内部不被填充,可以用来绘制圆环)

Paint.Style.FILL_AND_STROKE :填充内部和描边(展示效果和FILL看起来是一样的)

线条连接处样式
 public void setStrokeJoin(Join join)
public static enum Join {
  BEVEL,
  MITER,
  ROUND
}

BEVEL:连接处是斜线的模式

MITER:直角

ROUND:圆角 样式 效果展示:

图中第三个写错了,应该是圆角

public void setStrokeMiter
 public void setStrokeMiter

MITER模式下小角度的情况下会自动把尖角转换为斜线模式 效果展示:

设置线头的模式
 public void setStrokeCap(Cap cap)
public static enum Cap {
  BUTT,平头
  ROUND,圆头
  SQUARE  方块
}

效果展示:

拐角变圆角
public PathEffect setPathEffect(PathEffect effect)

设置setPathEffect代码示例

paint.pathEffect=CornerPathEffect(40)

效果动图展示 如下图中的两个路径,本身两者的路径是相同的,但是我们通过滑动Seekbar后动态改变第二个路径Paint的pathEffect属性,然后第二个路径就逐渐变得圆润了

设置虚线
 paint.pathEffect = DashPathEffect(floatArrayOf(10f, 20f), 50f)

DashPathEffect第一个参数数组中数字第0个值表示虚线的长度,第1个值表示两个虚线之间的长度

绘制虚线代码

 override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        path.reset()
        path.apply {
            moveTo(100f, 100f)
            lineTo(300f, 200f)
            lineTo(100f, 400f)
            lineTo(300f, 900f)
            lineTo(80f, 1000f)
            close()
        }
        canvas?.drawPath(path, paint)
    }

代码实现效果

PathDashPathEffect

复制别人博客的代码:

Path dashPath = ...; // 使用一个三角形来做 dash  
PathEffect pathEffect = new PathDashPathEffect(dashPath, 40, 0,  
        PathDashPathEffectStyle.TRANSLATE);
paint.setPathEffect(pathEffect);

...

canvas.drawPath(path, paint);  

参考效果:

DiscretePathEffect() 设置线条随机偏移

SumPathEffect () 两种线条模式都执行

Gradient渐变模式

渐变模式的集中模式:

"LinearGradient" 线性渐变

"RadialGradient" 径向渐变

"SweepGradient" 扫描渐变

"BitmapShader" 位图渐变

"ComposeShader" 混合渐变,可以有多个shader混合在一起

设置阴影
setShadowLayer(float radius, float dx, float dy, int shadowColor)

radius 是阴影的模糊范围; dx dy 是阴影的偏移量; shadowColor 是阴影的颜色。

模糊效果的 MaskFilter

一共四个模式:

NORMAL: 内外都模糊绘制

SOLID: 内部正常绘制,外部模糊

INNER: 内部模糊,外部不绘制

OUTER: 内部不绘制,外部模糊

 var maskFilter: BlurMaskFilter = BlurMaskFilter(50f, BlurMaskFilter.Blur.SOLID)
 canvas?.translate(measuredWidth / 2f, measuredHeight / 2f)
 canvas?.drawBitmap(bitmap, -200f, -200f, paint)

getTextPath路径

获取文本的路径

代码展示:

override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        val text = "测试文本 Test"
        val srcPaint = Paint()
        srcPaint.textSize = 100f
        srcPaint.color = Color.BLACK
        srcPaint.style = Paint.Style.STROKE
        canvas?.drawText(text, 50f, 100f, srcPaint)
        //获取文本路径
        canvas?.translate(0f, 150f)
        val desPath = Path()
        val desPaint = Paint()
        desPaint.textSize = 100f
        desPaint.color = Color.RED
        desPaint.strokeWidth = 5f
        desPaint.style = Paint.Style.STROKE
        srcPaint.getTextPath(text, 0, text.length, 50f, 100f, desPath)
        canvas?.drawPath(desPath, desPaint)

    }

代码效果展示: