Android Drag and drop images on the Screen?

Question

I m working on project user to move the image in one position to Another position on the screen. I have written a sample code to move the image but the problem here is if I

Answer 1

That's because you have put everything in a LinearLayout, which means you can't place the items where you want them, they are always one after the other. You can try to use a RelativeLayout instead. If that is not flexible enough, you should look at Canvas.

Answer 2

I took the liberty of alternating your code to manage multiple imageviews in a RelativeLayout and random places. Also I added a better way of getting the window size, since Display.getHeight() is deprecated.

    if(Build.VERSION.SDK_INT >= 13){
        android.graphics.Point p = new android.graphics.Point();
        this.getWindowManager().getDefaultDisplay().getSize(p); 
        width = p.x;
        height = p.y;
    }
    else{
        Display display = getWindowManager().getDefaultDisplay();
        width = display.getWidth();
        height = display.getHeight();
    }

    RelativeLayout rel = new RelativeLayout(this);
    rel.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)); 
    rel.setBackgroundResource(R.drawable.bg);

    pic = new ImageView[10];
    layoutParams1 = new LayoutParams[10];

    for(int i = 0; i < 10; i++){
        pic[i] = new ImageView(this);
        pic[i].setImageResource(R.drawable.img);  
        pic[i].setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));  
        pic[i].setAdjustViewBounds(true);  
        pic[i].setScaleType(ScaleType.FIT_XY);  
        pic[i].setMaxHeight(88);  
        pic[i].setMaxWidth(100);
        pic[i].setMinimumHeight(88);
        pic[i].setMinimumWidth(100);
        pic[i].setTag(i);
        int x = rand.nextInt(width);
        while(x > width - 88){
            x = rand.nextInt(width);
        }
        int y = rand.nextInt(height);
        while(y > height - 100){
            y = rand.nextInt(height);
        }
        layoutParams1[i] = (RelativeLayout.LayoutParams) pic[i].getLayoutParams();
        layoutParams1[i].leftMargin = x;
        layoutParams1[i].topMargin = y;
        pic[i].setLayoutParams(layoutParams1[i]);
        pic[i].setOnTouchListener(new View.OnTouchListener() {         

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                int index = Integer.valueOf(v.getTag().toString());
                layoutParams1[index] = (RelativeLayout.LayoutParams) v.getLayoutParams();
                switch(event.getActionMasked())
                {
                    case MotionEvent.ACTION_DOWN:
                        break;
                    case MotionEvent.ACTION_MOVE:
                        int x_cord = (int) event.getRawX();
                        int y_cord = (int) event.getRawY();
                        if (x_cord > width) {
                            x_cord = width;
                        }
                        if (y_cord > height) {
                            y_cord = height;
                        }
                        layoutParams1[index].leftMargin = x_cord - 44;
                        layoutParams1[index].topMargin = y_cord - 50;
                        pic[index].setLayoutParams(layoutParams1[index]);
                        break;
                    default:
                        break;
                }
                return true;
            }
        });

        rel.addView(pic[i]);
    }


    setContentView(rel);

Answer 3

the reason is that: your screen upload action_move too lazily.

in normal case , action move is uploading very frequently even if your finger don't move on the screen. but some phone screens are not so sensitive.

you can modify the threshold of your phone. It needs kernel support.

Answer 4

Write Below Code into your Activity File.

windowwidth = getWindowManager().getDefaultDisplay().getWidth();
windowheight = getWindowManager().getDefaultDisplay().getHeight();


tv1 = (ImageView)findViewById(R.id.image);
tv1.setOnTouchListener(new View.OnTouchListener() {         

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        layoutParams1 = (RelativeLayout.LayoutParams) tv1.getLayoutParams();
        switch(event.getActionMasked())
        {
            case MotionEvent.ACTION_DOWN:
                break;
            case MotionEvent.ACTION_MOVE:
                int x_cord = (int) event.getRawX();
                int y_cord = (int) event.getRawY();
                if (x_cord > windowwidth) {
                    x_cord = windowwidth;
                }
                if (y_cord > windowheight) {
                    y_cord = windowheight;
                }
                layoutParams1.leftMargin = x_cord - 25;
                layoutParams1.topMargin = y_cord - 75;
                tv1.setLayoutParams(layoutParams1);
                break;
            default:
                break;
        }
        return true;
    }
});

tv2 = (ImageView)findViewById(R.id.image1);
tv2.setOnTouchListener(new View.OnTouchListener() {         

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        layoutParams2 = (RelativeLayout.LayoutParams) tv2.getLayoutParams();
        switch(event.getActionMasked())
        {
            case MotionEvent.ACTION_DOWN:
                break;
            case MotionEvent.ACTION_MOVE:
                int x_cord = (int) event.getRawX();
                int y_cord = (int) event.getRawY();
                if (x_cord > windowwidth) {
                    x_cord = windowwidth;
                }
                if (y_cord > windowheight) {
                    y_cord = windowheight;
                }
                layoutParams2.leftMargin = x_cord - 25;
                layoutParams2.topMargin = y_cord - 75;
                tv2.setLayoutParams(layoutParams2);
                break;
            default:
                break;
        }
        return true;
    }
});

XML File:-

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <ImageView android:layout_width="50sp" android:layout_height="50sp"
        android:id="@+id/image" android:src="@drawable/image">
    </ImageView>
    <ImageView android:layout_y="30dip" android:layout_x="118dip"
        android:layout_width="50sp" android:layout_height="50sp" android:id="@+id/image1"
        android:src="@drawable/image1">
    </ImageView>
</RelativeLayout>

Answer 5

Actually you can avoid this problem by declaring the images programmatically .

int id = getResources().getIdentifier("image1", "drawable", getPackageName());
ImageView imageView1 = new ImageView(this);
LinearLayout.LayoutParams vp = 
new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, 
                LayoutParams.WRAP_CONTENT);
imageView1.setLayoutParams(vp);        
imageView1.setImageResource(id);        
someLinearLayout.addView(imageView1); 

 int id = getResources().getIdentifier("image2", "drawable", getPackageName());
ImageView imageView2 = new ImageView(this);
LinearLayout.LayoutParams vp1 = 
new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, 
                LayoutParams.WRAP_CONTENT);
imageView2.setLayoutParams(vp1);        
imageView2.setImageResource(id);        
someLinearLayout.addView(imageView2); 

and add touch events to the added imageviews