android - 如何在 android 画布上的自定义形状上绘制描边

Question

我正在尝试将笔触添加到我添加的自定义形状中。

这是代码

    private void drawBackground(Canvas canvas) {

          float height = getHeight();
          float width = getWidth();

          canvas.drawRoundRect(0, 0, width, height, 5, 5, canvasPaint);
          canvas.drawRoundRect(0, 0, getTextWidth(), getHeight(), 5, 5, canvasStrokePaint);//to draw black stroke

          canvas.drawText(name, width / 2 - getTextWidth() / 2, getBitmapHeight() + 20, textPaint);
          Path path = new Path();

          path.moveTo((width / 3), height);
          path.lineTo((width / 2), (height + height / 3));
          path.lineTo((width - width / 3), height);
          path.lineTo((width / 3), height);

          path.close();

          canvas.drawPath(path, canvasPaint);
          canvas.drawPath(path, canvasStrokePaint);//to draw black stroke
}

输出

在这里，您可以看到矩形和三角形的闭合边。

但是笔划应该在形状之外。

要求

提前致谢

Answer 1

试试这个代码：

private void drawStroke(Canvas canvas) {
    int rectangleWidth = 20;
    int rectangleHeight = 10;
    float height = getHeight();
    float width = getWidth();

    // start
    canvasStrokePath.reset();
    canvasStrokePath.moveTo(0, 5);

    // first arc
    arcRect.set(0, 0, 10, 10);
    canvasStrokePath.arcTo(arcRect, 180, -90, true);

    // going right
    canvasStrokePath.lineTo(width - 10, 0);

    // second arc
    arcRect.set(width - 10, 0, width, 10);
    canvasStrokePath.arcTo(arcRect, 90, -90, true);

    // going bottom
    canvasStrokePath.lineTo(width, height - rectangleHeight - 10);

    // third arc
    arcRect.set(width - 10, height - rectangleHeight - 10, width, height - rectangleHeight);
    canvasStrokePath.arcTo(arcRect, 0, -90, true);

    // going to rectangle (right edge)
    canvasStrokePath.lineTo(width / 2 + rectangleWidth / 2, height - rectangleHeight);

    // going to rectangle center
    canvasStrokePath.lineTo(width / 2, height);

    // going to rectangle (left edge)
    canvasStrokePath.lineTo(width / 2 - rectangleWidth / 2, height - rectangleHeight);

    // going to left
    canvasStrokePath.lineTo(5, height - rectangleHeight);

    // fourth arc
    arcRect.set(0, height - rectangleHeight - 10, 10, height - rectangleHeight);
    canvasStrokePath.arcTo(arcRect, 270, -90, true);

    // going to top
    canvasStrokePath.lineTo(0, 5);

    canvasStrokePath.close();

    canvas.drawPath(canvasStrokePath, canvasStrokePaint);
}

我没建，希望不会出错

Answer 2

你可以试着用黑色画这个特殊的形状，然后你可以在上面写下另一个绿色的形状（小一点）。结果应该如你所料。