仿Smartisan OS图库快速选择功能

2015-11-24

Smartisan OS图库快速选择功能描述

使用Smartisan OS的用户应该都知道图库有个快速选择功能，用户在编辑模式下，可以滑动选中图片。这个功能当时发布会时，老罗也拿出来当作亮点功能说的，确实这个功能在使用上手之后，对于批量删除操作，是很赞的。在深入分析这个功能之后，发现里面涉及到很多内容，在此先分解下它的功能细节:

只有横向滑动才会触发快速选择图片模式，为了避免与竖滑滚动操作冲突
一开始滑动时，到第二个位置才会将第一个和第二个位置下的图片一起进行操作（选中或清除），此后都是滑到哪个位置操作到哪个位置（滑动方向没有变化的情况）
如果滑动方向改变了（例如本来的方向是朝着位置不断变大滑，突然转向，朝着位置变小滑，此时认为它滑动方向变化），然后就是对上一个位置进行操作
如果滑动到的位置与上一个位置之差绝对值大于1，则需要对两个位置中间的位置进行操作，如果有转向，则传入的位置参数也会有不同
滑动到屏幕上下边界的时候，视图会自动滚动
可以记录每一次滑动的初始目的，是要进行选中还是清除操作，如果进行的是选中操作，则在滑动过程中遇到已经选中的图片，就不会对它进行清除操作

功能实现

下面就针对这个快速选择功能，记录下我的实现过程

第一步:手势操作

实现这个功能的第一步就是识别我们手在屏幕上滑动，并且知道实时的位置在哪里。Android自带的GestureDetector类可以帮助我们实现监听手势操作，在初始化时，创建GestureDetector对象:

1	gestureDetector = new GestureDetector(this, new FastSelectGestureListener());

FastSelectGestureListener是继承GestureDector.SimpleOnGestureListener，实现手势监听的一个类，并且重写了onDown和onScroll方法，onDown方法在手指落下接触屏幕的时候只调用一个，而onScroll方法是在手指滑动的时候不断调用，直到手指离开屏幕结束此次手势操作。在这两个方法里，也是进行图片操作的具体逻辑。

给recyclerView添加OnItemTouchListener监听，并且在onInterceptTouchEvent方法里，添加手势触摸事情，让系统去接收，具体代码如下:

gestureDetector.onTouchEvent(e);
if (e.getAction() == MotionEvent.ACTION_UP) {
    dragSelectEnable = false;
}
if (dragSelectEnable) {
    recyclerView.stopScroll();
}
return false;

第二步:找到当前手指触摸位置下的view和position

在RecyclerView里，findChildViewUnder方法可以通过坐标来获得View，具体实现如下:

1	View view = recyclerView.findChildViewUnder(e.getX(), e.getY());

e是MotionEvent。
当null != view情况下，可以通过getChildAdapterPosition()方法获取view在adapter里的position:

1	position = recyclerView.getChildAdapterPosition(view);

第三步:具体逻辑实现

onDown方法初始化参数

每一次手势操作，都需要对于参数进行重新赋值，具体代码如下:

View view = recyclerView.findChildViewUnder(e.getX(), e.getY());
if (null != view) {
    initialPosition = recyclerView.getChildAdapterPosition(view);
    lastPosition = initialPosition;
    selectInitialPositionFlag = true;
    positionFlag = false;
    positionTrend = 0;
}
return super.onDown(e);

只有横向滑动才能激活选择图片操作

因为竖向滑动是对recyclerView进行滚动，所以只有横向滑动才能激活快速选择模式，否则不对图片进行操作:

//only horizontal gesture can active drag select image mode
if (Math.abs(e1.getX() - e2.getX()) > FAST_SELECT_ACTIVE_X_DISTANCE && Math.abs(e1.getY() - e2.getY()) < FAST_SELECT_ACTIVE_Y_DISTANCE) {
    dragSelectEnable = true;
} else {
    if (!dragSelectEnable)
        return false;
}

其中FAST_SELECT_ACTIVE_X_DISTANCE和FAST_SELECT_ACTIVE_Y_DISTANCE分别是激活快速选择模式X轴和Y轴位移的阀值，

每一次转向对于一些参数都要重新赋值

由于每一次转向，都需要传入不同的位置参数给performGalleryItemCheck方法，所以需要对参数进行重置:

//positionFlag updates when gesture direction is changed
if (((position - lastPosition) > 0 && positionTrend <= 0)
        || ((position - lastPosition) < 0 && positionTrend >= 0)) {
    positionFlag = !positionFlag;
    selectOrClearFlag = adapter.getItemSelectedState(lastPosition);
    positionTrend = position - lastPosition;
    selectInitialPositionFlag = true;
}

进行选择操作

一共分为以下三种情况:

当前位置与上一个位置之差绝对值为1
当前位置减去上一个位置大于1
当前位置减去上一个位置小于1

分成三种情况，也就是三种情况分别传入的位置参数都是不同的，具体代码如下:

if (Math.abs(lastPosition - position) == 1) {
    if (position == initialPosition) {
        performGalleryItemCheck(initialPosition);
    }
    if (positionFlag) {
        performGalleryItemCheck(position);
        //check initialPosition only once when everytime starting drag select image
        if (selectInitialPositionFlag && Math.abs(position - initialPosition) == 1) {
            performGalleryItemCheck(initialPosition);
            selectInitialPositionFlag = false;
        }
    } else {
        performGalleryItemCheck(lastPosition);
    }
} else if ((lastPosition - position) > 1) {
    if (positionFlag) {
        for (int i = position; i < lastPosition; i++) {
            performGalleryItemCheck(i);
        }
    } else {
        for (int i = position + 1; i <= lastPosition; i++) {
            performGalleryItemCheck(i);
        }
    }
} else {
    if (positionFlag) {
        for (int i = lastPosition + 1; i <= position; i++) {
            performGalleryItemCheck(i);
        }
    } else {
        for (int i = lastPosition; i < position; i++) {
            performGalleryItemCheck(i);
        }
    }
}
// update lastPosition
lastPosition = position;

添加自动滚动

当手势操作在上下边界时，实现自动滚动的进行选择的效果。

RecylerViewAutoScrollHelper类继承了AutoScrollHelper类，传入recyclerView作为这个helper的对象，具体实现代码如下:

RecyclerViewAutoScrollHelper helper = 
          new RecyclerViewAutoScrollHelper(recyclerView);
recyclerView.setOnTouchListener(helper);
helper.setEnabled(true);

在RecyclerViewAutoScrollHelper类里，让recyclerView实现自动滚动，并且控制滚动的速度。

Demo地址

具体的代码，已经开源到GitHub，如有兴趣，请通过这个链接查看，谢谢观看。