Android FingerPaint sample doesn't draw a dot?

Question

Example Fingerpaint in the demo version of android android does not draw a point / point by touching a finger on the screen. In the code, they used Path to draw a line, is there a way to draw a circle or point using a path?

public class MyView extends View { // int bh = originalBitmap.getHeight(); // int bw = originalBitmap.getWidth(); public MyView(Context c, int w, int h) { super(c); mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888); // Bitmap mBitmap = // Bitmap.createScaledBitmap(originalBitmap,200,200,true); mCanvas = new Canvas(mBitmap); mPath = new Path(); mBitmapPaint = new Paint(Paint.DITHER_FLAG); //mBitmapPaint.setColor(Color.YELLOW); //mBitmapPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC)); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); // mBitmap = Bitmap.createBitmap(bw, bh, Bitmap.Config.ARGB_8888); // mCanvas = new Canvas(mBitmap); } @Override protected void onDraw(Canvas canvas) { //canvas.drawColor(customColor); canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint); canvas.drawPath(mPath, mPaint); } // //////************touching evants for painting**************/////// private float mX, mY; private static final float TOUCH_TOLERANCE = 5; private void touch_start(float x, float y) { //mCanvas.drawCircle(x, y, progress+1, mPaint); mPath.reset(); mPath.moveTo(x, y); //mPaint.setStyle(Paint.Style.FILL); //mPath.addCircle(x, y, (float) (progress+0.15), Direction.CW); mCanvas.drawPath(mPath, mPaint); mX = x; mY = y; //mPaint.setStyle(Paint.Style.STROKE); } 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; } } private void touch_up() { mPath.lineTo(mX, mY); // 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; } // end of touch events for image } 

Here is the code that I have to edit in this code to draw a dot / dot on finertouch?

Answer 1

Is there a way to draw a circle or point using a path?

Instead of trying to do this, use the drawPoint(float x, float y, Paint paint) method drawPoint(float x, float y, Paint paint) in the Canvas class.

To use it in an API demo, you will need to change 3 things:

• In MyView enter private boolean mDrawPoint; to distinguish between pressing and slide.
• Set mDrawPoint to true in touch_start() and false in touch_move() if the path is changed (i.e. in the if ).
• In touch_up() check the value of mDrawPoint . If this is false, do what the function did before, and if it is true, then draw a point on the canvas: mCanvas.drawPoint(mX, mY, mPaint);

New version of touch_up() :

 private void touch_up() { if(mDrawPoint == true) { mCanvas.drawPoint(mX, mY, mPaint); } else { mPath.lineTo(mX, mY); // commit the path to our offscreen mCanvas.drawPath(mPath, mPaint); // kill this so we don't double draw mPath.reset(); } } 

when I raise my finger after drawing a line, it automatically draws a point next to it where the line ends. And when I start a new line / curve, the previously drawn line deleted / deleted from the canvas, leaving only the point points that were drawn.

You no longer need to change than in my answer. You probably forgot to implement some of this.

I had the same problem when I tried to solve it and resolved it before posting an answer. This was because you drew two different canvases using the onDraw method, which is lost when your finger rises and the other is mCanvas , where the line is saved in touch_up . This is why touch_up has an if :

If we didn’t move our finger (we just knocked), we will draw a point on mCanvas so that it is still present on the next onDraw ( onDraw draws mCanvas on the canvas, receives as an argument so that the old lines and points drawn on mCanvas are still visible )

If we move the finger, we will save the path that was drawn on the canvas passed to onDraw on mCanvas so that it is still present after you raise your finger.

The problem is that the else part of the touch_up function will never be executed, so that on touch_up dot will be drawn regardless of whether it should, and the path will never be attached to mCanvas and thus disappear the next time onDraw .

This is most likely due to the fact that you set mDrawPoint to true in touch_start() , as I said in step 2. , but forgetting to set mDrawPoint to false in touch_move , as I also said in step 2.

Here is what my touch_move looks like:

 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; mDrawPoint = false; } } 

Answer 2

A very late answer, but it would be easier to use mCanvas.drawPoint(x, y, mPaint); in touch_start.

Answer 3

A simple solution that works for me is to simply add the following code to touch_start() :

 mPath.quadTo(x, y, x + 0.1f, y); 

Answer 4

If you prefer to use your path, save your ACTION_DOWN coordinates and compare them to ACTION_UP. If they are not moved, add a tiny circle to your path.

 path.addCircle(event.getX(), event.getY(), paint.getStrokeWidth()/4f, Path.Direction.CW); 

The advantage of this approach is that it is simple, and the circle does not look completely inappropriate.