如何实现让RecyclerView有不同尺寸的item

如何实现让RecyclerView有不同尺寸的item

     我们的项目开发中有一个需求是这样的:我们左边有一排关键字,用户用遥控器滑动到某个关键字后,后边就要求出相应的搜索结果,搜索结果是一个gridView,一般情况下,gridView每行排列着是4个相同尺寸的item,但是针对特殊的搜索结果的item要求,每行排列2个。

分析:

(1) 可不可以用GridView实现呢?

     我们都知道GridView的每个布局的宽和高必须是一样的,(HeadView咱们就不考虑了)。用gridView的方式基本可以放弃了。

(2) 用gridLayout实现呢?

    gridLayout有合并单元格的功能,倒是可以满足基本的样式,但是搜索结果一多,由于gridLayout没有复用功能,所以这种方案也可以放弃了。

下面介绍我最新研究出来的方案,用RecyclerView来实现,原理很简单,利用的是GridLayoutManager.SpanSizeLookup这个类来实现,该类是一个抽象类,里面有个getSpanSize()的抽象方法。这个方法理解起来比抽象,我先贴出我的代码,后面会

慢慢再详细解释。 

 

package tv.lesports.com.myrecyclerview;

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.DefaultItemAnimator;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.View;


import java.util.ArrayList;

/**
 * Created by liuyu8 on 2016/5/3.
 */
public class RecyclerViewActivity extends Activity {
    private RecyclerView mRecyclerView;
    private HomeAdapter mAdapter;
    private ArrayList<SearchResultBean> mDataList;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.recyclerview_layout);
        initData();
        mRecyclerView = (RecyclerView) findViewById(R.id.id_recyclerview);
        GridLayoutManager manager = new GridLayoutManager(this, 4);
        manager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
            @Override
            public int getSpanSize(int position) {
               SearchResultBean bean = mDataList.get(position);
                if (bean.getType() == 0) {
                    return 4;
                } else if(bean.getType() == 1){
                    return 2;
                }else{
                    return 1;
                }
            }
        });
        mRecyclerView.setLayoutManager(manager);
        mRecyclerView.setItemAnimator(new DefaultItemAnimator());
        mAdapter = new HomeAdapter(this, mDataList);
        mRecyclerView.setAdapter(mAdapter);
    }

    protected void initData() {
        mDataList = new ArrayList<SearchResultBean>();
        for (int i = 0; i < 50; i++) {
            SearchResultBean bean = new SearchResultBean();
            bean.setName(i + "");
            if (i == 0) {
                bean.setType(0);
            } else if (i > 0 && i <= 5) {
                bean.setType(1);
            } else {
                bean.setType(2);
            }
            mDataList.add(bean);
        }
    }
}

 

 上面代码中,RecyclerView的方向是垂直的,它由通过一个TotalspanSize为4的GridLayout实现的,getSpanSize方法中有一个参数是position,我们可以等价的通过LinearLayout中weight来理解该方法,假设Recycler是一个线性布局,TotalSpan等同于总的weight值,getSpanSize(int position)代表的是位置为position的item宽度占RecyclerView总宽度的weight值。

上面代码的意思等同于:

(1)position = 0 的item的weight值为4,所以position等于0的item宽等于RecyclerView的宽度

(2)position范围在(0,5]的item的weight值为2,所以position范围在(0,5]的item的宽度为RecyclerView宽度的1/2

(3)position(5,50)的item的weight值为1,所以position范围在(5,50)的item的宽度为RecyclerView宽度的1/4

注明:忽略item之间的padding值。

 

效果图如下: 


 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值