Android: the paint application with the gum does not work

advertisements

I am working on a painting app, with undo/redo function and would like to add eraser function.

Code for MainActivity

case R.id.undoBtn:
     doodleView.onClickUndo();
     break;

case R.id.redoBtn:
     doodleView.onClickRedo();
     break;

case R.id.eraserBtn:
     Constants.mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT)); break;

DrawView

// Drawing Part
    private Bitmap mBitmap;
    private Paint  mBitmapPaint;
    private Canvas mCanvas;
    private Path   mPath;
    private int selectedColor = Color.BLACK;
    private int selectedWidth = 5;

    private ArrayList<Path> paths = new ArrayList<Path>();
    private ArrayList<Path> undonePaths = new ArrayList<Path>();
    private Map<Path, Integer> colorsMap = new HashMap<Path, Integer>();
    private Map<Path, Integer> widthMap = new HashMap<Path, Integer>();

    private float mX, mY;
    private static final float TOUCH_TOLERANCE = 4;
    Context context_new;

   public DoodleView(Context c, AttributeSet attrs)
   {
       super(c, attrs);
       context_new = c;
       setFocusable(true);
       setFocusableInTouchMode(true);
       setLayerType(View.LAYER_TYPE_SOFTWARE, null); // for solely removing the black eraser

       mPath = new Path();
       mCanvas = new Canvas();
       mBitmapPaint = new Paint(Paint.DITHER_FLAG);   

       Constants.mPaint = new Paint();
       Constants.mPaint.setAntiAlias(true); // smooth edges of drawn line
       Constants.mPaint.setDither(true);
       Constants.mPaint.setColor(Color.BLACK); // default color is black
       Constants.mPaint.setStyle(Paint.Style.STROKE); // solid line
       Constants.mPaint.setStrokeJoin(Paint.Join.ROUND);
       Constants.mPaint.setStrokeWidth(20); // set the default line width
       Constants.mPaint.setStrokeCap(Paint.Cap.ROUND); // rounded line ends
       Constants.mPaint.setXfermode(null);
       Constants.mPaint.setAlpha(0xFF);
   } 

   @Override
   public void onSizeChanged(int w, int h, int oldW, int oldH)
   {
       super.onSizeChanged(w, h, oldW, oldH);
       mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);

      Constants.DRAW_W = w;
      Constants.DRAW_H = h;
      Log.d("TAG", "onSizeChanged!!!" + Constants.DRAW_W + Constants.DRAW_H + Constants.SCREEN_W + Constants.SCREEN_H);
      // bitmap.eraseColor(Color.WHITE); // erase the BitMap with white
   }   

   @Override
   protected void onDraw(Canvas canvas)
   {
       canvas.drawBitmap(mBitmap, 0, 0, null); // draw the background screen

       for (Path p : paths)
       {
           Constants.mPaint.setColor(colorsMap.get(p));
           Constants.mPaint.setStrokeWidth(widthMap.get(p));
           canvas.drawPath(p, Constants.mPaint);
       }
       Constants.mPaint.setColor(selectedColor);
       Constants.mPaint.setStrokeWidth(selectedWidth);
       canvas.drawPath(mPath, Constants.mPaint);
   } 

   @Override
   public boolean onTouchEvent(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;
    }

   private void touch_start(float x, float y)
   {
       undonePaths.clear();
       mPath.reset();
       mPath.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)
       {
           mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
           mX = x;
           mY = y;

           startdrawing = true;
       }
   }

   private void touch_up()
   {
       mPath.lineTo(mX, mY);
       mCanvas.drawPath(mPath, Constants.mPaint);
       paths.add(mPath);
       colorsMap.put(mPath,selectedColor);
       widthMap.put(mPath,selectedWidth);
       mPath = new Path();
   }

   public void onClickUndo()
   {
       if (paths.size()>0)
        {
           undonePaths.add(paths.remove(paths.size()-1));
           invalidate();
        }
       else Toast.makeText(getContext(), R.string.toast_nothing_to_undo, Toast.LENGTH_SHORT).show();
    }

   public void onClickRedo()
   {
       if (undonePaths.size()>0)
       {
           paths.add(undonePaths.remove(undonePaths.size()-1));
           invalidate();
       }
       else
           Toast.makeText(getContext(), R.string.toast_nothing_to_redo, Toast.LENGTH_SHORT).show();
    }  

   public void setDrawingColor(int color)
   {
       selectedColor = color;
       Constants.mPaint.setColor(color);
   } 

   public int getDrawingColor()
   {
      return Constants.mPaint.getColor();
   }

Question:

Normal painting and undo / redo can be performed perfectly. However, the eraser does not work.

  1. After pressing (touch_start) the eraser button and touch the screen, all the previous drawn line immediately turn black.

  2. When using the eraser upon touch_move , the eraser itself is drawing black lines, even though it was on CLEAR mode.

  3. Upon touch_up, All other drawn lines maintained at black color. The "erased" area was also in black color. However, when drawing a new path subsequently, the original line turned to their original color, the area "erased" by the eraser turn its color to the last color chosen and the paths retained in the View.

How could the code on eraser be written in a proper way? (keeping undo / redo)

Thanks a lot in advance!


It's hard to answer your question, but. I'd implement the erase functionality as follows:

The erase function will by simple white path. So the erase mode means that you are drawing white path which will be wider than the drawing path. This way you will be able to select even the width of the eraser and the undo/redo functionality will stay the same.