僅在位圖畫布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)你應該很好。

這是限制在“圓形”路徑內繪制位圖的示例的鏈接。