Реализация ластика в приложении для рисования Android - черный след, а затем прозрачный

Question

У меня есть приложение для рисования для Android, и я сейчас пытаюсь добавить в него настоящий ластик. Раньше я только использовал белую краску для ластика, но это больше не будет работать, так как теперь я разрешаю цвета фона и изображения. Я делаю это, имея изображение под прозрачным холстом.

Проблема, с которой я сталкиваюсь, заключается в том, что всякий раз, когда я активирую свой ластик, он рисует сплошную черную дорожку, пока мой палец опущен, но когда я отпускаю, он становится прозрачным. Смотрите скриншоты ниже:

Вот так выглядит мой палец на экране - сплошная чёрная дорожка

Вот как это выглядит, когда я убираю палец с экрана

Таким образом, кажется, что я приближаюсь, но я не могу найти правильную комбинацию настроек, чтобы избежать черного следа, когда мой палец соприкасается во время стирания. Вот некоторые соответствующие фрагменты кода:

OnDraw

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawColor(Color.TRANSPARENT);
    canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
    canvas.drawPath(mPath, mPaint);
    canvas.drawPath(mPreviewPath, mPaint);
}

onTouchEvent

@Override
public boolean onTouchEvent(MotionEvent event) {
    float currentX = event.getX();
    float currentY = event.getY();

    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            touchStart(currentX, currentY);
            invalidate();
            break;
        case MotionEvent.ACTION_MOVE:
            touchMove(currentX, currentY);
            invalidate();
            break;
        case MotionEvent.ACTION_UP:
            touchUp(currentX, currentY);
            invalidate();
            break;
    }
    return true;
}

Текущая попытка настройки ластика

public void startEraser() {
    mPaint.setAlpha(0);
    mColor = Color.TRANSPARENT;
    mPaint.setColor(Color.TRANSPARENT);
    mPaint.setStrokeWidth(mBrushSize);
    mPaint.setStyle(Paint.Style.STROKE);
    mPaint.setMaskFilter(null);
    mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
    mPaint.setAntiAlias(true);
}

Есть несколько других сообщений о ластиках, но большинство из них просто говорят, чтобы использовать PorterDuff.Mode.CLEAR, setMakFilter(null) и что это должно работать. В моем случае это не так. Независимо от того, что я пытаюсь, сначала я получаю черный след, а затем желаемый результат только после выпуска.

Я могу предоставить больше кода, если это необходимо.

Answer 1

Я мог бы предложить вам прочитать официальный образец FingerPaint.java
Это точно соответствует тому, что вы пытаетесь достичь здесь.

Чтобы не отображать след при удалении содержимого, посмотрите на onDraw() метод и eraserMode переменная:

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawColor(0xFFAAAAAA);
    canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
    if (!eraserMode) {
        canvas.drawPath(mPath, mPaint);
    }
}

boolean eraserMode = false;

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    eraserMode = false;
    mPaint.setXfermode(null);
    mPaint.setAlpha(0xFF);
    switch (item.getItemId()) {
        /*...*/
        case ERASE_MENU_ID:
            // Add this line
            eraserMode = true;
            mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
            return true;
        /*...*/
    }
    return super.onOptionsItemSelected(item);
}

Answer 2

Люди все еще ищут более короткий способ удалить эту черную линию во время стирания. Просто добавьsetLayerType(View.LAYER_TYPE_SOFTWARE, drawPaint); эта строка для конструктора и здесь вы идете. Ура!

Answer 3

Ни один из вышеперечисленных ответов у меня не сработал. После некоторой попытки, а также логики, решившей это, проверьте ACTION_MOVE

@Override
public boolean onTouchEvent(MotionEvent event) {

    float touchX = event.getX();
    float touchY = event.getY();

    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            isEdited = true;
            drawPath.moveTo(touchX, touchY);
            break;
        case MotionEvent.ACTION_MOVE:
            if(isEraser) {
                drawPath.lineTo(touchX, touchY);
                drawCanvas.drawPath(drawPath, drawPaint);
                drawPath.reset();
                drawPath.moveTo(touchX, touchY);
            } else {
                drawPath.lineTo(touchX, touchY);
            }
            break;
        case MotionEvent.ACTION_UP:
            drawCanvas.drawPath(drawPath, drawPaint);
            drawPath.reset();
            break;
        default:
            return false;
    }

    invalidate();
    return true;
}

и это

public void setEraser(boolean isEraser) {
    this.isEraser = isEraser;
    if (isEraser) {
        drawPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
    } else {
        drawPaint.setXfermode(null);
    }
}

Answer 4

Можете ли вы прокомментировать строку canvas.drawPath(mPreviewPath, mPaint) и посмотреть, работает ли она:

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawColor(Color.TRANSPARENT);
    canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
    canvas.drawPath(mPath, mPaint);
    //canvas.drawPath(mPreviewPath, mPaint);
}

Answer 5

Когда вы хотите сделать ластик, установите цвет рисования такой же, как цвет холста, не прозрачный в реальной жизни. в андроиде мы устанавливаем цвет краски как цвет темы холста, в основном белый или черный.

mColor = Color.BLACK;
mPaint.setColor(Color.BLACK);
mPaint.setStrokeWidth(mBrushSize);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setAntiAlias(true);