RecyclerView实现瀑布流

在使用完了RecyclerView实现完ListView和gridView效果之后,就开始尝试着实现瀑布流的效果,看了好多篇大神的博客,我也终于实现了效果,哈哈哈哈哈哈。就记录一下…

先来看一下我实现完之后的效果吧

一、添加依赖,必备…

implementation 'com.android.support:recyclerview-v7:28.0.0'

二、实例化RecyclerView、设置布局管理器、设置适配器、设置数据等一系列操作

		mRecyclerView = findViewById(R.id.recyclerView);
        //生命为瀑布流的布局方式,3列,布局方向为垂直
        StaggeredGridLayoutManager manager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
        //解决item跳动
        //manager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
        mRecyclerView.setLayoutManager(manager);
        initData();
        MyAdapter adapter = new MyAdapter(MainActivity.this, data);
        mRecyclerView.setAdapter(adapter);
        
        private void initData() {
        Bean bean;
        for (int i = 0; i < 10; i++) {
            bean = new Bean("美女" + i, R.mipmap.image1);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image2);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image3);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image4);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image5);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image6);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image7);
            data.add(bean);
        }

三、适配器的实现
新建一个类,继承自RecyclerView.Adapter写完之后一路Alt+回车重写方法再去实现,其实跟实现lisview效果没啥不同,就直接贴代码

package com.example.xiaofeiwa.recyclerviewtostaggeredgrid;

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

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

class MyAdapter extends RecyclerView.Adapter {

    private final Context context;
    private final List data;

    public MyAdapter(Context context, List data) {
        this.context = context;
        this.data = data;
    }

    @NonNull
    @Override
    public ItemHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
        //创建
        //找到item
        View view = LayoutInflater.from(context).inflate(R.layout.item, viewGroup, false);
        //将布局设置给holder
        return new ItemHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ItemHolder itemHolder, int position) {
        //将数据设置到item上
        Bean bean = data.get(position);
        itemHolder.text.setText(bean.getName());
        itemHolder.image.setImageResource(bean.getImage());
    }

    @Override
    public int getItemCount() {
        if (this.data != null) {
            return data.size();
        }
        return 0;
    }

    public class ItemHolder extends RecyclerView.ViewHolder {

        private final ImageView image;
        private final TextView text;

        public ItemHolder(@NonNull View itemView) {
            super(itemView);
            text = itemView.findViewById(R.id.text);
            image = itemView.findViewById(R.id.image);
        }
    }
}

再就是Item布局文件




    

    

再贴一下MainActivity全部代码

package com.example.xiaofeiwa.recyclerviewtostaggeredgrid;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;

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

public class MainActivity extends AppCompatActivity {

    private RecyclerView mRecyclerView;
    List data = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mRecyclerView = findViewById(R.id.recyclerView);
        //生命为瀑布流的布局方式,3列,布局方向为垂直
        StaggeredGridLayoutManager manager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
        //解决item跳动
        //manager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
        mRecyclerView.setLayoutManager(manager);
        initData();
        MyAdapter adapter = new MyAdapter(MainActivity.this, data);
        mRecyclerView.setAdapter(adapter);
    }

    private void initData() {
        Bean bean;
        for (int i = 0; i < 10; i++) {
            bean = new Bean("美女" + i, R.mipmap.image1);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image2);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image3);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image4);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image5);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image6);
            data.add(bean);
            bean = new Bean("美女" + i, R.mipmap.image7);
            data.add(bean);
        }
    }
}

还有一个简单的工具类

package com.example.xiaofeiwa.recyclerviewtostaggeredgrid;

public class Bean {
    private String name;
    private int image;

    public Bean(String name, int image) {
        this.name = name;
        this.image = image;
    }

    public String getName() {
        return name;
    }

    public int getImage() {
        return image;
    }

}

你可能感兴趣的:(Android)