How to move a Path on a Canvas in Android?

Question

I am trying to make an Android paint application for finger painting and I am having trouble with moving the lines I draw.

What I tried to do was offset the path of the currently selected line by the difference between the initial finger press coordinates and the current coordinates in OnTouchEvent during ACTION_MOVE.

case MotionEvent.ACTION_MOVE:
selectline.getLine().offset(x - otherx, y - othery);

otherx and othery are set as the x and y coordinates during ACTION_MOVE and x and y are the current cursor coordinates. My lines are stored as a separate class containing the path, color, thickness and bounding box.

What I got was the shape flying off the screen in the direction of my finger without stopping at the slightest movement. I tried using a matrix to move the path, but the result was the same.

When I tried to insert a "do while" that would check whether the current coordinates would match the path's .computeBounds() rectangle center, but the program crashes as soon as I move my finger.

Any help would be appreciated, thanks.

score 0 · Answer 1 · edited May 23 '17 at 12:14

0

Most likely that you did not use the right scale for the coordinates.

Source: Get Canvas coordinates after scaling up/down or dragging in android

float px = ev.getX() / mScaleFactor + rect.left;
float py = ev.getY() / mScaleFactor + rect.top;
// where mScaleFactor is the scale use in canvas and rect.left and rect.top is the coordinate of top and left boundary of canvas respectively

edited May 23 '17 at 12:14

Community

1
1

answered Nov 15 '14 at 05:00

user3806339

144
1
2

Thanks for the reply, but the coordinates seem to be fine. I added "selectline.getLine().offset(x - otherx, y - othery)" to ACTION_UP, and the shape moved to exactly where I wanted it. My problem is that I want it to follow my finger in real time during ACTION_MOVE. – Vodyara Nov 15 '14 at 12:52
You may not have set the coordinates correctly during ACTION_DOWN. Here is the link for similar problem: http://stackoverflow.com/questions/9398057/android-move-a-view-on-touch-move-action-move – user3806339 Nov 15 '14 at 20:33

score 0 · Answer 2 · answered Jun 10 '15 at 08:03

Its a bit late but it may solve others problem. I solved this issue like this, get initial X,Y position on onLongPress

public void onLongPress(MotionEvent motionEvent) {

        try {
            shapeDrag = true;
            SmEventX = getReletiveX(motionEvent);
            SmEventY = getReletiveY(motionEvent);
        } catch (Exception e) {
            e.printStackTrace();
        }

and then on onToucn(MotionEvent event)

case MotionEvent.ACTION_MOVE: {
                    actionMoveEvent(motionEvent);
                    try {

                        if (shapeDrag) {
                            StylePath sp = alStylePaths
                                    .get(alStylePaths.size() - 1);
                            Path mpath = sp.getPath();


                            float tempX = getReletiveX(motionEvent) - SmEventX;
                            float tempY = getReletiveY(motionEvent) - SmEventY;

                            mpath.offset(tempX, tempY);
                            SmEventX = getReletiveX(motionEvent);
                            SmEventY = getReletiveY(motionEvent);


                        }
                    } catch (Exception e) {
                        e.printStackTrace();
                    }

                    break;
                }
    }

score 0 · Answer 3 · answered Aug 31 '18 at 08:32

I faced the same trouble and in my case it was a very naive mistake. Since the description of the "symptoms" matches exactly (shape flying off the screen in the direction of the finger at the slightest movement, shape moved correctly at ACTION_UP event), I think the reason behind might be the same.

Basically the problem is in the update of the touch position coordinates within the ACTION_MOVE event. If you don't update the last touch position, the calculated distance will be always between the current touch position and the first touch position stored at ACTION_DOWN event: if you apply this offset consecutively to the path, the translation will sum up and consequently the shape will "fly" rapidly off the screen.

The solution is then quite simple: just update the last touch position at the end of the ACTION_MOVE event:

float mLastTouchX, mLastTouchY;

@Override
public boolean onTouchEvent(MotionEvent ev) {

    final int action = ev.getAction();

    switch (action) {
        case MotionEvent.ACTION_DOWN: {
            // get touch position
            final float x = ev.getX();
            final float y = ev.getY();

            // save the initial touch position
            mLastTouchX = x;
            mLastTouchY = y;

            break;
        }

        case MotionEvent.ACTION_MOVE: {
            // get touch position
            final float x = ev.getX();
            final float y = ev.getY();

            // calculate the distance moved
            final float dx = x - mLastTouchX;
            final float dy = y - mLastTouchY;

            // here apply translation to the path

            // update touch position for the next move event
            mLastTouchX = x;
            mLastTouchY = y;

            break;
        }
    }
    return true;
}

Hope this helps.

How to move a Path on a Canvas in Android?

3 Answers3