Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

android drag and drop ImageView onTouchListener

Hello
I've set up an onTouchListener within my application for an ImageView, my aim was to have an ImageView that the user would be able to drag around and place where ever they want within the app.

I've written some code using sample code found on the web for an onTouchListener that I thought would work but I'm having some problems with it, rather than allowing me to drag the image around, the image resizes and gets bigger or smaller when you drag your finger over it.

Does anyone have any ideas why?
Here's my code:

    ImageView t1img;

    t1img = (ImageView) findViewById(R.id.imgT1);

    windowWidth = getWindowManager().getDefaultDisplay().getWidth();
    windowHeight = getWindowManager().getDefaultDisplay().getHeight();

    t1img.setOnTouchListener(new View.OnTouchListener() {

        @Override
        public boolean onTouch(View v, MotionEvent event) {

            layoutParams = (LayoutParams) t1img.getLayoutParams();

            switch (event.getAction()) {

                case MotionEvent.ACTION_DOWN:

                break;

                case MotionEvent.ACTION_MOVE:

                    int xCoord = (int) event.getRawX();
                    int yCoord = (int) event.getRawY();

                    if (xCoord > windowWidth) {

                        xCoord = windowWidth;
                    }

                    if (yCoord > windowHeight) {

                        yCoord = windowHeight;
                    }

                    layoutParams.leftMargin = xCoord - 25;
                    layoutParams.topMargin = yCoord - 75;

                    t1img.setLayoutParams(layoutParams);

                break;

                default:

                break;
            }

            return true;
        }
    });
like image 446
Paul Alexander Avatar asked Jan 11 '23 02:01

Paul Alexander


1 Answers

If you need to support gingerbread you can take a look at my example here

https://github.com/NAYOSO/android-dragview

if you only need to support jelly bean above you can use the Drag and Drop from android library you can see it from this article

http://developer.android.com/guide/topics/ui/drag-drop.html

For some explanation about the Drag and Drop view at first you need t create the touch listener and then call startDrag to start draging. As simple as that.

private final class dragTouchListener implements OnTouchListener {

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if (event.getAction() == MotionEvent.ACTION_DOWN) {
                DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(v);
                v.startDrag(data, shadowBuilder, v, 0);
                return true;
            } else {
                return false;
            }
        }

    }

To monitor the target of dropping place you can use onDragListener

private class dropListener implements OnDragListener {

    View draggedView;
    CustomTextView dropped;

    @Override
    public boolean onDrag(View v, DragEvent event) {
        switch (event.getAction()) {
        case DragEvent.ACTION_DRAG_STARTED:
            draggedView = (View) event.getLocalState();
            dropped = (CustomTextView) draggedView;
            draggedView.setVisibility(View.INVISIBLE);
            break;
        case DragEvent.ACTION_DRAG_ENTERED:
            break;
        case DragEvent.ACTION_DRAG_EXITED:
            break;
        case DragEvent.ACTION_DROP:

            CustomTextView dropTarget = (CustomTextView) v;
            dropTarget.setText(dropped.getText().toString());
            break;
        case DragEvent.ACTION_DRAG_ENDED:
            break;
        default:
            break;
        }
        return true;
    }

}

As you can see from my code there is many event but the main one is when the view is start being dragged, dropped and ended.

Don't forget to set the listener to view

    tvDrag.setOnTouchListener(new dragTouchListener());
    tvDrop.setOnDragListener(new dropListener())

I hope my explanation is clear enough! If you have further question I will try to answer it tonight or tomorrow :)

like image 152
Niko Adrianus Yuwono Avatar answered Jan 12 '23 15:01

Niko Adrianus Yuwono