简述RecyclerView实现瀑布流并且随机自适应item的高度

我们常见的显示数据的控件listview，下面我简述 一下RecyclerView的使用及简单的现实数据

首先在activity_main.xml中

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

然后我们准备数据，写一个bean，展示一个图片和文字

public class Product {
private int img;
private String title;

public Product(int img, String title) {
this.img = img;
this.title = title;
}

public int getImg() {
return img;
}

public void setImg(int img) {
this.img = img;
}

public String getTitle() {
return title;
}

public void setTitle(String title) {
this.title = title;
}
}

然后我们还需要一个adapter类
public class MasonryAdapter extends RecyclerView.Adapter<MasonryAdapter.MasonryView>{
private List<Product> products;

public MasonryAdapter(List<Product> list) {
products=list;
}

@Override
public MasonryView onCreateViewHolder(ViewGroup viewGroup, int i) {
View view= LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.masonry_item, viewGroup, false);
return new MasonryView(view);
}

@Override
public void onBindViewHolder(MasonryView masonryView, int position) {
masonryView.imageView.setImageResource(products.get(position).getImg());
masonryView.textView.setText(products.get(position).getTitle());

}

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

public static class MasonryView extends RecyclerView.ViewHolder{

ImageView imageView;
TextView textView;

public MasonryView(View itemView){
super(itemView);
imageView= (ImageView) itemView.findViewById(R.id.masonry_item_img );
textView= (TextView) itemView.findViewById(R.id.masonry_item_title);
}

}

}
在activity中添加数据
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private ArrayList<Product> productList=new ArrayList<>();
private int imag[]={R.mipmap.ic_launcher,R.mipmap.a,R.mipmap.s,
R.mipmap.ss,R.mipmap.sss,R.mipmap.ssss,
R.mipmap.sssss,R.mipmap.ssssss};
private String ss[]=new String[imag.length];
private Product product;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
recyclerView= (RecyclerView) findViewById(R.id.recycler);
//设置layoutManager
recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));
//设置adapter
initData();
MasonryAdapter adapter=new MasonryAdapter(productList);
recyclerView.setAdapter(adapter);
//设置item之间的间隔
SpacesItemDecoration decoration=new SpacesItemDecoration(8);
recyclerView.addItemDecoration(decoration);
}
private void initData() {
for (int i = 0; i < imag.length; i++) {
ss[i]="产品"+i;
product = new Product(imag[i],ss[i]);
productList.add(product);

}

}
}


适配器中的v布局就不写了  就一个Imagview和Textview

适配器有了，当然还不行
我们还需要一个ItemDecoration类 来装饰item

简单的调整下距离

public class SpacesItemDecoration extends RecyclerView.ItemDecoration {

private int space;

public SpacesItemDecoration(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;
}
}
}


好了 简单的Recycleview使用就完成了   当然还有更炫酷的样式，后面还会继续写，不喜勿喷~~