1. 程式人生 > >RecyclerView,StaggeredGridLayoutManager瀑布流,CardView的結合使用

RecyclerView,StaggeredGridLayoutManager瀑布流,CardView的結合使用

加入依賴:

   compile 'com.android.support:design:25.0.0'
    compile 'com.android.support:cardview-v7:21.0.3'

直接進入正題看效果:

activity_main:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:background="#060000"
    android:layout_height="match_parent">


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


</LinearLayout>
MainActivity:
package com.youli.snackbar;

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 Main2Activity extends AppCompatActivity {

    private List<Product> data;
    private int[] imgs ={
            R.mipmap.zzz,R.mipmap.ee,R.mipmap.qq,R.mipmap.zzz,
            R.mipmap.ee,R.mipmap.qq,R.mipmap.ww,R.mipmap.ee
            ,R.mipmap.qq,R.mipmap.zzz,R.mipmap.ee,R.mipmap.qq,
            R.mipmap.ww,R.mipmap.ee,R.mipmap.qq,R.mipmap.zzz,
            R.mipmap.ee,R.mipmap.qq,R.mipmap.zzz,R.mipmap.ee};
    private String[] titles ={
            "俠客行","十步殺一人,千里不留行",
            "秋菊為什麼這麼黃","冬梅為什麼這麼白",
            "玫瑰為什麼這麼紅","曉月是個什麼鬼",
            "如花是個什麼花","燕雀是個什麼鳥",
            "青瓷是個什麼瓶","浮萍是個泡沫嗎",
            "翡翠可以吃嗎","紅纓是個什麼梗",
            "踏雪會有腳印的","彩石是用來畫畫的",
            "霓凰會飛嗎","鴛鴦需要打","冷月有多冷",
            "飄雪飄到哪","採蓮我們回家吧",
            "紫苑還在等著我"
    };
    private RecyclerView recyclerView;
    private RecyclerView.LayoutManager mLayoutManager;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        initData();
        initView();
    }

    private void initView() {
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
//        mLayoutManager=new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL); //瀑布流
//        recyclerView.setLayoutManager(mLayoutManager);
        recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));
        MyAdapter adpter  = new MyAdapter(data,Main2Activity.this,R.layout.item_card);
        recyclerView.setAdapter(adpter);
        //分割線類
        SpacesItemDecoration decoration=new SpacesItemDecoration(16);
        recyclerView.addItemDecoration(decoration);

    }


    private void initData() {
        data = new ArrayList<Product>();
        for(int i=0;i<imgs.length;i++){
            Product product = new Product(imgs[i],titles[i]);
            data.add(product);
        }
    }

}
MyAdapter:
package com.youli.snackbar;

/**
 * Created by liutao on 2018/9/11.
 */

import android.support.v7.widget.RecyclerView;
        import android.content.Context;
        import android.support.v7.widget.RecyclerView.ViewHolder;
        import android.view.LayoutInflater;
        import android.view.View;
        import android.view.ViewGroup;
        import android.widget.ImageView;
        import android.widget.TextView;
        import java.util.List;

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.MyHolder> {
    private List<Product> data;
    private Context context;
    private int resouce_id;


    public MyAdapter(List<Product> data, Context context, int resouce_id) {
        this.data = data;
        this.context = context;
        this.resouce_id = resouce_id;
    }


    @Override
    public MyHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(context).inflate(resouce_id,null);
        MyHolder myHolder = new MyHolder(view);
        return myHolder;
    }

    @Override
    public void onBindViewHolder(MyHolder holder, int position) {
        holder.img.setImageResource(data.get(position).getImg());
        holder.title.setText(data.get(position).getTitle());
    }

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

    public class MyHolder extends ViewHolder {
        private TextView title;
        private ImageView img;

        public MyHolder(View view) {
            super(view);
            img = (ImageView) view.findViewById(R.id.img);
            title = (TextView) view.findViewById(R.id.title);
        }
    }
}

adapter 佈局:

item_card:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        android:id="@+id/card_view"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        card_view:cardUseCompatPadding="true"
        card_view:cardCornerRadius="4dp">

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/img"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"/>
    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"/>
        </LinearLayout>
    </android.support.v7.widget.CardView>

</LinearLayout>
實體類Product:
package com.youli.snackbar;


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;
    }
}

簡單的沒話說,大家應該都能看的懂