Android RecyclerView加载复杂布局

用一个RecyclerView实现多种复杂布局，复用机制要保存

• 简书：Android RecyclerView加载复杂布局

• demo源码挂载在码云上面。
  https://git.oschina.net/GoodBaoZi/FuZaJieMianRecyclerViewFuYong/tree/master

• 在开发过程中，特别是电商类的，有时要开发一个很复杂的页面，但是又要性能好，不怎么出现内存问题，所以今天就写一个demo，一来巩固知识，二来给大家一个看看我实现的方式。

1.jpg

---

• 我们先看看两种内存消耗的情况

  
  
  

  gaollg0.GIF
• 第一种是NestedScrollView ，可以看到瞬间内存就增加，然后不停的滑动，加载越来越多的内容，内存消耗越来越大，没用复用机制的缺点。

gaollg1.GIF

• 第二种是只用一个RecyclerView的情况，内存就不会继续上涨了，即使后面再增加内容，内存也是相对稳定。

---

• 比如像这样的布局要求，如果用一个NestedScrollView里面嵌套多个RecyclerView，就能轻松解决，但是随着越用越久，上滑继续加载，越滑动，消耗的内存越多，而且，一进到这个界面，就开始加载全部的图片，有的用户不需要看到最底下的东西，就导致消耗流量。网速慢的情况下，下面的图片内容也在加载，抢占上面的网络资源，就会下面有的图片，比上面先出现，这样体验不好。如果你试试后台给你1000个item，下一子加载出来，小米6都会吃不消的。

• 因为NestedScrollView嵌套的缺点，导致我换一种写法，用一个RecyclerView，多种item，来实现这种布局，一是复用了，内存消耗就小了，然后你滑到哪里，就加载到哪，流量消耗也好一些.

---

• 先看NestedScrollView实现功能

 <android.support.v4.widget.NestedScrollView
        android:id="@+id/nestedScrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <include layout="@layout/item_head"/>

            <include layout="@layout/item_message_1"/>

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recyclerView_image"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recyclerView_product"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <View
                android:layout_width="match_parent"
                android:layout_height="20dp"
                android:background="@color/line_color"/>

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recyclerView_other"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>


        </LinearLayout>

    </android.support.v4.widget.NestedScrollView>

1. 这是NestedScrollView是布局xml，我用的是25.3.1版本，就不会有无法计算里面RecyclerView的高度问题。

//设置滑动惯性
recyclerViewProduct.setNestedScrollingEnabled(false);

2. 要记得RecyclerView要设置恢复滑动惯性，不然上下滑动没有惯性了。

       //GridLayoutManager，垂直方向
        gridLayoutManagerProduct = new GridLayoutManager(this, 3, GridLayoutManager.VERTICAL, false);
       //设置头部占3个，其他占1个
        gridLayoutManagerProduct.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup()
        {
            @Override
            public int getSpanSize(int position)
            {
                if (productAdapter.getItemViewType(position) == ProductAdapter.ITEM_HEAD)
                {
                    return 3;
                } else
                {
                    return 1;
                }
            }
        });

3. 使用网格布局的话，就用setSpanSizeLookup这个 方法，这个不是说每行3个item，你也能写6，然后分组头占6份，他就占满整行宽度了，item写2份，这样的话，就能每行3个item。这个自己去试一试就懂了，就是return 多少，占几份。

        //滑动监听
        nestedScrollView.setOnScrollChangeListener(new NestedScrollView.OnScrollChangeListener()
        {
            @Override
            public void onScrollChange(NestedScrollView v, int scrollX, int scrollY, int oldScrollX, int oldScrollY)
            {
                View view = v.getChildAt(0);
                if (view.getHeight() == scrollY + v.getHeight())
                {
                    //加载更多、增加数据
                    otherAdapter.addData(DataOther.getOtherList());
                }
            }
        });

4.NestedScrollView的滑动监听，判断滑动到底部的方法。

---

• 接下来说重点，就是使用一个RecyclerView来实现复制的布局，主要讲Adapter。

    //头部
    public static final int ITEM_HEAD = 0;
    //信息
    public static final int ITEM_MESSAGE = 1;
    //图片
    public static final int ITEM_IMAGE = 2;
    //还有别类型

1. 首先把这个布局进行拆分，我将它分为 6 种，像“头部”部分，还有“信息”部分，只会出现一次的，其他的就会多出出现，
   其实之前，我是将“头部”和“信息”放一起，但是这个item太大了，超出2个屏幕高度，导致显示不全，原因估计是item的高度计算问题，如果不解决问题，可以把item拆成不大于屏幕高度的大小。

    @Override
    public int getItemViewType(int position)
    {
        if (position == 0)
        {
            //确定第一个是头部
            return ITEM_HEAD;
        } else if (position == 1)
        {
            //确定第二个是信息
            return ITEM_MESSAGE;
        } else if (datas.get(position) instanceof BeanImage)
        {
            return ITEM_IMAGE;
        } else if (datas.get(position) instanceof BeanProduct.BeanData)
        {
            return ITEM_PRODUCT;
        } else if (datas.get(position) instanceof BeanOther)
        {
            return ITEM_OTHER;
        } else
        {
            //确定String用户商品头部
            return ITEM_PRODUCT_HEAD;
        }
    }

2. 在adapter里面，要重写 getItemViewType 这个方法，这个方法呢，就是根据 item 的下标 position 返回对应的 ViewHolder，
   demo可以看到，“头部”和“信息”部分，我能确定他是出现一次，而且位置是固定的，所以，position 为 0 和 1 的时候，我就放回对应的值，其他ViewHolder 我根据对应的数据类型来放回。

   @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType)
    {
        if (viewType == ITEM_HEAD)
        {
            return new HeadViewHolder(LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.item_head, parent, false));
        }
        .
        .        
        //还有别的类型，省略
    }

3. adapter必须重新的 onCreateViewHolder 这个 方法，给我们一个参数 int viewType，这个参数就是上面 getItemViewType 这个方法判断类型后返回的值，我们根据这个值，来 create 对应的 ViewHolder。

    @Override
    public void onAttachedToRecyclerView(RecyclerView recyclerView)
    {
        super.onAttachedToRecyclerView(recyclerView);
        RecyclerView.LayoutManager layoutManager = recyclerView.getLayoutManager();
        if (layoutManager instanceof GridLayoutManager)
        {
            GridLayoutManager gridLayoutManager = (GridLayoutManager) layoutManager;
            gridLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup()
            {
                @Override
                public int getSpanSize(int position)
                {
                    //取多个item的每行占用个数的最小公倍数，
                    //比如item1一行2个，item2一行3个，item3一行1个，就取6
                    //他们对应的return 3，return 2，return 6 
                    if (ITEM_PRODUCT == getItemViewType(position))
                    {
                        return 2;
                    } else if (ITEM_OTHER == getItemViewType(position))
                    {
                        return 3;
                    } else
                    {
                        return 6;
                    }
                }
            });
        }
    }

4. adapter再写一个方法 onAttachedToRecyclerView，这个方法就能获取到RecyclerView ，然后再获取到 对应的LayoutManager，复制的布局，一般都是用网格（GridLayoutManager），或者瀑布流（ StaggeredGridLayoutManager）
   这个看自己的需求了，获取到之后，再根据position对应的ViewHolder，设置他们的占位值（我理解的）。

       //滑动监听
        recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener()
        {
            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState)
            {
                super.onScrollStateChanged(recyclerView, newState);
                //判断是否到底部,offset是滑动距离，Extent是控件高度，range是总的内容高度
                if (recyclerView.getChildCount() > 0
                        && recyclerView.computeVerticalScrollOffset() + recyclerView.computeVerticalScrollExtent()
                        >= recyclerView.computeVerticalScrollRange())
                {
                    detailAdapter.addData(DataOther.getOtherList());
                }
            }
        });

5. 最后来个RecyclerView的滑动到底部，可靠的方法。

---

这个demo用原始的方法，继承 RecyclerView.Adapter ，将方法一个个重写，好处就是让你理解RecyclerView，可以实现复杂的布局复用，缺点就是写起来，有点费时间，不过学习嘛，搞懂了再去用开源框架。
介绍一些可能用的到的
BaseRecyclerViewAdapterHelper：https://github.com/CymChad/BaseRecyclerViewAdapterHelper/wiki/%E9%A6%96%E9%A1%B5

SwipeLayout 滑动(删除)菜单：https://github.com/daimajia/AndroidSwipeLayout
http://blog.csdn.net/yanzhenjie1003/article/details/52115566