Android中在GridView网格视图上实现item拖拽交换的方法

<?xml version="1.0" encoding="utf-8"?> 
<gridview 
 xmlns:android="http://schemas.android.com/apk/res/android" 
 android:id="@+id/gridview" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 android:columnwidth="90dp" 
 android:numcolumns="auto_fit" 
 android:horizontalspacing="10dp" 
 android:verticalspacing="10dp" 
 android:stretchmode="columnwidth" 
 android:gravity="center"> 
</gridview> 

public class hellogridview extends activity { 
  /** called when the activity is first created. */ 
  @override 
  protected void oncreate(bundle savedinstancestate) { 
    super.oncreate(savedinstancestate); 
    setcontentview(r.layout.main); 
    gridview gridview=(gridview)findviewbyid(r.id.gridview); 
    gridview.setadapter(new imageadapter(this)); 
    //单击gridview元素的响应 
    gridview.setonitemclicklistener(new onitemclicklistener() { 
 
      @override 
      public void onitemclick(adapterview<?> parent, view view, 
          int position, long id) { 
        //弹出单击的gridview元素的位置 
        toast.maketext(hellogridview.this,mthumbids[position], toast.length_short).show(); 
      } 
    }); 
  } 
  private class imageadapter extends baseadapter{ 
    private context mcontext; 
 
    public imageadapter(context context) { 
      this.mcontext=context; 
    } 
 
    @override 
    public int getcount() { 
      return mthumbids.length; 
    } 
 
    @override 
    public object getitem(int position) { 
      return mthumbids[position]; 
    } 
 
    @override 
    public long getitemid(int position) { 
      // todo auto-generated method stub 
      return 0; 
    } 
 
    @override 
    public view getview(int position, view convertview, viewgroup parent) { 
      //定义一个imageview,显示在gridview里 
      imageview imageview; 
      if(convertview==null){ 
        imageview=new imageview(mcontext); 
        imageview.setlayoutparams(new gridview.layoutparams(85, 85)); 
        imageview.setscaletype(imageview.scaletype.center_crop); 
        imageview.setpadding(8, 8, 8, 8); 
      }else{ 
        imageview = (imageview) convertview; 
      } 
      imageview.setimageresource(mthumbids[position]); 
      return imageview; 
    } 
     
 
     
  } 
  //展示图片 
  private integer[] mthumbids = { 
      r.drawable.sample_2, r.drawable.sample_3, 
      r.drawable.sample_4, r.drawable.sample_5, 
      r.drawable.sample_6, r.drawable.sample_7, 
      r.drawable.sample_0, r.drawable.sample_1, 
      r.drawable.sample_2, r.drawable.sample_3, 
      r.drawable.sample_4, r.drawable.sample_5, 
      r.drawable.sample_6, r.drawable.sample_7, 
      r.drawable.sample_0, r.drawable.sample_1, 
      r.drawable.sample_2, r.drawable.sample_3, 
      r.drawable.sample_4, r.drawable.sample_5, 
      r.drawable.sample_6, r.drawable.sample_7 
  }; 
} 

package com.example.draggridview; 
 
import android.app.activity; 
import android.content.context; 
import android.graphics.bitmap; 
import android.graphics.pixelformat; 
import android.graphics.rect; 
import android.os.handler; 
import android.os.vibrator; 
import android.util.attributeset; 
import android.view.gravity; 
import android.view.motionevent; 
import android.view.view; 
import android.view.windowmanager; 
import android.widget.adapterview; 
import android.widget.gridview; 
import android.widget.imageview; 
 
public class draggridview extends gridview{ 
  /** 
   * draggridview的item长按响应的时间， 默认是1000毫秒，也可以自行设置 
   */ 
  private long dragresponsems = 1000; 
   
  /** 
   * 是否可以拖拽，默认不可以 
   */ 
  private boolean isdrag = false; 
   
  private int mdownx; 
  private int mdowny; 
  private int movex; 
  private int movey; 
  /** 
   * 正在拖拽的position 
   */ 
  private int mdragposition; 
   
  /** 
   * 刚开始拖拽的item对应的view 
   */ 
  private view mstartdragitemview = null; 
   
  /** 
   * 用于拖拽的镜像，这里直接用一个imageview 
   */ 
  private imageview mdragimageview; 
   
  /** 
   * 震动器 
   */ 
  private vibrator mvibrator; 
   
  private windowmanager mwindowmanager; 
  /** 
   * item镜像的布局参数 
   */ 
  private windowmanager.layoutparams mwindowlayoutparams; 
   
  /** 
   * 我们拖拽的item对应的bitmap 
   */ 
  private bitmap mdragbitmap; 
   
  /** 
   * 按下的点到所在item的上边缘的距离 
   */ 
  private int mpoint2itemtop ;  
   
  /** 
   * 按下的点到所在item的左边缘的距离 
   */ 
  private int mpoint2itemleft; 
   
  /** 
   * draggridview距离屏幕顶部的偏移量 
   */ 
  private int moffset2top; 
   
  /** 
   * draggridview距离屏幕左边的偏移量 
   */ 
  private int moffset2left; 
   
  /** 
   * 状态栏的高度 
   */ 
  private int mstatusheight;  
   
  /** 
   * draggridview自动向下滚动的边界值 
   */ 
  private int mdownscrollborder; 
   
  /** 
   * draggridview自动向上滚动的边界值 
   */ 
  private int mupscrollborder; 
   
  /** 
   * draggridview自动滚动的速度 
   */ 
  private static final int speed = 20; 
   
  /** 
   * item发生变化回调的接口 
   */ 
  private onchanagelistener onchanagelistener; 
   
   
   
  public draggridview(context context) { 
    this(context, null); 
  } 
   
  public draggridview(context context, attributeset attrs) { 
    this(context, attrs, 0); 
  } 
 
  public draggridview(context context, attributeset attrs, int defstyle) { 
    super(context, attrs, defstyle); 
    mvibrator = (vibrator) context.getsystemservice(context.vibrator_service); 
    mwindowmanager = (windowmanager) context.getsystemservice(context.window_service); 
    mstatusheight = getstatusheight(context); //获取状态栏的高度 
     
  } 
   
  private handler mhandler = new handler(); 
   
  //用来处理是否为长按的runnable 
  private runnable mlongclickrunnable = new runnable() { 
     
    @override 
    public void run() { 
      isdrag = true; //设置可以拖拽 
      mvibrator.vibrate(50); //震动一下 
      mstartdragitemview.setvisibility(view.invisible);//隐藏该item 
       
      //根据我们按下的点显示item镜像 
      createdragimage(mdragbitmap, mdownx, mdowny); 
    } 
  }; 

  /** 
   * 设置回调接口 
   * @param onchanagelistener 
   */ 
  public void setonchangelistener(onchanagelistener onchanagelistener){ 
    this.onchanagelistener = onchanagelistener; 
  } 
   
  /** 
   * 设置响应拖拽的毫秒数，默认是1000毫秒 
   * @param dragresponsems 
   */ 
  public void setdragresponsems(long dragresponsems) { 
    this.dragresponsems = dragresponsems; 
  } 
 
  @override 
  public boolean dispatchtouchevent(motionevent ev) { 
    switch(ev.getaction()){ 
    case motionevent.action_down: 
      mdownx = (int) ev.getx(); 
      mdowny = (int) ev.gety(); 
       
      //根据按下的x,y坐标获取所点击item的position 
      mdragposition = pointtoposition(mdownx, mdowny); 
       
       
      if(mdragposition == adapterview.invalid_position){ 
        return super.dispatchtouchevent(ev); 
      } 
       
      //使用handler延迟dragresponsems执行mlongclickrunnable 
      mhandler.postdelayed(mlongclickrunnable, dragresponsems); 
       
      //根据position获取该item所对应的view 
      mstartdragitemview = getchildat(mdragposition - getfirstvisibleposition()); 
       
      //下面这几个距离大家可以参考我的博客上面的图来理解下 
      mpoint2itemtop = mdowny - mstartdragitemview.gettop(); 
      mpoint2itemleft = mdownx - mstartdragitemview.getleft(); 
       
      moffset2top = (int) (ev.getrawy() - mdowny); 
      moffset2left = (int) (ev.getrawx() - mdownx); 
       
      //获取draggridview自动向上滚动的偏移量，小于这个值，draggridview向下滚动 
      mdownscrollborder = getheight() /4; 
      //获取draggridview自动向下滚动的偏移量，大于这个值，draggridview向上滚动 
      mupscrollborder = getheight() * 3/4; 
       
       
       
      //开启mdragitemview绘图缓存 
      mstartdragitemview.setdrawingcacheenabled(true); 
      //获取mdragitemview在缓存中的bitmap对象 
      mdragbitmap = bitmap.createbitmap(mstartdragitemview.getdrawingcache()); 
      //这一步很关键，释放绘图缓存，避免出现重复的镜像 
      mstartdragitemview.destroydrawingcache(); 
       
       
      break; 
    case motionevent.action_move: 
      int movex = (int)ev.getx(); 
      int movey = (int) ev.gety(); 
       
      //如果我们在按下的item上面移动，只要不超过item的边界我们就不移除mrunnable 
      if(!istouchinitem(mstartdragitemview, movex, movey)){ 
        mhandler.removecallbacks(mlongclickrunnable); 
      } 
      break; 
    case motionevent.action_up: 
      mhandler.removecallbacks(mlongclickrunnable); 
      mhandler.removecallbacks(mscrollrunnable); 
      break; 
    } 
    return super.dispatchtouchevent(ev); 
  } 

  /** 
   * 是否点击在gridview的item上面 
   * @param itemview 
   * @param x 
   * @param y 
   * @return 
   */ 
  private boolean istouchinitem(view dragview, int x, int y){ 
    if(dragview == null){ 
      return false; 
    } 
    int leftoffset = dragview.getleft(); 
    int topoffset = dragview.gettop(); 
    if(x < leftoffset || x > leftoffset + dragview.getwidth()){ 
      return false; 
    } 
     
    if(y < topoffset || y > topoffset + dragview.getheight()){ 
      return false; 
    } 
     
    return true; 
  } 
   
   
 
  @override 
  public boolean ontouchevent(motionevent ev) { 
    if(isdrag && mdragimageview != null){ 
      switch(ev.getaction()){ 
      case motionevent.action_move: 
        movex = (int) ev.getx(); 
        movey = (int) ev.gety(); 
        //拖动item 
        ondragitem(movex, movey); 
        break; 
      case motionevent.action_up: 
        onstopdrag(); 
        isdrag = false; 
        break; 
      } 
      return true; 
    } 
    return super.ontouchevent(ev); 
  } 

  /** 
   * 创建拖动的镜像 
   * @param bitmap 
   * @param downx 
   *     按下的点相对父控件的x坐标 
   * @param downy 
   *     按下的点相对父控件的x坐标 
   */ 
  private void createdragimage(bitmap bitmap, int downx , int downy){ 
    mwindowlayoutparams = new windowmanager.layoutparams(); 
    mwindowlayoutparams.format = pixelformat.translucent; //图片之外的其他地方透明 
    mwindowlayoutparams.gravity = gravity.top | gravity.left; 
    mwindowlayoutparams.x = downx - mpoint2itemleft + moffset2left; 
    mwindowlayoutparams.y = downy - mpoint2itemtop + moffset2top - mstatusheight; 
    mwindowlayoutparams.alpha = 0.55f; //透明度 
    mwindowlayoutparams.width = windowmanager.layoutparams.wrap_content;  
    mwindowlayoutparams.height = windowmanager.layoutparams.wrap_content;  
    mwindowlayoutparams.flags = windowmanager.layoutparams.flag_not_focusable  
          | windowmanager.layoutparams.flag_not_touchable ; 
      
    mdragimageview = new imageview(getcontext());  
    mdragimageview.setimagebitmap(bitmap);  
    mwindowmanager.addview(mdragimageview, mwindowlayoutparams);  
  } 
   

  /** 
   * 从界面上面移动拖动镜像 
   */ 
  private void removedragimage(){ 
    if(mdragimageview != null){ 
      mwindowmanager.removeview(mdragimageview); 
      mdragimageview = null; 
    } 
  } 

  /** 
   * 拖动item，在里面实现了item镜像的位置更新，item的相互交换以及gridview的自行滚动 
   * @param x 
   * @param y 
   */ 
  private void ondragitem(int movex, int movey){ 
    mwindowlayoutparams.x = movex - mpoint2itemleft + moffset2left; 
    mwindowlayoutparams.y = movey - mpoint2itemtop + moffset2top - mstatusheight; 
    mwindowmanager.updateviewlayout(mdragimageview, mwindowlayoutparams); //更新镜像的位置 
    onswapitem(movex, movey); 
     
    //gridview自动滚动 
    mhandler.post(mscrollrunnable); 
  } 

  /** 
   * 当movey的值大于向上滚动的边界值，触发gridview自动向上滚动 
   * 当movey的值小于向下滚动的边界值，触犯gridview自动向下滚动 
   * 否则不进行滚动 
   */ 
  private runnable mscrollrunnable = new runnable() { 
     
    @override 
    public void run() { 
      int scrolly; 
      if(movey > mupscrollborder){ 
         scrolly = speed; 
         mhandler.postdelayed(mscrollrunnable, 25); 
      }else if(movey < mdownscrollborder){ 
        scrolly = -speed; 
         mhandler.postdelayed(mscrollrunnable, 25); 
      }else{ 
        scrolly = 0; 
        mhandler.removecallbacks(mscrollrunnable); 
      } 
       
      //当我们的手指到达gridview向上或者向下滚动的偏移量的时候，可能我们手指没有移动，但是draggridview在自动的滚动 
      //所以我们在这里调用下onswapitem()方法来交换item 
      onswapitem(movex, movey); 
       
       
      smoothscrollby(scrolly, 10); 
    } 
  }; 

  /** 
   * 交换item,并且控制item之间的显示与隐藏效果 
   * @param movex 
   * @param movey 
   */ 
  private void onswapitem(int movex, int movey){ 
    //获取我们手指移动到的那个item的position 
    int tempposition = pointtoposition(movex, movey); 
     
    //假如tempposition 改变了并且tempposition不等于-1,则进行交换 
    if(tempposition != mdragposition && tempposition != adapterview.invalid_position){ 
      if(onchanagelistener != null){ 
        onchanagelistener.onchange(mdragposition, tempposition); 
      } 
       
      getchildat(tempposition - getfirstvisibleposition()).setvisibility(view.invisible);//拖动到了新的item,新的item隐藏掉 
      getchildat(mdragposition - getfirstvisibleposition()).setvisibility(view.visible);//之前的item显示出来 
       
      mdragposition = tempposition; 
    } 
  } 

   
  /** 
   * 停止拖拽我们将之前隐藏的item显示出来，并将镜像移除 
   */ 
  private void onstopdrag(){ 
    view view = getchildat(mdragposition - getfirstvisibleposition()); 
    if(view != null){ 
      view.setvisibility(view.visible); 
    } 
    ((dragadapter)this.getadapter()).setitemhide(-1); 
    removedragimage(); 
  } 

  /** 
   * 获取状态栏的高度 
   * @param context 
   * @return 
   */ 
  private static int getstatusheight(context context){ 
    int statusheight = 0; 
    rect localrect = new rect(); 
    ((activity) context).getwindow().getdecorview().getwindowvisibledisplayframe(localrect); 
    statusheight = localrect.top; 
    if (0 == statusheight){ 
      class<?> localclass; 
      try { 
        localclass = class.forname("com.android.internal.r$dimen"); 
        object localobject = localclass.newinstance(); 
        int i5 = integer.parseint(localclass.getfield("status_bar_height").get(localobject).tostring()); 
        statusheight = context.getresources().getdimensionpixelsize(i5); 
      } catch (exception e) { 
        e.printstacktrace(); 
      }  
    } 
    return statusheight; 
  } 

  /** 
   * 
   * @author xiaanming 
   * 
   */ 
  public interface onchanagelistener{ 
     
    /** 
     * 当item交换位置的时候回调的方法，我们只需要在该方法中实现数据的交换即可 
     * @param form 
     *     开始的position 
     * @param to 
     *     拖拽到的position 
     */ 
    public void onchange(int form, int to); 
  } 
} 

首先看draggridview的事件分发方法，不了解android事件分发的可以先去了解下，android事件分发对于自定义控件很重要，简单说下，当我们点击draggridview的item,先会去执行dispatchtouchevent()方法将事件分发下去，所以我们要重写dispatchtouchevent()方法在手指按下的时候根据pointtoposition()方法来获取我们按下的item的position,根据getchildat()方法来获取该position上面所对应的view, 并且开启长按的定时器，默认时间为1000毫秒，如果在1000毫秒内手指抬起或者手指在屏幕上滑动出了该item，则取消长按定时器，否则就表示可以进行拖拽，手机友好的震动一下，隐藏我们长按的item，屏幕调用createdragimage()方法来创建我们长按的item的镜像，创建item的镜像使用的是windowmanager类，该类可以创建一个窗体显示在activity之上，
再此之前大家先要理解这几个距离，理解这几个距离之前要首先知道getrawx(),getrawy()和getx(),gety()的区别，getrawx(),getrawy()是相对于屏幕的原点的距离，而getx(),gety()是相对于控件左上方的点的距离，为了方便大家理解我用word简单的画了下图，画得不好，大家将就的看下，红色框框为我们的gridview

• mpoint2itemtop 手指按下的点到该item的上边缘的距离，如上图的1号线
• mpoint2itemleft 手指按下的点到该item的左边缘的距离，如上图的2号线
• moffset2top  draggridview的上边缘到屏幕上边缘的距离，如上图的3号线，这个距离包裹状态栏，标题栏，或者一些在draggridview上面的布局的高度，这个很重要我们现实item镜像需要用到
• moffset2left draggridview的左边缘到屏幕左边缘的距离，如上图的4号线，我这个demo的这个距离为0，因为我设置draggridview的宽度为充满屏幕，但是我们要考虑假如draggridview与屏幕左边缘设置了间隙或者左边有其他的布局的情形
• mdownscrollborder 这个距离表示当draggridview的item过多的时候，手机一屏显示不完全，我们拖动item镜像到这个高度的时候，draggridview自动向下滚动，如上图的5号线
• .mupscrollborder 这个和mdownscrollborder相反，当我们大于这个高度的时候，draggridview自动向上滚动，如上图的6号线

理解了这六个距离，我们就来看看创建item镜像的方法里面，其他的我不多说，首先设置format为pixelformat.translucent，表示除了我们显示图片和文字的其他地方为透明，之后就是x，y这两个距离的计算，计算的是item的左上角的坐标，理解了上面这六个距离我们很容易得出x,y的坐标，可是你会发现y的坐标减去了状态栏的高度，这点大家需要注意下，另外我们需要获取item的绘制缓存的bitmap对象，然后将bitmap设置到一个imageview上面，为什么要这么做呢？如果调用addview()方法将item 直接添加到windowmanager里面，会有异常产生，因为item已经有了自己归属的父容器draggridview，所有我们这里使用一个imageview来代替item添加到windowmanager里面

<relativelayout xmlns:android="http://schemas.android.com/apk/res/android" 
  xmlns:tools="http://schemas.android.com/tools" 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" > 
 
  <com.example.draggridview.draggridview 
    android:id="@+id/draggridview" 
    android:listselector="@android:color/transparent" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:cachecolorhint="@android:color/transparent" 
    android:verticalspacing="10dip" 
    android:horizontalspacing="10dip" 
    android:stretchmode="columnwidth"  
    android:gravity="center"  
    android:numcolumns="3" > 
  </com.example.draggridview.draggridview> 
 
</relativelayout> 

<?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="wrap_content" 
  android:background="@android:color/transparent" > 
 
  <imageview 
    android:id="@+id/item_image" 
    android:scaletype="centercrop" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerhorizontal="true" > 
  </imageview> 
 
  <textview 
    android:id="@+id/item_text" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/item_image" 
    android:layout_centerhorizontal="true" > 
  </textview> 
 
</relativelayout> 

package com.example.draggridview; 
 
import java.util.arraylist; 
import java.util.collections; 
import java.util.hashmap; 
import java.util.list; 
 
import android.app.activity; 
import android.os.bundle; 
import android.widget.simpleadapter; 
 
import com.example.draggridview.draggridview.onchanagelistener; 

public class mainactivity extends activity { 
  private list<hashmap<string, object>> datasourcelist = new arraylist<hashmap<string, object>>(); 
 
  @override 
  protected void oncreate(bundle savedinstancestate) { 
    super.oncreate(savedinstancestate); 
    setcontentview(r.layout.activity_main); 
 
    draggridview mdraggridview = (draggridview) findviewbyid(r.id.draggridview); 
    for (int i = 0; i < 30; i++) { 
      hashmap<string, object> itemhashmap = new hashmap<string, object>(); 
      itemhashmap.put("item_image",r.drawable.com_tencent_open_notice_msg_icon_big); 
      itemhashmap.put("item_text", "拖拽 " + integer.tostring(i)); 
      datasourcelist.add(itemhashmap); 
    } 
     
 
    final simpleadapter msimpleadapter = new simpleadapter(this, datasourcelist, 
        r.layout.grid_item, new string[] { "item_image", "item_text" }, 
        new int[] { r.id.item_image, r.id.item_text }); 
     
    mdraggridview.setadapter(msimpleadapter); 
     
    mdraggridview.setonchangelistener(new onchanagelistener() { 
       
      @override 
      public void onchange(int from, int to) { 
        hashmap<string, object> temp = datasourcelist.get(from); 
        //直接交互item 
//       datasourcelist.set(from, datasourcelist.get(to)); 
//       datasourcelist.set(to, temp); 
//       datasourcelist.set(to, temp); 
         
         
        //这里的处理需要注意下 
        if(from < to){ 
          for(int i=from; i<to; i++){ 
            collections.swap(datasourcelist, i, i+1); 
          } 
        }else if(from > to){ 
          for(int i=from; i>to; i--){ 
            collections.swap(datasourcelist, i, i-1); 
          } 
        } 
         
        datasourcelist.set(to, temp); 
         
        msimpleadapter.notifydatasetchanged(); 
         
         
      } 
    }); 
     
  } 
 
} 

hashmap<string, object> temp = datasourcelist.get(from); 
        //直接交互item 
//       datasourcelist.set(from, datasourcelist.get(to)); 
//       datasourcelist.set(to, temp);