Android Studio | Java --- Draw a Bitmap with fingers

Question

For a little project I have to write an Android application for drawing a line on the screen with fingers. At the moment I use this piece of code

´
public class MainActivity extends Activity {

   DrawingView dv ;   
   private Paint       mPaint;


   @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    dv = new DrawingView(this);
    setContentView(dv);
    mPaint = new Paint();
    mPaint.setAntiAlias(true);
    mPaint.setDither(true);
    mPaint.setColor(Color.GREEN);
    mPaint.setStyle(Paint.Style.STROKE);
    mPaint.setStrokeJoin(Paint.Join.ROUND);
    mPaint.setStrokeCap(Paint.Cap.ROUND);
    mPaint.setStrokeWidth(12);  
}

 public class DrawingView extends View {

    public int width;
    public  int height;
    private Bitmap  mBitmap;
    private Canvas  mCanvas;
    private Path    mPath;
    private Paint   mBitmapPaint;
    Context context;
    private Paint circlePaint;
    private Path circlePath;

    public DrawingView(Context c) {
    super(c);
    context=c;
    mPath = new Path();
    mBitmapPaint = new Paint(Paint.DITHER_FLAG);  
    circlePaint = new Paint();
    circlePath = new Path();
    circlePaint.setAntiAlias(true);
    circlePaint.setColor(Color.BLUE);
    circlePaint.setStyle(Paint.Style.STROKE);
    circlePaint.setStrokeJoin(Paint.Join.MITER);
    circlePaint.setStrokeWidth(4f); 


    }

    @Override
     protected 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);
    mCanvas = new Canvas(mBitmap);

    }
    @Override
    protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    canvas.drawBitmap( mBitmap, 0, 0, mBitmapPaint);

    canvas.drawPath( mPath,  mPaint);

    canvas.drawPath( circlePath,  circlePaint);
    }

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

    private void touch_start(float x, float y) {
    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;

        circlePath.reset();
        circlePath.addCircle(mX, mY, 30, Path.Direction.CW);
    }
    }
    private void touch_up() {
    mPath.lineTo(mX, mY);
    circlePath.reset();
    // commit the path to our offscreen
    mCanvas.drawPath(mPath,  mPaint);
    // kill this so we don't double draw
    mPath.reset();
    }

    @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;
    }  
    }

}

With this I'm able to draw a line on my screen but I have no Idea how convert the painted line to a bitmap. I think I understand it wrong but I think "mBitmap" is only an empty Bitmap and the "picture" is saved in "mCanvas".

So is there any way to convert the painted line in a Bitmap?

Have a look at this: http://stackoverflow.com/questions/2801116/converting-a-view-to-bitmap-without-displaying-it-in-android — Erdinc Ay, Nov 07 '15 at 17:54

score 0 · Answer 1 · answered Nov 09 '15 at 09:53

You need not create mBitmap or mCanvas for this. You could simply call View.getDrawingCache() to get the contents of the View. More info here.

But if you are planning to draw in your own bitmap, then you need to have a mBitmap and mCanvas. Follow the steps below to accomplish this:

Move the below lines into the constructor, since you want the bitmap and canvas creation only once.
```
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
```

In your onDraw() method, use the mCanvas to draw and not the canvas. Finally draw the mBitmap on to the view's canvas. Something like below:

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    // This will use the mCanvas and draw the `path` in the mBitmap.
    mCanvas.drawPath( mPath,  mPaint);
    mCanvas.drawPath( circlePath,  circlePaint);

    // Now once everything is drawn on mBitmap, we will draw the contents of this mBitmap onto the underlying bitmap of the View via `canvas`.
    canvas.drawBitmap( mBitmap, 0, 0, mBitmapPaint);
}

Always remember, every view will have an underlying bitmap (shared across). The canvas that you get in the onDraw() will help you draw stuff in the underlying bitmap. If you want to draw in your own bitmap, then you need to create a bitmap and a canvas, and draw using the canvas you created and not the one provided to you in the onDraw().

Android Studio | Java --- Draw a Bitmap with fingers

1 Answers1