Android canvas - draw arc between points and remove arc from path

In my Android application, I want to provide a trace function as shown in the following image:

enter image description here

Here I want to provide a tracing of the letter-D, and for that I need to draw an arc between two points when the user starts to move his finger along the arc. Here, if the user starts moving the finger from the start point and stops at the end point, then only he has to draw an arc between these points. And he should also show an arc by moving his finger along the arc. I wrote the code below for this. The problem I'm running into is that when the event is ACTION_UP

triggered on the arc path, it still shows the arc being drawn on the canvas. But I want to remove this drawing from path if it fires an event ACTION_UP

between arc paths.

Here is my code:

public class DrawView extends View implements OnTouchListener {

List<Point> pointsD = new ArrayList<Point>();
pointsD.add(new Point(520, 70));
    pointsD.add(new Point(520, 335));
    pointsD.add(new Point(520, 70));
    pointsD.add(new Point(520, 335));

public boolean onTouch(View view, 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(x, y);
        invalidate();
        break;
    default:
        break;
    }
    return true;
}
private void touch_start(float x, float y) {
      if (checkPoint(x, y, mLastPointIndex)) {
                mPath.reset();
            isPathStarted = true;
          } else {
            isPathStarted = false;
      }
}

private void touch_move(float x, float y) {

    if (isPathStarted) {
        mPath.reset();
        Point p = null;
         p = pointsD.get(mLastPointIndex);
        mPath.moveTo(p.x, p.y);
            float radius = 1;
        RectF oval = new RectF();
        oval.set(scalePointX((int) (486 - radius)),scalePointY(70),                               scalePointX((int) (686 + radius)),
                        scalePointY((int) (334 + radius)));
        if (sweepAngelD <= 180 && startAngleD <= 360) {
            mPath.arcTo(oval, startAngleD, sweepAngelD, true);
        sweepAngelD += 1;
        startAngleD += 2;
        mCanvas.drawPath(mPath, mPaint);
    }
    mPath.reset();
}

private void touch_up(float x, float y) {
       mPath.reset();
            if (isPathStarted) {
                float radius = 1;
                RectF oval = new RectF();
                oval.set(scalePointX((int) (486 - radius)),
                        scalePointY(70), scalePointX((int) (686 + radius)),
                        scalePointY((int) (334 + radius)));
                Point p = pointsD.get(mLastPointIndex);
                mPath.moveTo(p.x, p.y);
                mPath.arcTo(oval, startAngleD, sweepAngelD, true);                  
                mCanvas.drawPath(mPath, mPaint);
                mPath.reset();
                ++mLastPointIndex;
            } else {
                sweepAngelD = 1;
                startAngleD = 270;
                mPath.reset();
             }
            isPathStarted = false;
 }

private boolean checkPoint(float x, float y, int pointIndex){
if (pointIndex == pointsD.size()) {
            // out of bounds
            return false;
        }
        point = pointsD.get(pointIndex);
        // EDIT changed point.y to poin.x in the first if statement
        if (x > (point.x - TOUCH_TOLERANCE)
                && x < (point.x + TOUCH_TOLERANCE)) {
            if (y > (point.y - TOUCH_TOLERANCE)
                    && y < (point.y + TOUCH_TOLERANCE)) {
                return true;
            }
        }
    return false;
}
}

      

+3


source to share


1 answer


I edited my code as shown below and now it works.



    public class DrawView extends View implements OnTouchListener {

List<Point> pointsD = new ArrayList<Point>();
pointsD.add(new Point(520, 70));
    pointsD.add(new Point(520, 335));
    pointsD.add(new Point(520, 70));
    pointsD.add(new Point(520, 335));

public boolean onTouch(View view, 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(x, y);
        invalidate();
        break;
    default:
        break;
    }
    return true;
}
private void touch_start(float x, float y) {
      if (checkPoint(x, y, mLastPointIndex)) {
                mPath.reset();
            isPathStarted = true;
          } else {
            isPathStarted = false;
      }
}

private void touch_move(float x, float y) {

    if (isPathStarted) {
        mPath.reset();
        Point p = null;
         p = pointsD.get(mLastPointIndex);
        mPath.moveTo(p.x, p.y);
            float radius = 1;
        RectF oval = new RectF();
        oval.set(scalePointX((int) (486 - radius)),scalePointY(70),                               scalePointX((int) (686 + radius)),
                        scalePointY((int) (334 + radius)));
        if (sweepAngelD <= 180 && startAngleD <= 360) {
            mPath.arcTo(oval, startAngleD, sweepAngelD, true);
        sweepAngelD += 1;
        startAngleD += 2;

    }
    mPath.reset();
}

private void touch_up(float x, float y) {
       mPath.reset();
            if (isPathStarted) {
                float radius = 1;
                RectF oval = new RectF();
                oval.set(scalePointX((int) (486 - radius)),
                        scalePointY(70), scalePointX((int) (686 + radius)),
                        scalePointY((int) (334 + radius)));
                Point p = pointsD.get(mLastPointIndex);
                mPath.moveTo(p.x, p.y);
                mPath.arcTo(oval, startAngleD, sweepAngelD, true);                  
                mCanvas.drawPath(mPath, mPaint);
                mPath.reset();
                ++mLastPointIndex;
            } else {
                sweepAngelD = 1;
                startAngleD = 270;
                mPath.reset();
             }
            isPathStarted = false;
 }

private boolean checkPoint(float x, float y, int pointIndex){
if (pointIndex == pointsD.size()) {
            // out of bounds
            return false;
        }
        point = pointsD.get(pointIndex);
        // EDIT changed point.y to poin.x in the first if statement
        if (x > (point.x - TOUCH_TOLERANCE)
                && x < (point.x + TOUCH_TOLERANCE)) {
            if (y > (point.y - TOUCH_TOLERANCE)
                    && y < (point.y + TOUCH_TOLERANCE)) {
                return true;
            }
        }
    return false;
}
}

      

+3


source







All Articles