How to draw a circle and move it / drag it on touch in Android

Question

In my app I need to draw a circle and user can drag it anywhere on the screen .

To do this I have created a view, Drawn the circle in onDraw method. I tried to track the movements using onTouchEvent. But the circle is not really moving when I try to drag it rather its creating a new Circle wherever I touch the screen.

Please someone help me on this what im missing.

here's my code

public class Circle extends View {

Paint paint, paintSmall;
private Point start = null;
private Point cursorAtMouseDown = null;
private Point startAtMouseDown = null;
private Point endAtMouseDown = null;
private boolean movingStart = false;
private boolean movingEnd = false;
private boolean movingLine = false;

public Circle(Context context) {
    super(context);
    init();
}

public Circle(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

public Circle(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init();
}

private void init() {
    paint = new Paint();
    start = new Point(100, 100);
    paint.setColor(Color.BLUE);
    paint.setStrokeWidth(10);
    paint.setStyle(Paint.Style.STROKE);

}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStyle(Paint.Style.STROKE);
    canvas.drawCircle(start.x, start.y, 80, paint);

    canvas.drawCircle(start.x, start.y, 10, paint);

}

@Override
public boolean onTouchEvent(MotionEvent event) {

    Log.d("Inside On Touch", "");
    switch (event.getAction()) {
    case MotionEvent.ACTION_UP:

        if (movingStart || movingEnd || movingLine) {
            invalidate();
        }

        movingStart = false;
        movingEnd = false;
        movingLine = false;
        break;
    case MotionEvent.ACTION_OUTSIDE:
        if (movingStart || movingEnd || movingLine) {
            invalidate();
        }

        movingStart = false;
        movingEnd = false;
        movingLine = false;
        break;
    case MotionEvent.ACTION_MOVE:

        Log.d("Inside On Touch", "ACTION_MOVE");

        if (movingStart) {
            start.x = (int) event.getX();
            start.y = (int) event.getY();
            invalidate();
            Log.d("Inside On Touch", "--movingStart=" + movingStart);
            return true;
        } else if (movingEnd) {
            start.x = (int) event.getX();
            start.y = (int) event.getY();
            invalidate();
            Log.d("Inside On Touch", "--movingEnd=" + movingEnd);
            return true;
        } else if (movingLine) {
            Log.d("Inside On Touch", "--movingLine=" + movingLine);
            if (cursorAtMouseDown != null) {
                // double diffX = event.getX() - cursorAtMouseDown.x;
                // double diffY = event.getY() - cursorAtMouseDown.y;
                // start.x = (int) (startAtMouseDown.x + diffX);
                // start.y = (int) (startAtMouseDown.y + diffY);

                start = cursorAtMouseDown;

                invalidate();
                return true;
            }

        }
        return false;

    case MotionEvent.ACTION_DOWN:
        cursorAtMouseDown = new Point((int) event.getX(),
                (int) event.getY());

        if (cursorAtMouseDown.equals(start)) {

        }

        if (isCircleCenterChaged(cursorAtMouseDown)) {
            movingLine = true;
        }

        return true;

    default:
        return super.onTouchEvent(event);

    }
    return false;
}


}

Answer 1

I m not sure but if you mannage below variable then it can solve your problem:

private Point cursorAtMouseDown = null; 
private Point startAtMouseDown = null; 
private Point endAtMouseDown = null; 
private boolean movingStart = false; 
private boolean movingEnd = false; 
private boolean movingLine = false; 

Please manage boolean variable and mouse movement.