RecyclyerView的使用

RecyclerView

RecyclerView可以实现ListView,GridView,瀑布流等效果。使用前先导包:

compile 'com.android.support:design:24.1.1'

一、线性的布局,类似ListView

这里写图片描述

布局设置如下:

//设置布局管理器
        recyclerview.setLayoutManager(new LinearLayoutManager(getActivity()));

还可以为item设置间距:
通过ItemDecoration来设置。

package com.example.xll.recyclerview.utils;

import android.graphics.Rect;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.RecyclerView.ItemDecoration;
import android.view.View;

/**
 * 功能:item的间距
 * 作者:xll
 * 日期:2016/11/14
 * 邮箱:liangliang.xu1110@gmail.com
 */

public class MyItemDecoration extends ItemDecoration {
    private int space;

    public MyItemDecoration(int space) {
        this.space=space;
    }

    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        outRect.left=space;//左
        outRect.right=space;//右
        outRect.bottom=space;//下
        if(parent.getChildAdapterPosition(view)==0){
            outRect.top=space;//上
        }
    }
}

实际使用如下:

//设置item之间的间隔
MyItemDecoration decoration=new MyItemDecoration(8);
recyclerview.addItemDecoration(decoration);

接下来是设置适配器:

/**
     * @功能 Recyclerview适配器
     */
    class LinearAdapter extends RecyclerView.Adapter<LinearAdapter.MyViewHolder> {

        @Override
        public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            MyViewHolder holder = new MyViewHolder(LayoutInflater.from(
                    getActivity()).inflate(R.layout.item_one, parent,
                    false));
            return holder;
        }

        @Override
        public void onBindViewHolder(MyViewHolder holder, final int position) {
            holder.tv.setText(mData.get(position));
            holder.itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    Toast.makeText(getActivity(), "点击了item"+position, Toast.LENGTH_SHORT).show();
                }
            });
        }

        @Override
        public int getItemCount() {
            return mData.size();
        }

        class MyViewHolder extends RecyclerView.ViewHolder {

            TextView tv;

            public MyViewHolder(View view) {
                super(view);
                tv = (TextView) view.findViewById(R.id.textView);
            }
        }
    }

RecyclerView也可以实现不同布局的item:

这里写图片描述

适配器需要做些改动

package com.example.xll.recyclerview.adapter;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import com.example.xll.recyclerview.R;

import java.util.ArrayList;

/**
 * 功能:显示不同布局的RecyclerView的适配器
 * 作者:xll
 * 日期:2016/11/14
 * 邮箱:liangliang.xu1110@gmail.com
 */
public class DifferentItemAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder>{
    private LayoutInflater mLayoutInflater;
    private Context mContext;
    private ArrayList<String> mData;

    //用枚举区分item的类型
    public static enum ITEM_TYPE {
        ITEM_TYPE_IMAGE, ITEM_TYPE_TEXT
    }

    public DifferentItemAdapter(Context context, ArrayList<String> data) {
        mLayoutInflater = LayoutInflater.from(context);
        mContext = context;
        mData = data;
    }


    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //针对不同的item创建对应的ViewHolder
        if (viewType == ITEM_TYPE.ITEM_TYPE_IMAGE.ordinal()) {
            return new FirstViewHolder(mLayoutInflater.inflate(R.layout.item_one, parent, false));
        } else {
            return new TwoViewHolder(mLayoutInflater.inflate(R.layout.item_two, parent, false));
        }
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        //对不同的Item填充数据
        if(holder instanceof FirstViewHolder){
            ((FirstViewHolder) holder).tv1.setText(mData.get(position));
        }else if(holder instanceof TwoViewHolder){
            ((TwoViewHolder) holder).tv2.setText(mData.get(position));
            ((TwoViewHolder) holder).tv3.setText(mData.get(position));
        }
    }

    @Override
    public int getItemCount() {
        return mData==null?0:mData.size();
    }

    @Override
    public int getItemViewType(int position) {
        //对不同item的分布进行控制
        return position % 2 == 0 ? ITEM_TYPE.ITEM_TYPE_IMAGE.ordinal() : ITEM_TYPE.ITEM_TYPE_TEXT.ordinal();
    }

    //item1的ViewHolder
    class FirstViewHolder extends RecyclerView.ViewHolder {

        TextView tv1;

        public FirstViewHolder(View view) {
            super(view);
            tv1 = (TextView) view.findViewById(R.id.textView);
        }
    }

    //item2的ViewHolder
    class TwoViewHolder extends RecyclerView.ViewHolder {

        TextView tv2;
        TextView tv3;

        public TwoViewHolder(View view) {
            super(view);
            tv2 = (TextView) view.findViewById(R.id.textView2);
            tv3 = (TextView) view.findViewById(R.id.textView3);
        }
    }
}

二、网格的布局,类似GridView

这里写图片描述

布局设置如下:

//设置布局管理器
        mRecyclerView.setLayoutManager(new GridLayoutManager(getActivity(),3));

第一个参数传上下文,第二个参数代表网格布局的列数。

适配器和上面线性的RecyclerView类似,这里就不上传了。

三、瀑布流的布局,类似GridView,只是高度随机

这里写图片描述

布局设置如下:

//设置布局管理器
recyclerview.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));

第一个参数是列数,第二个代表垂直方向

高度的随机我写在适配器里:

package com.example.xll.recyclerview.adapter;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import android.widget.Toast;

import com.example.xll.recyclerview.R;

import java.util.ArrayList;
import java.util.List;

/**
 * 功能:瀑布流适配器
 * 作者:xll
 * 日期:2016/11/14
 * 邮箱:liangliang.xu1110@gmail.com
 */

public class StaggeredAdapter extends RecyclerView.Adapter<StaggeredAdapter.MyViewHolder>{

    private LayoutInflater mLayoutInflater;
    private Context mContext;
    private ArrayList<String> mData;
    private List<Integer> mHeights;//随机高度

    public StaggeredAdapter(Context context, ArrayList<String> data) {
        mLayoutInflater = LayoutInflater.from(context);
        mContext = context;
        mData = data;
        mHeights = new ArrayList<>();
    }

    @Override
    public StaggeredAdapter.MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        StaggeredAdapter.MyViewHolder holder = new StaggeredAdapter.MyViewHolder(mLayoutInflater.inflate(R.layout.item_one, parent, false));
        return holder;
    }

    @Override
    public int getItemCount() {
        return mData==null?0:mData.size();
    }

    @Override
    public void onBindViewHolder(StaggeredAdapter.MyViewHolder holder, final int position) {

        // 随机高度, 模拟瀑布效果.
        if (mHeights.size() <= position) {
            mHeights.add((int) (100 + Math.random() * 300));
        }

        ViewGroup.LayoutParams lp = holder.tv.getLayoutParams();
        lp.height = mHeights.get(position);

        holder.tv.setLayoutParams(lp);

        holder.itemView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(mContext, "点击了item"+position, Toast.LENGTH_SHORT).show();
            }
        });

        holder.tv.setText(mData.get(position));
    }

    class MyViewHolder extends RecyclerView.ViewHolder {

        TextView tv;

        public MyViewHolder(View view) {
            super(view);
            tv = (TextView) view.findViewById(R.id.textView);
        }
    }
}

以上就是RecyclerView的基本使用。

Demo下载

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值