Android自定义View实现可以拖拽的GridView

先看看效果图

主要思想:

1、监听触碰事件
2、用WindowManager添加拖曳的图片
3、用Collections.swap()交换List数据

自定义代码:

public class DragGridVeiw extends GridView {

  private final int PRESS_TIME = 1000;//长按时间

  private int mDownX;//触碰时的X坐标
  private int mDownY;//触碰时的Y坐标
  private int mMoveX;//移动时的X坐标
  private int mMoveY;//移动时的Y坐标

  private int mOffset2Top;//DragGridView距离屏幕顶部的偏移量
  private int mOffset2Left;//DragGridView距离屏幕左边的偏移量
  private int mPointToItemTop;//触碰点距离ItemView的上边距
  private int mPointToItemLeft;//触碰点距离ItemView的左边距
  private int mStatusHeight;//状态栏高度

  private boolean isDraging;//是否正在拖曳

  private Bitmap mBitmap;//ItemView的图片
  private int mTouchPostiion;//触碰的位置
  private View mTouchItemView;//触碰的ItemView

  private Vibrator mVibrator;//震动器
  private ImageView mDragImageView;//拖曳的View
  private WindowManager mWindowManager;//窗口管理器
  private WindowManager.LayoutParams mWindowLayoutParams;//窗口管理器布局

  private OnChanageListener onChanageListener;//交换事件监听器

  private Handler mHandler = new Handler();

  public DragGridVeiw(Context context) {
    this(context, null);
  }

  public DragGridVeiw(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
  }

  public DragGridVeiw(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    mStatusHeight = getStatusHeight(context);
    mVibrator = (Vibrator) context.getSystemService(Context.VIBRATOR_SERVICE);
    mWindowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
  }

  @Override
  public boolean dispatchTouchEvent(MotionEvent ev) {
    switch (ev.getAction()) {
      case MotionEvent.ACTION_DOWN:
        //使用Handler延迟dragResponseMS执行mLongClickRunnable
        mHandler.postDelayed(mLongClickRunnable, PRESS_TIME);

        mDownX = (int) ev.getX();
        mDownY = (int) ev.getY();

        //根据按下的X,Y坐标获取所点击item的position
        mTouchPostiion = pointToPosition(mDownX, mDownY);

        if (mTouchPostiion == AdapterView.INVALID_POSITION) {
          return super.dispatchTouchEvent(ev);
        }

        //根据position获取该item所对应的View
        mTouchItemView = getChildAt(mTouchPostiion - getFirstVisiblePosition());

        //下面这几个距离大家可以参考我的博客上面的图来理解下
        mPointToItemTop = mDownY - mTouchItemView.getTop();
        mPointToItemLeft = mDownX - mTouchItemView.getLeft();

        mOffset2Top = (int) (ev.getRawY() - mDownY);
        mOffset2Left = (int) (ev.getRawX() - mDownX);

        //开启mDragItemView绘图缓存
        mTouchItemView.setDrawingCacheEnabled(true);
        //获取mDragItemView在缓存中的Bitmap对象
        mBitmap = Bitmap.createBitmap(mTouchItemView.getDrawingCache());
        //这一步很关键,释放绘图缓存,避免出现重复的镜像
        mTouchItemView.destroyDrawingCache();

        break;
      case MotionEvent.ACTION_MOVE:
        int moveX = (int) ev.getX();
        int moveY = (int) ev.getY();

        //拖曳点超出GridView区域则取消拖曳事件
        if (ev.getY() > getHeight() || ev.getY() < 0) {
          onStopDrag();
        }

        //如果我们在按下的item上面移动,只要超过item的边界就移除mRunnable
        if (!isTouchInItem(mTouchItemView, moveX, moveY)) {
          mHandler.removeCallbacks(mLongClickRunnable);
        }
        break;
      case MotionEvent.ACTION_UP:
        mHandler.removeCallbacks(mLongClickRunnable);
        break;
    }
    return super.dispatchTouchEvent(ev);
  }

  @Override
  public boolean onTouchEvent(MotionEvent ev) {
    if (isDraging && mDragImageView != null) {
      switch (ev.getAction()) {
        case MotionEvent.ACTION_MOVE:
          mMoveX = (int) ev.getX();
          mMoveY = (int) ev.getY();
          //拖动item
          onDragItem(mMoveX, mMoveY);
          break;
        case MotionEvent.ACTION_UP:
          onStopDrag();

          break;
      }
      return true;
    }
    return super.onTouchEvent(ev);
  }

  //处理长按事件的线程
  private Runnable mLongClickRunnable = new Runnable() {
    @Override
    public void run() {
      isDraging = true; //设置可以拖拽
      mVibrator.vibrate(50); //震动一下
      mTouchItemView.setVisibility(View.INVISIBLE);//隐藏该ItemView

      //根据我们按下的点显示ItemView镜像
      createDragView(mBitmap, mDownX, mDownY);
    }
  };

  //添加拖动View
  private void createDragView(Bitmap bitmap, int downX, int downY) {
    mWindowLayoutParams = new WindowManager.LayoutParams();
    mWindowLayoutParams.format = PixelFormat.TRANSLUCENT; //图片之外的其他地方透明
    mWindowLayoutParams.gravity = Gravity.TOP | Gravity.LEFT;
    mWindowLayoutParams.x = downX - mPointToItemTop + mOffset2Left;
    mWindowLayoutParams.y = downY - mPointToItemTop + mOffset2Top - mStatusHeight;
    mWindowLayoutParams.alpha = 0.6f; //透明度
    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 removeDragView() {
    if (mDragImageView != null) {
      mWindowManager.removeView(mDragImageView);
      mDragImageView = null;
    }
  }

  //是否点击在GridView的item上面
  private boolean isTouchInItem(View dragView, int x, int y) {
    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;
  }

  //拖动事件处理
  private void onDragItem(int moveX, int moveY) {
    mWindowLayoutParams.x = moveX - mPointToItemLeft + mOffset2Left;
    mWindowLayoutParams.y = moveY - mPointToItemTop + mOffset2Top - mStatusHeight;
    mWindowManager.updateViewLayout(mDragImageView, mWindowLayoutParams); //更新DragView的位置
    onSwapItem(moveX, moveY);//Item的相互交换
  }

  //交换item,并且控制item之间的显示与隐藏效果
  private void onSwapItem(int moveX, int moveY) {
    //获取我们手指移动到的那个item的position
    int tempPosition = pointToPosition(moveX, moveY);

    //假如tempPosition 改变了并且tempPosition不等于-1,则进行交换
    if (tempPosition != mTouchPostiion && tempPosition != AdapterView.INVALID_POSITION) {
      getChildAt(tempPosition - getFirstVisiblePosition()).setVisibility(View.INVISIBLE);//拖动到了新的item,新的item隐藏掉
      getChildAt(mTouchPostiion - getFirstVisiblePosition()).setVisibility(View.VISIBLE);//之前的item显示出来

      if (onChanageListener != null) {
        onChanageListener.onChange(mTouchPostiion, tempPosition);
      }

      mTouchPostiion = tempPosition;
    }
  }

  //停止拖拽我们将之前隐藏的item显示出来,并将DragView移除
  private void onStopDrag() {
    isDraging = false;
    getChildAt(mTouchPostiion - getFirstVisiblePosition()).setVisibility(View.VISIBLE);
    removeDragView();
  }

  //Item交换事件监听
  public void setOnChangeListener(OnChanageListener onChanageListener) {
    this.onChanageListener = onChanageListener;
  }

  //获取状态栏高度
  private 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;
  }

  //当item交换位置的时候回调的方法,我们只需要在该方法中实现数据的交换即可
  public interface OnChanageListener {
    public void onChange(int from, int to);
  }
}

使用方法:

   List<HashMap<String, Object>> dataSourceList = new ArrayList<>();

    dragVeiw = (DragGridVeiw) findViewById(R.id.view_drag);

    for (int i = 0; i < 8; i++) {
      HashMap<String, Object> itemHashMap = new HashMap<>();
      itemHashMap.put("item_image", R.drawable.sample_1);
      itemHashMap.put("item_text", "拖拽 " + Integer.toString(i));
      dataSourceList.add(itemHashMap);
    }

    final SimpleAdapter mSimpleAdapter = new SimpleAdapter(this, dataSourceList,
        R.layout.item_drag, new String[]{"item_image", "item_text"},
        new int[]{R.id.item_image, R.id.item_text});

    dragVeiw.setAdapter(mSimpleAdapter);

    dragVeiw.setOnChangeListener(new DragGridVeiw.OnChanageListener() {
      @Override
      public void onChange(int from, int to) {
        HashMap<String, Object> temp = dataSourceList.get(from);
        //这里的处理需要注意下
        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();
      }
    });

附录:

Log.v("-->getWidth", String.valueOf(getWidth()));//DragView的宽度
Log.v("-->getHeight", String.valueOf(getHeight()));//DragView的高度
Log.v("-->getLeft", String.valueOf(getLeft()));//DragView左边距离屏幕左侧的长度
Log.v("-->getTop", String.valueOf(getTop()));///DragView上边距离屏幕顶部的长度
Log.v("-->getRawX", String.valueOf(ev.getRawX()));//触碰点相对于屏幕的X坐标
Log.v("-->getRawY", String.valueOf(ev.getRawY()));//触碰点相对于屏幕的Y坐标
Log.v("-->getX", String.valueOf(ev.getX()));//触碰点相对于DragView的X坐标
Log.v("-->getY", String.valueOf(ev.getY()));//触碰点相对于DragView的Y坐标

Log.v("-->getItemWidth", String.valueOf(mTouchItemView.getWidth()));//DragView中ItemView的宽度
Log.v("-->getItemHeight", String.valueOf(mTouchItemView.getHeight()));//DragView中ItemView的高度
Log.v("-->getItemLeft", String.valueOf(mTouchItemView.getLeft()));//DragView中ItemView左边距离DragView左侧的长度
Log.v("-->getItemTop", String.valueOf(mTouchItemView.getTop()));//DragView中ItemView上边距离DragView顶部的长度

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • 基于Android实现随手指移动的ImageView

    ImageView用来显示任意图像图片,可以自己定义显示尺寸,显示颜色等等. 运行效果是这样的(文字说明): 首次进入程序,手指点击屏幕上的任意位置,图片会随之移动. 布局文件 <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="

  • Android中View跟随手指移动效果

    最近做了一个项目中,其中遇到这样的需求要求图片移动到手指触碰的地方.具体实现代码如下所示: package com.example.plane; import Android.app.Activity; import android.os.Bundle; import android.util.DisplayMetrics; import android.view.Display; import android.view.KeyEvent; import android.view.Menu; i

  • android ListView和GridView拖拽移位实现代码

    关于ListView拖拽移动位置,想必大家并不陌生,比较不错的软件都用到如此功能了.如:搜狐,网易,百度等,但是相比来说还是百度的用户体验较好,不偏心了,下面看几个示例:             首先说一下:拖拽ListView的item就不应该可以任意移动,只应该在ListView所在的范围内,而网易的你看看我都可以移动到状态栏了,虽然你做了处理,但是用户体验我个人感觉不好,在看看百度的,不仅控制了移动范围,更不错的百度的移动起来会时时的换位,看起来相当的形象,所以我认为这样相当的棒.说明一点

  • Android recyclerview实现拖拽排序和侧滑删除

    Recyclerview现在基本已经替代Listview了,RecyclerView也越来越好用了  当我们有实现条目的拖拽排序和侧滑删除时  可以直接时候Recyclerview提供的API就可以直接实现了 先贴上主要代码 private void initveiw() { ArrayList<String> items = new ArrayList<>(Arrays.asList("itme1", "item2", "itme

  • Android 自定义可拖拽View界面渲染刷新后不会自动回到起始位置

    以自定义ImageView为例: /** * 可拖拽ImageView * Created by admin on 2017/2/21. */ public class FloatingImageView extends ImageView{ public FloatingImageView(Context context) { super(context); } public FloatingImageView(Context context, AttributeSet attrs) { su

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

    GridView基础 新建一个HelloGridView的工程 修改main.xml代码如下: <?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/gridview" android:layout_width=&q

  • Android实现View拖拽跟随手指移动效果

    今天想实现这个功能,但是网上搜索代码,都是利用setPadding,setMargin 等方法去实现的,这在Android 4.0 以前是没问题的,但是,android 4.0 后系统已经提供了更简单的方法给我们用了,就是setTranslationX() 和setTranslationY() .这两个是View的属性方法.现在我就用这两个方法实现一个View可以跟着手指移动拖拽的效果.代码非常非常简单: public class DragView extends TextView { floa

  • Android自定义View实现可以拖拽的GridView

    先看看效果图 主要思想: 1.监听触碰事件 2.用WindowManager添加拖曳的图片 3.用Collections.swap()交换List数据 自定义代码: public class DragGridVeiw extends GridView { private final int PRESS_TIME = 1000;//长按时间 private int mDownX;//触碰时的X坐标 private int mDownY;//触碰时的Y坐标 private int mMoveX;//

  • Android自定义View实现可拖拽缩放的矩形框

    本文实例为大家分享了Android自定义View拖拽缩放矩形框的具体代码,供大家参考,具体内容如下 在开发项目中,需要一个矩形框来实现截屏功能,并且还需要可以任意拖拽和缩放,这就需要自定义View来实现了,具体功能如下: 1.自定义View package com.xinrui.screenshot.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color

  • Android自定义View绘图实现拖影动画

    前几天在"Android绘图之渐隐动画"一文中通过画线实现了渐隐动画,但里面有个问题,画笔较粗(大于1)时线段之间会有裂隙,我又改进了一下.这次效果好多了. 先看效果吧: 然后我们来说说基本的做法:  •根据画笔宽度,计算每一条线段两个顶点对应的四个点,四点连线,包围线段,形成一个路径.  •后一条线段的路径的前两个点,取(等于)前一条线段的后两点,这样就衔接起来了. 把Path的Style修改为FILL,效果是这样的: 可以看到一个个四边形,连成了路径. 好啦,现在说说怎样根据两点计

  • Android自定义View实现拖拽效果

    腾讯QQ有那种红点拖动效果,今天就来实现一个简单的自定义View拖动效果,再回到原处,并非完全仿QQ红点拖动. 先来看一下效果图 简单说一下实现步骤 1.创建一个类继承View 2.绘制出一个小球 3.重写onTouchEvent,来根据手指放下,移动,抬起,来控制小球 4.直接在布局中引用 先贴一张图看下View的坐标系 下面就贴一下代码,最后会给出源码 public class CustomView extends View { private int lastX; private int

  • Android Activity通用悬浮可拖拽View封装的思路详解

    目录 1,背景 2,思路 2.1,封装通用的基础悬浮View 2.1,继承通用View 2.3,设计view的控制器 2.4,view的添加和使用 1,背景 在开发中总会遇到一个可拖拽的悬浮View,不管是在开发中,还是在线上,都时长有这样的控件,我们通常遇到这种情况,经常需要自己封装,需要耗费时间,我这边封装了一个可以通用的悬浮可拖拽View,这样使用的时候,只需要传入自己要设计的样式和位置既可 2,思路 2.1,封装通用的基础悬浮View 设计通用的父View 1,传入的childView是

  • Android自定义View绘制贝塞尔曲线中小红点的方法

    目录 前言 需求 效果图 代码 主要问题 简单画法 使用贝塞尔曲线 前言 上一篇文章用扇形图练习了一下安卓的多点触控,实现了单指旋转.二指放大.三指移动,四指以上同时按下进行复位的功能.今天这篇文章用很多应用常见的小红点,来练习一下贝塞尔曲线的使用. 需求 这里想法来自QQ的拖动小红点取消显示聊天条数功能,不过好像是记忆里的了,现在看了下好像效果变了.总而言之,就是一个小圆点,拖动的时候变成水滴状,超过一定范围后触发消失回调,核心思想如下: 1.一个正方形view,中间是小红点,小红点距离边框有

  • Android自定义View实现支付宝支付成功-极速get花式Path炫酷动画

    本文手把手教你图片->SVG->Path的姿势.. 从此酷炫Path动画,如此简单. 效果先随便上几个图,以后你找到的图有多精彩,gif就有多精彩: 随便搜了一个铅笔画的图,丢进去 随手复制的二维码icon 来自大佬wing的铁塔 前文回顾 这里简单回顾一下前文,GIF如下图: PathAnimView接受的唯一数据源是Path(给我一个Path,还你一个动画View) 所以内置了几种将别的资源->Path的方法: 直接传string.(A-Z,0-9 "." &qu

  • Android实现可拖拽的GridView效果长按可拖拽删除数据源

    Android 可拖拽的GridView效果实现, 长按可拖拽和item实时交换 简单修改,完成自己想要的功能:长按,移到垃圾桶,删除数据. 主要思路是: 1.获取到用户长按的操作 2.获取按下的图片的bitmap以及移动的时候动态刷新镜像 3 action_up的时候判断镜像的位置,进入是否删除逻辑 自定义控件 package com.leafact.GridView; import android.app.Activity; import android.content.Context; i

  • Android用RecyclerView实现图标拖拽排序以及增删管理

    1. 效果图 2. 基本的功能 在非编辑状态下可以直接点击图标进行跳转 在编辑状态可以拖拽.添加.删除操作 已被添加过的不能再次添加 3. 实现的思路 用两个RecyclerView实现,同时维护两个数据源,上部是常用应用,最多可以放8个:下部是全部应用. 1. 每个应用图标的状态用枚举Option表示 // 当前的操作状态 enum class Option { ADD, REMOVE, NONE } 2. 在处于编辑状态时创建ItemTouchHelper对象并attch到RecyclerV

  • android自定义View圆圈拖动

    本文实例为大家分享了android自定义View圆圈拖动的具体代码,供大家参考,具体内容如下 问题: 1 . 累加问题:"点击坐标"坐标在移动时必须改变位置,不然将导致累加过载 2. 圆形改变问题,每次刷新时圆必将改变位置 3. 图片平移:圆在移动时只要 public class MovingBlockView extends View { //画笔 Paint paint = new Paint(); Region circleRegion; Path circlePath; pri

随机推荐