解決RecyclerView嵌套RecyclerView位移問題

一、概述
??最近項目中用到了兩個RecyclerView嵌套的布局,即RecyclerView的item也是RecyclerView,其中遇到了兩個比較典型的問題:1、當item的方向是垂直方向時,父RecyclerView首次加載會出現位移;2、當item的方向是水平方向時,父RecyclerView上下滑動之后,子RecyclerView位置會還原,本文主要解決以上兩個問題。我們先來瞄一眼這兩個問題的效果圖:

修復前.gif

可以明顯的看到當item的Recyclerview是垂直方向時,打開頁面時“title1”不見了;當item的Recyclerview是水平方向時,我們把 Inner Title1-x和 Inner Title2-x滑動一定距離之后,上下滑動父Recyclerview,Inner Title1-x和 Inner Title2-x的位置又還原了。

二、解決
??2.1 首先解決垂直嵌套問題,這個比較簡單,主要是子Recyclerview搶占焦點導致,我們只需要讓其父布局獲取焦點即可解決,完整代碼如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:tools="http://schemas.android.com/tools"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:gravity="center_vertical"
              android:orientation="vertical"
              android:paddingLeft="14dp"
              android:paddingRight="14dp"
              android:focusableInTouchMode="true"
              android:focusable="true"
    >

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="20dp"
        android:paddingBottom="20dp"
        android:layout_gravity="center_vertical"
        android:layout_marginRight="30dp"
        android:gravity="center"
        android:maxLines="1"
        android:textColor="#333333"
        android:textSize="18sp"
        tools:text="2017-06"/>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/rv_item"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#fff"
        />
</LinearLayout>

關鍵代碼就是這兩句:

android:focusableInTouchMode="true"
android:focusable="true"

完整源碼我已經提交到GitHub,布局參見:item_vertical.xml,后面會提供倉庫地址。

2.2 解決水平嵌套,父Recyclerview上下滑動位置還原問題。該問題的解決思路比較清晰:1.設置Recyclerview的滑動監聽,每次滑動結束,記錄滑動位置,包括position和offset;2.調用LinearLayoutManager.scrollToPositionWithOffset()方法滑動到上一次記錄的位置即可。所以解決問題的關鍵點就在于計算滑動的position和offset,關鍵代碼如下:

        @Override
        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
            super.onScrollStateChanged(recyclerView, newState);
            switch (newState) {
                case RecyclerView.SCROLL_STATE_IDLE:

                    int offset = recyclerView.computeHorizontalScrollOffset();
                    mEntity.scrollPosition = mLayoutManager.findFirstVisibleItemPosition() < 0 ? mEntity.scrollPosition : mLayoutManager.findFirstVisibleItemPosition() + 1;
                    if (mItemWidth <= 0) {
                        View item = mLayoutManager.findViewByPosition(mEntity.scrollPosition);
                        if (item != null) {
                            RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) item.getLayoutParams();
                            mItemWidth = item.getWidth();
                            mItemMargin = layoutParams.rightMargin;
                        }
                    }
                    if (offset > 0 && mItemWidth > 0) {
                        //offset % mItemWidth:得到當前position的滑動距離
                        //mEntity.scrollPosition * mItemMargin:得到(0至position)的所有item的margin
                        //用當前item的寬度-所有margin-當前position的滑動距離,就得到offset。
                        mEntity.scrollOffset = mItemWidth - offset % mItemWidth + mEntity.scrollPosition * mItemMargin;
                    }
                    break;
            }
        }

position的計算比較簡單,直接調用 :

LinearLayoutManager.findFirstVisibleItemPosition() + 1

即可,而offset的計算要稍微復雜一點,計算公式如下:

    //offset % mItemWidth:得到當前position的滑動距離
    //mEntity.scrollPosition * mItemMargin:得到(0至position)的所有item的margin
    //用當前item的寬度-所有margin-當前position的滑動距離,就得到offset。
    mEntity.scrollOffset = mItemWidth - offset % mItemWidth + mEntity.scrollPosition * mItemMargin;

至此,滑動的position和offset已經全部獲取到,接下來只需要調用如下代碼,即可恢復到上一次滑動的位置,解決位置還原問題。

layoutManager.scrollToPositionWithOffset(item.scrollPosition, item.scrollOffset);

完整代碼如下,對應HorizontalAdapter.class:


public class HorizontalAdapter extends BaseQuickAdapter<Entity, BaseViewHolder> {

    public static final String TAG = HorizontalAdapter.class.getSimpleName();

    public HorizontalAdapter(List<Entity> data) {
        super(R.layout.item_horizontal, data);
    }

    @Override
    protected void convert(BaseViewHolder helper, Entity item) {
        helper.setText(R.id.tv_title, item.title);
        final RecyclerView recyclerView = helper.getView(R.id.rv_item);
        final LinearLayoutManager layoutManager = new LinearLayoutManager(mContext);
        layoutManager.setOrientation(OrientationHelper.HORIZONTAL);
        recyclerView.setLayoutManager(layoutManager);
        InnerAdapter innerAdapter = new InnerAdapter(item.innerEntities);
        recyclerView.setAdapter(innerAdapter);
        if (item.scrollOffset > 0) {
            layoutManager.scrollToPositionWithOffset(item.scrollPosition, item.scrollOffset);
        }
        recyclerView.addOnScrollListener(new MyOnScrollListener(item, layoutManager));
    }


    private class MyOnScrollListener extends RecyclerView.OnScrollListener {

        private LinearLayoutManager mLayoutManager;
        private Entity mEntity;
        private int mItemWidth;
        private int mItemMargin;

        public MyOnScrollListener(Entity shopItem, LinearLayoutManager layoutManager) {
            mLayoutManager = layoutManager;
            mEntity = shopItem;
        }

        @Override
        public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
            super.onScrolled(recyclerView, dx, dy);
        }

        @Override
        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
            super.onScrollStateChanged(recyclerView, newState);
            switch (newState) {
                case RecyclerView.SCROLL_STATE_IDLE:

                    int offset = recyclerView.computeHorizontalScrollOffset();
                    mEntity.scrollPosition = mLayoutManager.findFirstVisibleItemPosition() < 0 ? mEntity.scrollPosition : mLayoutManager.findFirstVisibleItemPosition() + 1;
                    if (mItemWidth <= 0) {
                        View item = mLayoutManager.findViewByPosition(mEntity.scrollPosition);
                        if (item != null) {
                            RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) item.getLayoutParams();
                            mItemWidth = item.getWidth();
                            mItemMargin = layoutParams.rightMargin;
                        }
                    }
                    if (offset > 0 && mItemWidth > 0) {
                        //offset % mItemWidth:得到當前position的滑動距離
                        //mEntity.scrollPosition * mItemMargin:得到(0至position)的所有item的margin
                        //用當前item的寬度-所有margin-當前position的滑動距離,就得到offset。
                        mEntity.scrollOffset = mItemWidth - offset % mItemWidth + mEntity.scrollPosition * mItemMargin;
                    }
                    break;
            }
        }
    }


    private class InnerAdapter extends BaseQuickAdapter<Entity.InnerEntity, BaseViewHolder> {

        public InnerAdapter(List<Entity.InnerEntity> datas) {
            super(R.layout.item_horizontal_inner, datas);
        }

        @Override
        protected void convert(final BaseViewHolder helper, final Entity.InnerEntity item) {

            helper.setText(R.id.title, item.innerTitle);
            ((ImageView) helper.getView(R.id.iv)).setImageResource(item.innerImageId);
        }

    }
}

來瞄一眼解決問題后的效果圖:

修復后.gif

三、總結
??由于時間關系(其實就是懶),不想寫adapter的重復代碼,所以直接用的BaseRecyclerViewAdapterHelper,感謝作者提供的優秀框架,如果是自己寫adapter代碼,只需要把convert的代碼在onBindViewHolder()中實現即可。

完整工程下載

喜歡就star一下吧,如果有啥問題歡迎在issue或者評論里面反饋。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,094評論 25 708
  • 簡介: 提供一個讓有限的窗口變成一個大數據集的靈活視圖。 術語表: Adapter:RecyclerView的子類...
    酷泡泡閱讀 5,212評論 0 16
  • 這篇文章分三個部分,簡單跟大家講一下 RecyclerView 的常用方法與奇葩用法;工作原理與ListView比...
    LucasAdam閱讀 4,413評論 0 27
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,792評論 1 92
  • 經常可以看到有良心、有責任的同仁呼吁把艾灸神闕、關元列為臨床急救技術。但很少有醫院去做,因為艾灸不賺錢,十把艾灸的...
    金葉艾灸閱讀 1,106評論 0 0