RecycleView 实现瀑布流效果

1、用as开发,在build.gradle中添加依赖

dependencies {
        ...
        compile 'com.android.support:recyclerview-v7:21.0.3'
    }

2、用Eclipse开发,添加jar包


3、在xml布局文件中添加一个recycleview的布局



4、activity的oncreate方法中添加如下关键代码

View view = inflater.inflate(R.layout.card_recycleview, null);
card_recycler_view = (RecyclerView) view.findViewById(R.id.card_recycler_view);
card_recycler_view.setHasFixedSize(false);
StaggeredGridLayoutManager mStaggeredGridLayoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);//表示两列,并且是竖直方向的瀑布流
card_recycler_view.setLayoutManager(mStaggeredGridLayoutManager);

5、创建recycleview的数据适配器


public class RenQiAdapter2 extends RecyclerView.Adapter implements View.OnClickListener {

    private List data;//填充数据的集合
    protected ImageLoader imageLoader = ImageLoader.getInstance();//采用universal imageloader来加载图片

    public RenQiAdapter2(List data) {
        this.data = data;
    }

    public void setData(List data) {
        this.data = data;
    }

    @Override
    public RenQiAdapter2.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.card_store_detail_item, viewGroup, false);
        ViewHolder vh = new ViewHolder(view);
        view.setOnClickListener(this);
        return vh;
    }

    @Override
    public void onBindViewHolder(final RenQiAdapter2.ViewHolder viewHolder, final int i) {
        viewHolder.itemView.setTag(data.get(i));
        viewHolder.iv_store.setImageResource(R.drawable.whitebottom);
        viewHolder.iv_store.setTag(data.get(i).getCoverUrl());
        imageLoader.loadImage(data.get(i).getCoverUrl(), BaseConstants.optionscopy, new ImageLoadingListener() {
            @Override
            public void onLoadingStarted(String s, View view) {

            }

            @Override
            public void onLoadingFailed(String s, View view, FailReason failReason) {

            }

            @Override
            public void onLoadingComplete(String imgUrl, View view, Bitmap bitmap) {
                if (viewHolder.iv_store.getTag() != null
                        && viewHolder.iv_store.getTag().equals(imgUrl)) {
                    //此处代码获取屏幕的宽高,实现不同屏幕的适配
                    int width = BaseApplication.getWindowWidth() / 2;
                    int height = width * bitmap.getHeight() / bitmap.getWidth();//高通过宽等比例缩放
                    RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                            width, height);
                    viewHolder.iv_store.setLayoutParams(params);
                    viewHolder.iv_store.setImageBitmap(bitmap);

                    viewHolder.tv_date.setText("总销"
                            + data.get(i).getSale() + "件");
                    viewHolder.tv_price.setText("¥ "
                            + CommonUtils.getShortPrice(
                            data.get(i).getSalePrice(),
                            2));
                }
            }

            @Override
            public void onLoadingCancelled(String s, View view) {

            }
        });
    }

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

    @Override
    public void onClick(View v) {
        if (null != mOnItemClickListener) {
            mOnItemClickListener.onClick(v, (StoreContent) v.getTag());
        }
    }

    //创建一个viewholder类
    public static class ViewHolder extends RecyclerView.ViewHolder {
        ImageView iv_store;
        TextView tv_date;
        TextView tv_price;

        public ViewHolder(View itemView) {
            super(itemView);
            iv_store = (ImageView) itemView.findViewById(R.id.iv_store);
            tv_date = (TextView) itemView.findViewById(R.id.tv_date);
            tv_price = (TextView) itemView.findViewById(R.id.tv_price);
        }
    }

    private OnRecyclerViewItemClickListener mOnItemClickListener = null;

    public void setOnItemClickListener(OnRecyclerViewItemClickListener listener) {
        this.mOnItemClickListener = listener;
    }

    public static interface OnRecyclerViewItemClickListener {
        void onClick(View view, StoreContent itemData);
    }
}

注:recycleview的数据适配器,继承RecycleView.Adapter的子类,此处继承的是我在本类中定义的ViewHolder。强制重写的方法:

onCreateViewHolder(),onBindViewHolder(),和getItemCount();

在onCreateViewHolder(),方法中,需要返回,与当前adapter绑定的viewholder;

在onBindViewHolder()方法中,将数据填充到控件中;

getItemCont()的作用与listview的adapter方法中的getItemCount()一样。


6、给RecycleView添加adapter

if (null == rebateAdapter) {
            rebateAdapter = new RebateAdapter(activity, value);
            card_staggeredgridview.setAdapter(rebateAdapter);
            card_staggeredgridview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                @Override
                public void onItemClick(AdapterView parent, View view, int position, long id) {
                    RebateDetail item = (RebateDetail) card_staggeredgridview.getAdapter().getItem(position);
                    ...
                }
            });
        } else {
            rebateAdapter.setData(value);
            rebateAdapter.notifyDataSetChanged();
        }

7、RecycleView仿造listview的onItemClick方法

7.1在adapter中定义一个接口,和抽象方法;

public static interface OnRecyclerViewItemClickListener {
        void onClick(View view, StoreContent itemData);
    }
7.2在adapter中定义一接口对象,并添加set方法;

 private OnRecyclerViewItemClickListener mOnItemClickListener = null;

    public void setOnItemClickListener(OnRecyclerViewItemClickListener listener) {
        this.mOnItemClickListener = listener;
    }

7.3adapter类实现View的onClickListener接口,重写抽象方法
public class RenQiAdapter2 extends RecyclerView.Adapter implements View.OnClickListener {
.......
@Override
    public void onClick(View v) {
        if (null != mOnItemClickListener) {
            mOnItemClickListener.onClick(v, (StoreContent) v.getTag());
        }
    }
}
7.4 在bindviewholder方法中,将数据传递给view

 @Override
    public void onBindViewHolder(final RenQiAdapter2.ViewHolder viewHolder, final int i) {
    ......
    viewHolder.itemView.setTag(data.get(i));
    ......
}

7.5 给recycleview添加onitemclick方法

 card_staggeredgridview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                @Override
                public void onItemClick(AdapterView parent, View view, int position, long id) {
                    RebateDetail item = (RebateDetail) card_staggeredgridview.getAdapter().getItem(position);
                    Intent intent = new Intent(activity, BaoBeiDetailActivity.class);
                    intent.putExtra("itemid", item.getItemId());
                    intent.putExtra("clickPostion", position);
                    activity.startActivity(intent);
                    activity.overridePendingTransition(R.anim.tran_in, R.anim.tran_out);
                }
            });

8、RecycleView 的数据更新

listview中更新数据,通过的方法是notifyDataSetChanged()

RecycleView中,可以只更新一条数据

在adapter类中,定义如下方法;可以在其他地方调用

public void changeData(int position){
        notifyItemChanged(position);
    }

    public void addData(int position){
        notifyItemInserted(position);
    }
    public void removeData(int position){
        notifyItemRemoved(position);
    }





你可能感兴趣的:(Android)