Simple Drag & Drop Views on Screen in Android

Hello Friends, Today i am going to share with you a simple drag and drop or give the motion to any object and move it around the screen onTouch event within the screen boundries.

First of all create android project in your eclipse and create a class and layout file as below:

MainActivity.java

 public class MainActivity extends Activity  
 {  
  private ImageView m_ivImage, m_ivImage1;  
  private int m_counter = 0;  
  float m_lastTouchX, m_lastTouchY, m_posX, m_posY, m_prevX, m_prevY, m_imgXB, m_imgYB, m_imgXC, m_imgYC, m_dx, m_dy;  
  private LinearLayout m_llTop;  
  private AbsoluteLayout m_alTop;  
  private Button m_btnAddView, m_btnRemove;  
  private Context m_context;  
  @Override  
  public void onCreate(Bundle savedInstanceState)  
  {  
  super.onCreate(savedInstanceState);  
  setContentView(R.layout.main_layout);  
  m_context = this;  
  m_prevX = 0;  
  m_prevY = 0;  
  m_imgXB = 50;  
  m_imgYB = 100;  
  m_imgXC = 150;  
  m_imgYC = 100;  
  m_ivImage = (ImageView) findViewById(R.id.ivImage);  
  m_ivImage1 = (ImageView) findViewById(R.id.ivImage1);  
  m_llTop = (LinearLayout) findViewById(R.id.llTop);  
  m_alTop = (AbsoluteLayout) findViewById(R.id.alTop);  
  m_btnAddView = (Button) findViewById(R.id.btnAdd);  
  m_btnRemove = (Button) findViewById(R.id.btnRemove);  
  m_ivImage.setOnTouchListener(m_onTouchListener);  
  m_ivImage1.setOnTouchListener(m_onTouchListener);  
  m_btnAddView.setOnClickListener(m_onClickListener);  
  m_btnRemove.setOnClickListener(m_onClickListener);  
  }  
  OnClickListener m_onClickListener = new OnClickListener(){  
  @Override  
  public void onClick(View p_v)  
  {  
   switch (p_v.getId())  
   {  
    case R.id.btnAdd:  
    addView();  
    break;  
    case R.id.btnRemove:  
    removeView();  
    break;  
    default:  
    break;  
   }  
  }  
  };  
  OnTouchListener m_onTouchListener = new OnTouchListener(){  
  @Override  
  public boolean onTouch(View p_v, MotionEvent p_event)  
  {  
   switch (p_event.getAction())  
   {  
    case MotionEvent.ACTION_DOWN:  
    {  
    m_lastTouchX = p_event.getX();  
    m_lastTouchY = p_event.getY();  
    break;  
    }  
    case MotionEvent.ACTION_UP:  
    {  
    break;  
    }  
    case MotionEvent.ACTION_MOVE:  
    {  
    m_dx = p_event.getX() - m_lastTouchX;  
    m_dy = p_event.getY() - m_lastTouchY;  
    m_posX = m_prevX + m_dx;  
    m_posY = m_prevY + m_dy;  
    if (m_posX > 0 && m_posY > 0 && (m_posX + p_v.getWidth()) < m_alTop.getWidth() && (m_posY + p_v.getHeight()) < m_alTop.getHeight())  
    {  
     p_v.setLayoutParams(new AbsoluteLayout.LayoutParams(p_v.getMeasuredWidth(), p_v.getMeasuredHeight(), (int) m_posX, (int) m_posY));  
     m_prevX = m_posX;  
     m_prevY = m_posY;  
    }  
    break;  
    }  
   }  
   return true;  
  }  
  };  
  /**  
  * Add view dynamically for drag and drop  
  */  
  private void addView()  
  {  
  ImageView m_img = new ImageView(m_context);  
  TextView m_tv=new TextView(m_context);  
  if (m_counter < 5)  
  {  
   if (m_counter % 2 == 0)  
   {  
   m_img.setBackgroundResource(R.drawable.bol_green);  
   m_tv.setText("Hello! Drag Me! ");  
   m_alTop.addView(m_tv, new LayoutParams(android.view.ViewGroup.LayoutParams.WRAP_CONTENT, android.view.ViewGroup.LayoutParams.WRAP_CONTENT, ((int) m_imgXB), ((int) m_imgYB)));  
   m_alTop.addView(m_img, new LayoutParams(android.view.ViewGroup.LayoutParams.WRAP_CONTENT, android.view.ViewGroup.LayoutParams.WRAP_CONTENT, ((int) m_imgXB), ((int) m_imgYB)));  
   }  
   else  
   {  
   m_img.setBackgroundResource(R.drawable.bol_paars);  
   m_alTop.addView(m_img, new LayoutParams(android.view.ViewGroup.LayoutParams.WRAP_CONTENT, android.view.ViewGroup.LayoutParams.WRAP_CONTENT, ((int) m_imgXC), ((int) m_imgYC)));  
   }  
   m_counter++;  
   if (m_counter == 5)  
   m_btnAddView.setEnabled(false);  
  }  
  m_img.setOnTouchListener(m_onTouchListener);  
  m_tv.setOnTouchListener(m_onTouchListener);  
  }  
  public void removeView()  
  {  
  m_counter = 0;  
  m_alTop.removeAllViews();  
  m_alTop.invalidate();  
  m_btnAddView.setEnabled(true);  
  }  
 }  

main_layout.xml

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:tools="http://schemas.android.com/tools"  
   android:id="@+id/llTop"  
   android:layout_width="fill_parent"  
   android:layout_height="fill_parent"  
   android:orientation="vertical" >  
   <AbsoluteLayout  
     android:id="@+id/alTop"  
     android:layout_width="fill_parent"  
     android:layout_height="0dp"  
     android:layout_margin="10dp"  
     android:layout_weight=".70"  
      >  
     <ImageView  
       android:id="@+id/ivImage"  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:layout_marginTop="10dp"  
       android:src="@drawable/ic_menu_share"  
       android:visibility="gone" />  
     <ImageView  
       android:id="@+id/ivImage1"  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:layout_marginLeft="10dp"  
       android:layout_marginTop="10dp"  
       android:layout_x="193dp"  
       android:layout_y="29dp"  
       android:src="@drawable/ic_launcher" />  
   </AbsoluteLayout>  
   <LinearLayout  
     android:layout_width="wrap_content"  
     android:layout_height="0dp"  
     android:layout_gravity="center"  
     android:layout_weight=".30" >  
     <Button  
       android:id="@+id/btnAdd"  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:layout_marginTop="10dp"  
       android:text="Add View" />  
     <Button  
       android:id="@+id/btnRemove"  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:layout_marginTop="10dp"  
       android:text="Remove View"  
       android:visibility="visible" />  
   </LinearLayout>  
 </LinearLayout>  

Here is the boundary file xml code which shows the border of the layout in which object moves.

 <?xml version="1.0" encoding="utf-8"?>  
 <selector  
   xmlns:android="http://schemas.android.com/apk/res/android">  
   <item>  
  <shape>    
      <stroke  
         android:width="1dp"  
         android:color="#000000"/>     
     <corners          
         android:topLeftRadius="8dp"  
         android:topRightRadius="8dp"  
         android:bottomLeftRadius="8dp"  
         android:bottomRightRadius="8dp"/>   
   <padding  
        android:left="0dp"  
        android:top="0dp"  
        android:right="0dp"  
        android:bottom="0dp"/>  
     <gradient  
      android:angle="270"   
      android:endColor="#FFFFFF"  
      android:startColor="#FFFFFF"  
      android:type="linear"  
      android:centerColor="#FFFFFF"/>  
     </shape>  
    </item>  
 </selector>  

Screenshot

Download Code