8

Estou precisando que um aplicativo efetue desenho sobre um plano de fundo específico, o código está funcionando tudo certinho, porém quando eu vou apagar/corrigir uma linha errada, ele apaga o plano de fundo sendo que o background deve se manter. Porém, ele está apagando a imagem de fundo junto (as linhas).

IMAGEM INICIAL (Antes do Desenho)

Imagem inicial, antes de iniciar o desenho

IMAGEM COM ALGO DESENHADO

Imagem com um desenho já iniciado

APÓS EFETUAR UMA CORREÇÃO NO DESENHO

Imagem após efetuar uma correção no desenho

Código da DrawingView

public class DrawingView extends View implements View.OnTouchListener {

    private Canvas m_Canvas;

    private Path m_Path;

    private Paint m_Paint;

    private ArrayList<Pair<Path, Paint>> paths = new ArrayList<Pair<Path, Paint>>();

    private ArrayList<Pair<Path, Paint>> undonePaths = new ArrayList<Pair<Path, Paint>>();

    private float mX, mY;

    private static final float TOUCH_TOLERANCE = 4;

    private boolean isEraserActive = false;

    public DrawingView(Context context, AttributeSet attr) {
        super(context, attr);

        setFocusable(true);

        setFocusableInTouchMode(true);

        //setBackgroundColor(Color.WHITE);
        //setBackgroundColor(Color.TRANSPARENT);

        this.setOnTouchListener(this);

        onCanvasInitialization();
    }

    public void onCanvasInitialization() {

        m_Paint = new Paint();

        m_Paint.setAntiAlias(true);
        m_Paint.setDither(true);
        m_Paint.setColor(Color.parseColor("#000000"));
        m_Paint.setStyle(Paint.Style.STROKE);
        m_Paint.setStrokeJoin(Paint.Join.ROUND);
        m_Paint.setStrokeCap(Paint.Cap.ROUND);
        m_Paint.setStrokeWidth(3);


        m_Canvas = new Canvas();
        m_Path = new Path();
        Paint newPaint = new Paint(m_Paint);
        paths.add(new Pair<Path, Paint>(m_Path, newPaint));

    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
    }

    public boolean onTouch(View arg0, MotionEvent event) {
        float x = event.getX();
        float y = event.getY();

        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                touch_start(x, y);
                invalidate();
                break;
            case MotionEvent.ACTION_MOVE:
                touch_move(x, y);
                invalidate();
                break;
            case MotionEvent.ACTION_UP:
                touch_up();
                invalidate();
                break;
        }
        return true;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        for (Pair<Path, Paint> p : paths) {
            canvas.drawPath(p.first, p.second);
        }
    }

    private void touch_start(float x, float y) {

        if (isEraserActive) {

            //m_Paint.setColor(Color.WHITE);
            m_Paint.setColor(Color.WHITE);
            //m_Paint.reset();
            m_Paint.setFilterBitmap(true);
            m_Paint.clearShadowLayer();

            m_Paint.setStrokeWidth(20);
            Paint newPaint = new Paint(m_Paint); // Clones the mPaint object
            paths.add(new Pair<Path, Paint>(m_Path, newPaint));

        } else {
            m_Paint.setColor(Color.BLACK);
            m_Paint.setStrokeWidth(3);
            Paint newPaint = new Paint(m_Paint); // Clones the mPaint object
            paths.add(new Pair<Path, Paint>(m_Path, newPaint));

        }


        m_Path.reset();
        m_Path.moveTo(x, y);
        mX = x;
        mY = y;
    }

    private void touch_move(float x, float y) {
        float dx = Math.abs(x - mX);
        float dy = Math.abs(y - mY);
        if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
            m_Path.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
            mX = x;
            mY = y;
        }
    }

    private void touch_up() {
        m_Path.lineTo(mX, mY);

        // commit the path to our offscreen
        m_Canvas.drawPath(m_Path, m_Paint);

        // kill this so we don't double draw
        m_Path = new Path();
        Paint newPaint = new Paint(m_Paint); // Clones the mPaint object
        paths.add(new Pair<Path, Paint>(m_Path, newPaint));
    }

    public void activateEraser()
    {
        m_Paint.setColor(Color.TRANSPARENT);
        isEraserActive = true;
    }


    public void deactivateEraser()
    {
        isEraserActive = false;
    }

    public boolean isEraserActive()
    {
        return isEraserActive;
    }


    public void reset()
    {
        paths.clear();

        invalidate();
    }

}

Observação: Já tentei usar o Color.TRANSPARENT, porém não funciona.

1 Resposta 1

6
+50

Em vez de desenhar as paths directamente no Canvas da View use um outro Canvas associado a um Bitmap e desenhe nele.

No onDraw() desenhe esse Bitmap no canvas da View.

Declare dois novos atributos na classe DrawingView:

public class DrawingView extends View implements View.OnTouchListener {

    //Bitmap e Canvas usados para desenhar.
    private Bitmap strokes;
    private Canvas strokeCanvas;

    private Canvas m_Canvas;
    ........
    ........
    ........
}

Crie-os no método onSizeChanged()

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {

    //Cria o Bitmap e o Canvas onde o desenho será feito
    if (w != oldw || h != oldh) {
        strokes = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
        strokeCanvas = new Canvas(strokes);
    }

    super.onSizeChanged(w, h, oldw, oldh);
}

Altere o método onDraw de forma as paths serem desenhadas nesse Canvas e que desenhe o Bitmap no Canvas da View:

@Override
protected void onDraw(Canvas canvas) {

    for (Pair<Path, Paint> p : paths) {
        //As paths são desenhadas no strokeCanvas
        strokeCanvas.drawPath(p.first, p.second);
    }

    //O Bitmap que tem o desenho é desenhado no canvas da view.
    canvas.drawBitmap(strokes,0,0,null);
} 

Para testes usei este layout:

Main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/btErase"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:text="Erase"
        android:onClick="eraseClicked"/>

    <Button
        android:id="@+id/btDraw"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:text="Draw"
        android:onClick="drawClicked"/>

    <aSua.packageName.DrawingView
        android:id="@+id/drawingView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/fundo" />

</LinearLayout>

Com a seguinte Activity:

public class MainActivity extends Activity {

    DrawingView drawingView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        drawingView = (DrawingView)findViewById(R.id.drawingView);
    }

    public void eraseClicked(View view) {
        drawingView.activateEraser();
    }

    public void drawClicked(View view) {
        drawingView.deactivateEraser();
    }

}

Não tem a ver com isto mas durante os teste notei que faltava acrescentar m_Paint.setXfermode(null); no método deactivateEraser()

public void deactivateEraser()
{
    m_Paint.setXfermode(null);//<===== Faltava isto
    isEraserActive = false;
}
9
  • No caso onde esta o m_Paint.setColor(Color.WHITE) eu mudo ele para m_Paint.setColor(Color.TRANSPARENT) ? 24/07/2015 às 12:50
  • Não. Deixe estar como está.
    – ramaral
    24/07/2015 às 12:52
  • Ele esta m_Paint.setColor(Color.WHITE); ai ele não vai apagar, vai pintar de branco por cima 24/07/2015 às 12:53
  • Falo isso no method touch_start, no primeiro if (caso o usuario esteja apagando) 24/07/2015 às 12:54
  • Eu testei apenas com as alterações que indiquei na resposta e funciona.
    – ramaral
    24/07/2015 às 12:56

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .