RecyclerView的基本用法

来源：互联网发布：linux查看文件所有者编辑：程序博客网时间：2024/05/12 21:33

使用之前的准备工作首先打开build.gradle 文件,在dependencies的节点之内添加如下内容:

dependencies {    compile fileTree(dir: 'libs', include: ['*.jar'])    compile 'com.android.support:appcompat-v7:24.2.1'    compile 'com.android.support:recyclerview-v7:24.2.1'    testCompile 'junit:junit:4.12'}

接下来需要准备一个适配器,新建一个FruitAdapter类,让这个适配器继承RecyclerView.Adapter ,并将泛型指定为 FruitAdapter.ViewHolder.其中 ViewHolder 是我们在FruitAdapter 中定义一个内部类.

FruitAdapter 代码如下:

public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {    private List<Fruit> mFruitList;    static class ViewHolder extends RecyclerView.ViewHolder {        ImageView mImage;        TextView mText;View fruitView;        public ViewHolder(View itemView) {            super(itemView);            mImage = (ImageView) itemView.findViewById(R.id.image);            mText = (TextView) itemView.findViewById(R.id.text);            fruitView = itemView;        }    }    public FruitAdapter(List<Fruit> fruitList) {        mFruitList = fruitList;    }    @Override    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_fruit, null);        final ViewHolder holder = new ViewHolder(view);        holder.fruitView.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                int position = holder.getAdapterPosition();                Fruit fruit = mFruitList.get(position);                Toast.makeText(v.getContext(), "你点击了 " + fruit.getName(), Toast.LENGTH_SHORT).show();            }        });        holder.mImage.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                int position = holder.getAdapterPosition();                Fruit fruit = mFruitList.get(position);                Toast.makeText(v.getContext(), "点击 " + fruit.getName(), Toast.LENGTH_SHORT).show();            }        });        return holder;    }    @Override    public void onBindViewHolder(ViewHolder holder, int position) {        Fruit fruit = mFruitList.get(position);        holder.mImage.setImageResource(fruit.getImageId());        holder.mText.setText(fruit.getName());    }    @Override    public int getItemCount() {        return mFruitList.size();    }}

这里我们首先定义一个内部类ViewHolder,ViewHolder要继承 RecyclerView.ViewHolder, 然后ViewHolder的构造函数中传入一个 View 参数,这个参数通常就是RecyclerView 子项的最外层布局.我们就可以通过findViewById()方法获取布局中的 imageView和TextView的实例. 接下来往下看,FruitAdapter 中也有一个构造方法,这个方法用于把数据源传进来,并赋值给一个全局变量mFruitList, 我们后续的操作都将在这个数据源的基础上进行. 继续往下看,由于FruitAdapter 继承自RecyclerView.Adapter的 ,那么必须重写 onCreateViewHolder(), onBindViewHolder(), 和 getItemCount() 这3个方法.
onCreateViewHolder() 用于创建 viewholder 实例,我们这个方法将子项布局加载进来,然后创建一个 viewholder 实例,并把加载进来的布局传入到构造方法中,最后将 viewholder的实例返回.
onBindViewHolder(),是用于对 RecyclerView 子项的数据进行赋值的,会在每个子项滚动到屏幕内的时候执行,这里我们通过 position 参数得到当前项的Fruit实例,然后再将数据设置到 ViewHolder的ImageView和ImageView当中即可.
getItemCount() 直接返回数据源的长度.

MainActivity 代码如下:

public class MainActivity extends AppCompatActivity {    RecyclerView mRecyclerView;    private List<Fruit> mFruitList = new ArrayList<>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mRecyclerView = (RecyclerView) findViewById(R.id.recycler_view);        initFruit();//  1. 横向列表        LinearLayoutManager layoutManager = new LinearLayoutManager(this);        layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL); //加上这句 就可以设置水平方向        mRecyclerView.setLayoutManager(layoutManager);        //2. 瀑布流//        StaggeredGridLayoutManager staggeredGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);//        mRecyclerView.setLayoutManager(staggeredGridLayoutManager);        FruitAdapter fruitAdapter = new FruitAdapter(mFruitList);        mRecyclerView.setAdapter(fruitAdapter);    }    private void initFruit() {        for (int i = 0; i < 20; i++) {            Fruit apple = new Fruit(getRandomName("苹果"), R.mipmap.apple_pic);            mFruitList.add(apple);            Fruit banana = new Fruit(getRandomName("Banana"), R.mipmap.banana_pic);            mFruitList.add(banana);            Fruit orange = new Fruit(getRandomName("Orange"), R.mipmap.orange_pic);            mFruitList.add(orange);            Fruit watermelon = new Fruit(getRandomName("Watermelon"), R.mipmap.watermelon_pic);            mFruitList.add(watermelon);            Fruit pear = new Fruit(getRandomName("Pear"), R.mipmap.pear_pic);            mFruitList.add(pear);            Fruit grape = new Fruit(getRandomName("Strawberry"), R.mipmap.grape_pic);            mFruitList.add(grape);            Fruit pineapple = new Fruit(getRandomName("Strawberry"), R.mipmap.pineapple_pic);            mFruitList.add(pineapple);            Fruit strawberry = new Fruit(getRandomName("Strawberry"), R.mipmap.strawberry_pic);            mFruitList.add(strawberry);            Fruit cherry = new Fruit(getRandomName("Cherry"), R.mipmap.cherry_pic);            mFruitList.add(cherry);            Fruit mango = new Fruit(getRandomName("Mango"), R.mipmap.mango_pic);            mFruitList.add(mango);        }    }    private String getRandomName(String name) {        Random random = new Random();        int length = random.nextInt(5) + 1;        StringBuilder builder = new StringBuilder();        for (int i = 0; i < length; i++) {            builder.append(name);        }        return builder.toString();    }}

这里使用了一个initFruit() 方法,用于初始化所有的数据,,然后创建一个 LinearLayoutManager对象,并将它设置到 RecyclerView当中. LayoutManager 用于指定RecyclerView 的布局方式, 这里使用的是LinearLayoutManager是线性布局的意思.可以实现和 ListView类似的效果.

实现横向的滚动和瀑布流布局

实现横向的布局调用LinearLayoutManager的setOrientation() 方法来设置布局的排列方式,默认是纵向排列的.我们传入的LinearLayoutManager.HORIZONTAL 表示让布局横向排列.

另外除了LinearLayoutManager 之外, RecyclerView 还给我们提供了GridLayoutManager(网格布局) 和 StaggedGridLayoutManager(瀑布流布局).
我们创建一个 StaggedGridLayoutManager 的实例. 该构造函数接收2个参数,第一个参数用于指定布局的列数, 传入数字X 就代表是X列. 第二个参数用于指定布局的排列方向,传入StaggeredGridLayoutManager.VERTICAL 表示让布局纵向排列,最后再把创建好的实例设置到 RecyclerView 当中,就可以啦

Fruit的实例对象

public class Fruit {    private  String name;    private int imageId;    public Fruit(String name, int imageId) {        this.name = name;        this.imageId = imageId;    }    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    public int getImageId() {        return imageId;    }    public void setImageId(int imageId) {        this.imageId = imageId;    }}

activity_main.xml 布局文件

<?xml version="1.0" encoding="utf-8"?><RelativeLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    >    <android.support.v7.widget.RecyclerView        android:id="@+id/recycler_view"        android:layout_width="match_parent"        android:layout_height="match_parent"/></RelativeLayout>

item_fruit.xml 布局文件

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:layout_width="match_parent"              android:layout_height="match_parent"             android:padding="5dp"              android:orientation="vertical">    <ImageView        android:id="@+id/image"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center_horizontal"        android:background="@mipmap/apple_pic"/>    <TextView        android:id="@+id/text"        android:background="#3322aa"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="left"        android:text="水果"        android:layout_marginTop="8dp"        android:textSize="20sp"/></LinearLayout>

item_fruit_layout.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:layout_width="match_parent"              android:layout_height="match_parent"              android:gravity="center"              android:orientation="horizontal">    <ImageView        android:id="@+id/image"        android:layout_marginLeft="100dp"        android:background="@mipmap/ic_launcher"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/>    <TextView        android:id="@+id/text"        android:text="水果"        android:gravity="center"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:textSize="20sp"/></LinearLayout>

横向滑动的效果

像listview一样的效果

0 0