Android RecyclerView实现瀑布流

先上图这里写图片描述

  1. 首页记得导包com.android.support:recyclerview-v7:24.0.0-alpha1
  2. 布局代码
  <android.support.v7.widget.RecyclerView
       android:id="@+id/recyclerview"
       android:divider="#ffff0000"
       android:dividerHeight="10dp"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       ></android.support.v7.widget.RecyclerView>
RecylerView item的布局代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/item"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#ffffff"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/masonry_item_img"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop" />

    <TextView
        android:id="@+id/masonry_item_title"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:gravity="center" />


</LinearLayout>
  • 接下来是MainActivity 代码:
package com.example.animate.recyclerview;
import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.View;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends Activity {
    private RecyclerView mRecyclerView;
    private List<Product> mDatas;
    int[] shuzu = new int[]{R.mipmap.item, R.mipmap.item2, R.mipmap.item3, R.mipmap.item4, R.mipmap.item5, R.mipmap.item6,
            R.mipmap.item7, R.mipmap.item8, R.mipmap.item9, R.mipmap.item10, R.mipmap.item11};
    String[] str = new String[]{"hdauihd", "Dafd", "大駕光臨", "收費", "讓人感動", "扔他", "繞道", "我聽過", "各位", "哥啊", "感動"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.content_main);

        mRecyclerView = (RecyclerView) findViewById(R.id.recyclerview);
        mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));//设置成瀑布流布局
        initdata();
        MasonryAdapter adapter = new MasonryAdapter(this,mDatas);
        mRecyclerView.setAdapter(adapter);
        //设置item之间的间隔
        SpacesItemDecoration spacesItemDecoration = new SpacesItemDecoration(16);
        mRecyclerView.addItemDecoration(spacesItemDecoration);
        //瀑布流的点击事件
        adapter.setOnItemClickLitener(new MasonryAdapter.OnItemClickLitener() {
            @Override
            public void onItemClick(View view, int position) {
           System.out.println(position);
            }

            @Override
            public void onItemLongClick(View view, int position) {

            }
        });
    }
    public void initdata() {
        mDatas=new ArrayList<>();
        for (int i = 0; i < shuzu.length - 1; i++) {
            mDatas.add(new Product(shuzu[i], str[i]));

        }
    }

}
  • RecyclerView 适配器代码:
package com.example.animate.recyclerview;

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.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

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


/**
 * Created by Administrator on 2016/3/31 0031.
 */
public class MasonryAdapter extends RecyclerView.Adapter<MasonryAdapter.MasonryView> {

    private List<Product> products;
    private List<Integer> heights;

    Context context;

    public MasonryAdapter(Context context, List<Product> list) {
        this.context = context;
        products = list;
        getRandomHeight(list);

    }
    public interface OnItemClickLitener{
        void onItemClick(View view,int position);
        void onItemLongClick(View view ,int position);
    }
    private  OnItemClickLitener monTtemClickLitener;
    public void setOnItemClickLitener(OnItemClickLitener monTtemClickLitener){
        this.monTtemClickLitener=monTtemClickLitener;
    }

    @Override
    public MasonryView onCreateViewHolder(ViewGroup parent, int viewType) {

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item, parent, false);

        return new MasonryView(view);
    }

    @Override
    public void onBindViewHolder(final MasonryView holder, int position) {

        holder.imageView.setImageResource(products.get(position).getImg());
          holder.textView.setText(products.get(position).getTitle());


        // 如果设置了回调,则设置点击事件
        if (monTtemClickLitener!=null){
            holder.itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    int pos=holder.getLayoutPosition();
                    monTtemClickLitener.onItemClick(holder.itemView,pos);

                }
            });
            holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View v) {
                    int pos=holder.getLayoutPosition();
                    monTtemClickLitener.onItemLongClick(holder.itemView,pos);
                    return false;
                }
            });
        }

        ViewGroup.LayoutParams params=holder.imageView.getLayoutParams();
        params.height = heights.get(position);//把随机的高度赋予itemView布局
        holder.imageView.setLayoutParams(params);//把params设置给itemView布局



    }

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

    public static class MasonryView extends RecyclerView.ViewHolder {

        ImageView imageView;
        TextView textView;
        LinearLayout linearLayout;

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

        }

    }

    private void getRandomHeight(List<Product> lists) {//得到随机item的高度

        heights = new ArrayList<>();

        for (int i = 0; i < lists.size(); i++) {

            heights.add((int) (200 + Math.random() * 400));

        }

    }


}
  • SpacesItemDecoration代码:
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) {
        super.getItemOffsets(outRect, view, parent, state);

        outRect.left=space;
        outRect.right=space;
        outRect.bottom=space;
        if(parent.getChildAdapterPosition(view)==0){
            outRect.top=space;
        }
    }
}
  • Product是一个实体类:
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;
    }

}

点击事件是在适配器里面设置回调的;

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值