RecyclerView瀑布流啊流

瀑布流,又稱瀑布流式佈局。是比較流行的一種網站頁面佈局,視覺表現爲參差不齊的多欄佈局,隨着頁面滾動條向下滾動,這種佈局還會不斷加載數據塊並附加至當前尾部。最早採用此佈局的網站是Pinterest,逐漸在國內流行開來。國內大多數清新站基本爲這類風格。

今天就教大家用RecyclerView實現瀑布流
下面是瀑布流的效果 很實用
在這裏插入圖片描述
1.首先不得不說的是依賴
在這裏插入圖片描述
2.佈局頁面就是一個RecyclerView 包名+類名
在這裏插入圖片描述
3.使用OKGO請求接口數據
在這裏插入圖片描述
4.解析數據
在這裏插入圖片描述
5.適配器

public class GoodAdapter extends RecyclerView.Adapter<GoodAdapter.GoodViewHoider> {

    ArrayList<GoodBean.NewslistBean> list;
    private Context context;

    public GoodAdapter(ArrayList<GoodBean.NewslistBean> list, Context context) {
        this.list = list;
        this.context = context;
    }

    @NonNull
    @Override
    public GoodViewHoider onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {

        View inflate = LayoutInflater.from(context).inflate(R.layout.good_item, viewGroup, false);

        GoodViewHoider goodViewHoider = new GoodViewHoider(inflate);

        return goodViewHoider;
    }
    @Override
    public void onBindViewHolder(@NonNull GoodViewHoider goodViewHoider, int i) {
        goodViewHoider.tvTitle.setText(list.get(i).getTitle());
        Glide.with(context).load(list.get(i).getPicUrl()).into(goodViewHoider.ivImage);

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

    class GoodViewHoider extends RecyclerView.ViewHolder {

        @BindView(R.id.tv_title)
        TextView tvTitle;
        @BindView(R.id.iv_image)
        ImageView ivImage;

        public GoodViewHoider(@NonNull View itemView) {
            super(itemView);
            ButterKnife.bind(this, itemView);
        }
    }
}

6.佈局管理器(重中之重)
在這裏插入圖片描述

這次是使用RecyclerView瀑布流的正確姿勢

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章