仅在位图画布android java的选定区域中绘制路径

Question

所以我目前正在构建儿童着色书应用程序。我想限制绘图区域，所以它只能在选定区域中绘制路径。例如，如果我触摸喇叭，那么绘制区域只是喇叭边框内的空间。目前，我只能在位图中绘制路径（绘制区域不受限制）。

第一张图片：触摸区域。

第二张图：用户只能在蓝色空间内绘制路径。

现在，这是我的 onDraw 代码：

    protected void onDraw(Canvas canvas) {
        canvas.drawBitmap(mBitmapCanvas, 0f, 0f, paintCanvas);
        canvas.drawPath(mPaths, drawPaint);
    }

触摸：

@Override
    public boolean onTouch(View view, MotionEvent motionEvent) {
        float x = motionEvent.getX();
        float y = motionEvent.getY();
        if (isEditable){
            switch (motionEvent.getAction()) {
                case 0:
                    if (paths.isEmpty()) {
                        mBitmap = Bitmap.createBitmap(mBitmapCanvas);
                        paths.add(mBitmap);
                    }
                    mPaths.reset();
                    setColor(ShaderInt);
                    mPaths.moveTo(x, y);
                    mX = x;
                    mY = y;
                    invalidate();
                    break;
                case 1:
                    mPaths.lineTo(mX, mY);
                    mCanvas.drawPath(mPaths, drawPaint);
                    mCanvas.drawPath(mPaths, drawPaint);
                    mBitmap = Bitmap.createBitmap(mBitmapCanvas);
                    paths.add(mBitmap);
                    mPaths.reset();
                    invalidate();
                    break;
                case 2:
                    float abs = Math.abs(x - this.mX);
                    float abs2 = Math.abs(y - this.mY);
                    if (abs >= TOUCH_TOLERANCE || abs2 >= TOUCH_TOLERANCE) {
                        this.mPaths.quadTo(this.mX, this.mY, (this.mX + x) / 2.0f, (this.mY + y) / 2.0f);
                        this.mX = x;
                        this.mY = y;
                    }
                    invalidate();
                    break;
                default:
                    return false;
            }

        } else {
            return false;
        }
        invalidate();
        return true;
    }

有什么方法可以使绘制区域限制在触摸/选定区域？任何帮助将不胜感激，谢谢！

Answer 1

我建议创建一个初始化为喇叭形状的路径，并使用Porter Duff 操作来合成所需的结果。您的用例感兴趣的 Porter Duff 操作可能是 DST_IN。

为了达到您想要的效果，代码非常简单。在您的onDraw(Canvas) 回调中，您要做的第一件事是使用设置了PorterDuffXfermode 的绘制对象绘制您的自定义“喇叭”路径，并将DST_IN 设置为它的模式。所有后续调用都将被屏蔽到您的“喇叭”路径的范围内。接下来，像往常一样在画布上执行自定义绘图逻辑。

要在“喇叭”路径之外进行绘图，只需从绘图对象中移除 Porter Duff xfermode 并像往常一样继续绘图。我建议查看 PortDuff 文档并熟悉绘制代码的顺序，以确保您获得预期的结果，并了解为什么您的最终结果可能与您的预期不同。使用 Porter Duff 合成时，您在源之前绘制目标；一开始可能没有意义。

如果您手动处理绘制背景图像（山羊），您可能需要特别注意确保它已完全绘制，而不仅仅是包含在“牛角”路径中的部分。如果你让 View 框架绘制背景，即使用 set setBackround(Drawable) 你应该很好。

这是一个link 示例，用于限制在“圆形”路径内绘制位图。