點選圖片大圖預覽，RecyclerView + PhotoView 滑動衝突，RecyclerView不回撥SCROLL_STATE_IDLE

S丶Mask發表於2019-03-26
View

如需轉載，請標明原文出處： https://juejin.im/post/5c99b55f6fb9a070cd56a8d3 ，謝謝。

背景

最近專案需要整合一個點選圖片大圖預覽的功能。網上很多都是ViewPager + PhotoView的形式；這次想換個姿勢，使用了 RecyclerView + PhotoView的方式，其中主要是RecyclerView的PagerSnapHelper來實現模擬ViewPager的翻頁效果。

問題

開發過程中，其他的倒是一切正常，主要遇到以下兩個問題：

  1. PhotoView雙指放大 和 RecyclerView左右滑動 衝突，本來是想雙指放大PhotoView，結果RecyclerView滑動了；
  2. 為實現ViewPager的onPageSelected監聽效果，給RecyclerView增加onScrollStateChanged監聽來判斷當前顯示的item，使用中發現當快速滾動到第一個時，SCROLL_STATE_IDLE狀態不會被回撥。

解決

1. 針對第一個問題，目前的思路是自定義RecyclerView

判斷是否是多點觸控，是的話就放行給子PhotoView處理，不是就RecyclerView處理。但是這樣會有一個問題，就是兩個或者三個或更多手指在螢幕上時就沒辦法左右滑動RecyclerView了。但是我也覺得無所謂，畢竟應該沒有人用多個手指去左右翻頁。。。
程式碼如下：

/**
 * 圖片預覽 RecyclerView
 * Create By lishilin On 2019/3/25
 */
public class PreviewRecyclerView extends RecyclerView {

    private boolean isLock;// 是否鎖住 RecyclerView ，避免和 PhotoView 雙指放大縮小操作衝突

    public PreviewRecyclerView(@NonNull Context context) {
        super(context);
    }

    public PreviewRecyclerView(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public PreviewRecyclerView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent event) {
        switch (event.getActionMasked()) {
            case MotionEvent.ACTION_POINTER_DOWN:// 非第一個觸點按下
                isLock = true;
                break;
            case MotionEvent.ACTION_UP:// 最後一個觸點抬起
                isLock = false;
                break;
        }
        if (isLock) {
            return false;// 不攔截，交給子View處理
        }
        return super.onInterceptTouchEvent(event);
    }

    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        switch (event.getActionMasked()) {
            case MotionEvent.ACTION_POINTER_DOWN:// 非第一個觸點按下
                isLock = true;
                break;
            case MotionEvent.ACTION_UP:// 最後一個觸點抬起
                isLock = false;
                break;
        }
        return super.dispatchTouchEvent(event);
    }

}
複製程式碼

2. 針對第二個問題，暫時發現兩種解決辦法。

  1. 在onScrollStateChanged回撥中不判斷state狀態，這樣就繞過了SCROLL_STATE_IDLE的問題，但是會一直執行程式碼，需要注意效率問題，特別是耗時操作，避免卡頓。
    程式碼如下：
        rv_photo.addOnScrollListener(new RecyclerView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(@NonNull RecyclerView recyclerView, int newState) {
                super.onScrollStateChanged(recyclerView, newState);
                View view = snapHelper.findSnapView(layoutManager);
                if (view == null) {
                    return;
                }
                int position = layoutManager.getPosition(view);
                if (lastPosition == position) {
                    return;
                }
                lastPosition = position;
                refreshCountTips(lastPosition);
                PhotoPreviewRecyclerAdapter.ViewHolder holder = (PhotoPreviewRecyclerAdapter.ViewHolder) rv_photo.getChildViewHolder(view);
                if (holder == null || holder.img_content == null) {
                    return;
                }
                if (holder.img_content.getScale() != 1f) {
                    holder.img_content.setScale(1f, true);
                }
            }
        });
複製程式碼
  1. 在上面的回撥中正常加入SCROLL_STATE_IDLE的判斷，但是需要手動呼叫recyclerView.stopScroll()方法。
                if (newState != RecyclerView.SCROLL_STATE_IDLE) {
                    return;
                }
複製程式碼
        rv_photo.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getActionMasked()) {
                    case MotionEvent.ACTION_UP:
                        if (rv_photo.getScrollState() == RecyclerView.SCROLL_STATE_IDLE) {
                            break;
                        }
                        View view = snapHelper.findSnapView(layoutManager);
                        if (view == null) {
                            break;
                        }
                        int position = layoutManager.getPosition(view);
                        if (position != 0) {
                            break;
                        }
                        if (rv_photo.getChildAt(0).getX() == 0 && rv_photo.canScrollHorizontally(1)) {
                            rv_photo.stopScroll();
                        }
                        break;
                }
                return false;
            }
        });
複製程式碼

相關文章