App列表之拖拽GridView

http://www.cnblogs.com/qianxudetianxia/archive/2011/06/20/2084886.html

根据前面文章中ListView拖拽的实现原理，我们也是很容易实现推拽GridView的，下面我就以相同步骤实现基本的GridView拖拽效果。
     因为GridView不用做分组处理，代码处理起来更简洁，而且原理前面已经讲解清楚了，代码中只是简单的过下，必要的地方简单的注释一下。
 1.主界面DragGridActivity.

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

public class DragGridActivity extendsActivity {

     

    privatestatic List<String> list =null;

    //自定义适配器

    privateDragGridAdapter adapter = null;

     

    @Override

    publicvoid onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.drag_grid_activity);

         

        initData();

         

        //后面用到的自定义GridView

        DragGridView dragGridView = (DragGridView)findViewById(R.id.drag_grid);

        adapter =new DragGridAdapter(this, list);

        dragGridView.setAdapter(adapter);

    }

     

    publicvoid initData(){

        //数据结果

        list =new ArrayList<String>();

         

        for(inti=0; i<12; i++){

            list.add("grid_"+i%12);

        }

    }

}

2.主界面UI布局drag_grid_activity.xml.

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

<?xml version="1.0"encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:background="#ffffff"

    android:padding="10dip"

    >

    <com.fengjian.test.DragGridView

        android:id="@+id/drag_grid"

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:cacheColorHint="#00000000"

        android:numColumns="3"

        android:stretchMode="columnWidth"

        android:verticalSpacing="5dip"

        android:horizontalSpacing="20dip"

        android:background="#ffffff"/>

</LinearLayout>

3.列表项布局drag_grid_item.xml.

?

<?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:paddingLeft="5dip"

    android:paddingRight="5dip">

    <ImageView android:id="@+id/drag_grid_item_image"

       android:src="@drawable/grid_icon"

       android:layout_margin="5dip"

       android:layout_alignParentTop="true"

       android:layout_width="fill_parent"

       android:layout_height="wrap_content"/>

    <ImageView android:id="@+id/drag_grid_item_drag"

       android:src="@drawable/grid_drag"

       android:layout_alignParentTop="true"

       android:layout_alignParentRight="true"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"/>

</RelativeLayout>

4.自定义适配器DragGridAdapter，继承ArrayAdapter<String>.

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

public static class DragGridAdapterextends ArrayAdapter<String>{

 

        publicDragGridAdapter(Context context, List<String> objects) {

            super(context,0, objects);

        }

        publicList<String> getList(){

            returnlist;

        }

 

        @Override

        publicView getView(intposition, View convertView, ViewGroup parent) {

            View view = convertView;

            if(view==null){

                view = LayoutInflater.from(getContext()).inflate(R.layout.drag_grid_item,null);

            }

             

            try{

                //根据文件名获取资源文件夹中的图片资源

                Field f= (Field)R.drawable.class.getDeclaredField(getItem(position));

                inti=f.getInt(R.drawable.class);

                ImageView imageview= (ImageView)view.findViewById(R.id.drag_grid_item_image);

                imageview.setImageResource(i);

            }catch (SecurityException e) {

                e.printStackTrace();

            }catch (NoSuchFieldException e) {

                e.printStackTrace();

            }catch (IllegalArgumentException e) {

                e.printStackTrace();

            }catch (IllegalAccessException e) {

                e.printStackTrace();

            }

            returnview;

        }

    }

5.自定义视图类DragGridView，继承GridView.

?

public class DragGridView extendsGridView {

    //定义基本的成员变量

    privateImageView dragImageView;

    privateint dragSrcPosition;

    privateint dragPosition;

    //x,y坐标的计算

    privateint dragPointX;

    privateint dragPointY;

    privateint dragOffsetX;

    privateint dragOffsetY;

     

    privateWindowManager windowManager;

    privateWindowManager.LayoutParams windowParams;

     

    privateint scaledTouchSlop;

    privateint upScrollBounce;

    privateint downScrollBounce;

     

    publicDragGridView(Context context, AttributeSet attrs) {

        super(context, attrs);

    }

}

6.重写触控拦截事件方法onInterceptTouchEvent().

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

@Override

public boolean onInterceptTouchEvent(MotionEvent ev) {

    if(ev.getAction()==MotionEvent.ACTION_DOWN){

        intx = (int)ev.getX();

        inty = (int)ev.getY();

         

        dragSrcPosition = dragPosition = pointToPosition(x, y);

        if(dragPosition==AdapterView.INVALID_POSITION){

            returnsuper.onInterceptTouchEvent(ev);

        }

 

        ViewGroup itemView = (ViewGroup) getChildAt(dragPosition-getFirstVisiblePosition());

        dragPointX = x - itemView.getLeft();

        dragPointY = y - itemView.getTop();

        dragOffsetX = (int) (ev.getRawX() - x);

        dragOffsetY = (int) (ev.getRawY() - y);

         

        View dragger = itemView.findViewById(R.id.drag_grid_item_drag);

        //如果选中拖动图标

        if(dragger!=null&&dragPointX>dragger.getLeft()&&dragPointX<dragger.getRight()&&dragPointY>dragger.getTop()&&dragPointY<dragger.getBottom()+20){

 

            upScrollBounce = Math.min(y-scaledTouchSlop, getHeight()/4);

            downScrollBounce = Math.max(y+scaledTouchSlop, getHeight()*3/4);

             

            itemView.setDrawingCacheEnabled(true);

            Bitmap bm = Bitmap.createBitmap(itemView.getDrawingCache());

            startDrag(bm, x, y);

        }

        returnfalse;

     }

     returnsuper.onInterceptTouchEvent(ev);

}

     startDrag和stopDrag方法如下：

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

public void startDrag(Bitmap bm, intx, int y){

    stopDrag();

     

    windowParams =new WindowManager.LayoutParams();

    windowParams.gravity = Gravity.TOP|Gravity.LEFT;

    windowParams.x = x - dragPointX + dragOffsetX;

    windowParams.y = y - dragPointY + dragOffsetY;

    windowParams.width = WindowManager.LayoutParams.WRAP_CONTENT;

    windowParams.height = WindowManager.LayoutParams.WRAP_CONTENT;

    windowParams.flags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE

                        | WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE

                        | WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON

                        | WindowManager.LayoutParams.FLAG_LAYOUT_IN_SCREEN;

    windowParams.format = PixelFormat.TRANSLUCENT;

    windowParams.windowAnimations =0;

 

    ImageView imageView =new ImageView(getContext());

    imageView.setImageBitmap(bm);

    windowManager = (WindowManager)getContext().getSystemService("window");

    windowManager.addView(imageView, windowParams);

    dragImageView = imageView;

}

 

public void onDrag(intx, int y){

    if(dragImageView!=null){

        windowParams.alpha =0.8f;

        windowParams.x = x - dragPointX + dragOffsetX;

        windowParams.y = y - dragPointY + dragOffsetY;

        windowManager.updateViewLayout(dragImageView, windowParams);

    }

 

    inttempPosition = pointToPosition(x, y);

    if(tempPosition!=INVALID_POSITION){

        dragPosition = tempPosition;

    }

     

    //滚动

    if(y<upScrollBounce||y>downScrollBounce){

        //使用setSelection来实现滚动

        setSelection(dragPosition);

    }       

}

7.重写onTouchEvent()方法. 

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

@Override

public boolean onTouchEvent(MotionEvent ev) {

    if(dragImageView!=null&&dragPosition!=INVALID_POSITION){

        intaction = ev.getAction();

        switch(action){

            caseMotionEvent.ACTION_UP:

                intupX = (int)ev.getX();

                intupY = (int)ev.getY();

                stopDrag();

                onDrop(upX,upY);

                break;

            caseMotionEvent.ACTION_MOVE:

                intmoveX = (int)ev.getX();

                intmoveY = (int)ev.getY();

                onDrag(moveX,moveY);

                break;

            default:break;

        }

        returntrue;

    }

    returnsuper.onTouchEvent(ev);

}

其中onDrag方法如下：

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

public void onDrag(intx, int y){

    if(dragImageView!=null){

        windowParams.alpha =0.8f;

        windowParams.x = x - dragPointX + dragOffsetX;

        windowParams.y = y - dragPointY + dragOffsetY;

        windowManager.updateViewLayout(dragImageView, windowParams);

    }

 

    inttempPosition = pointToPosition(x, y);

    if(tempPosition!=INVALID_POSITION){

        dragPosition = tempPosition;

    }

     

    //滚动

    if(y<upScrollBounce||y>downScrollBounce){

        //使用setSelection来实现滚动

        setSelection(dragPosition);

    }       

}

8.放下影像，数据更新。
 在onDrop方法中实现：

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

public void onDrop(intx, int y){

         

        //为了避免滑动到分割线的时候，返回-1的问题

        inttempPosition = pointToPosition(x, y);

        if(tempPosition!=INVALID_POSITION){

            dragPosition = tempPosition;

        }

         

        //超出边界处理

        if(y<getChildAt(0).getTop()){

            //超出上边界

            dragPosition =0;

        }elseif(y>getChildAt(getChildCount()-1).getBottom()||(y>getChildAt(getChildCount()-1).getTop()&&x>getChildAt(getChildCount()-1).getRight())){

            //超出下边界

            dragPosition = getAdapter().getCount()-1;

        }

         

        //数据交换

        if(dragPosition!=dragSrcPosition&&dragPosition>-1&&dragPosition<getAdapter().getCount()){

            DragGridAdapter adapter = (DragGridAdapter)getAdapter();

            String dragItem = adapter.getItem(dragSrcPosition);

            adapter.remove(dragItem);

            adapter.insert(dragItem, dragPosition);

            Toast.makeText(getContext(), adapter.getList().toString(), Toast.LENGTH_SHORT).show();

        }

         

    }

10.最终效果图如下：

 

图1

 

图2

      这篇文章也算是前面文章的一个补充和扩展。