android - 如何在画布上为二维码扫描仪绘制四个边界角

Question

我需要在画布上为二维码扫描器绘制四个边界角。这是示例（我需要绘制这四个蓝色边界角）。

我知道如何绘制矩形：

 val rectF = RectF(left, top, right, bottom)
            canvas.drawRoundRect(rectF, radius, radius, paint)

但是可以只绘制边界角（没有边缘）。

请帮我。

Answer 1

一种方法是在正确的模式中绘制八条线

val lengthF = 100.0f // Length of stand out from corners

canvas.drawLine(left,top, left + lengthF, top, paint) // Top Left to right
canvas.drawLine(left,top, left, top + lengthF, paint) // Top Left to bottom
canvas.drawLine(right,top, right - lengthF, top, paint) // Top Right to left
canvas.drawLine(right,top, right, top + lengthF, paint) // Top Right to Bottom
canvas.drawLine(left,bottom, left + lengthF, bottom, paint) // Bottom Left to right
canvas.drawLine(left,bottom, left, bottom - lengthF, paint) // Bottom Left to top
canvas.drawLine(right,bottom, right - lengthF, bottom, paint) // Bottom right to left
canvas.drawLine(right,bottom, right, bottom - lengthF, paint) // Bottom right to top

更新圆角使其保持 API 级别 1

val paint = Paint();
paint.setColor(Color.BLACK);
paint.setStrokeWidth(3);
paint.setStyle(Paint.Style.STROKE);
paint.setAntiAlias(true);

val lengthF = 40.0f; // Standout of straight part
val radius = 20f;

canvas.drawLine(left + radius, top, left + lengthF, top, paint) // Top Left to right
canvas.drawLine(left,top + radius, left, top + lengthF, paint) // Top Left to bottom
val rectTL = RectF(left,top, left + (radius*2), top + (radius*2))
canvas.drawArc(rectTL,180f, 90f, false, paint);

canvas.drawLine(right - radius,top, right - lengthF, top, paint); // Top Right to left
canvas.drawLine(right,top + radius, right, top + lengthF, paint); // Top Right to Bottom
val rectTR = RectF(right - (radius*2),top, right, top + (radius*2));
canvas.drawArc(rectTR,270f, 90f, false, paint);

canvas.drawLine(left + radius,bottom, left + lengthF, bottom, paint); // Bottom Left to right
canvas.drawLine(left,bottom - radius, left, bottom - lengthF, paint); // Bottom Left to top
val rectBL = RectF(left,bottom - (radius*2), left + (radius*2), bottom);
canvas.drawArc(rectBL,90f, 90f, false, paint);

canvas.drawLine(right - radius,bottom, right - lengthF, bottom, paint); // Bottom right to left
canvas.drawLine(right,bottom - radius, right, bottom - lengthF, paint); // Bottom right to top
val rectBR = RectF(right - (radius*2),bottom - (radius*2), right, bottom);
canvas.drawArc(rectBR,0f, 90f, false, paint);

可以做类似的Path

Answer 2

您可以通过简单地使用 Canvas 的 drawPath() 方法来实现它::

使用以下方法绘制圆角边界：

fun drawBoundaries(canvas: Canvas) {

    val paint = Paint()
    paint.color = Color.RED
    paint.style = Paint.Style.STROKE
    paint.strokeWidth = 20f
    paint.isAntiAlias = true

    // Adjust according to your requirements..
    val length = canvas.width * 0.25f
    val corner = length * 0.25f
    val left = 50f
    val top = 50f
    val right = canvas.width - 50f
    val bottom = canvas.height - 50f

    val path = Path()

    // Top-Left corner..
    path.moveTo(left, top + length)
    path.lineTo(left, top + corner)
    path.cubicTo(left, top + corner, left, top, left + corner, top)
    path.lineTo(left + length, top)

    // Top-Right corner..
    path.moveTo(right - length, top)
    path.lineTo(right - corner, top)
    path.cubicTo(right - corner, top, right, top, right, top + corner)
    path.lineTo(right, top + length)

    // Bottom-Right corner..
    path.moveTo(right, bottom - length)
    path.lineTo(right, bottom - corner)
    path.cubicTo(right, bottom - corner, right, bottom, right - corner, bottom)
    path.lineTo(right - length, bottom)

    // Bottom-Left corner..
    path.moveTo(left + length, bottom)
    path.lineTo(left + corner, bottom)
    path.cubicTo(left + corner, bottom, left, bottom, left, bottom - corner)
    path.lineTo(left, bottom - length)

    // Draw path..
    canvas.drawPath(path, paint)
}