RecyclerView與CardView的基礎使用

本文主要介紹RecyclerView和CardView的基礎使用，首先說下RecyclerView實現(xiàn)ListView、GridView和瀑布流的功能，其次談下RecyclerView與CardView的結合使用。

在build.gradle中添加依賴

compile 'com.android.support:recyclerview-v7:25.0.1'
compile 'com.android.support:cardview-v7:25.0.1'

基本使用方法

RecyclerView的xml布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary">

    <android.support.v7.widget.RecyclerView
         android:id="@+id/swipe_target"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         android:background="@color/C_E2E4E4"
         android:scrollbars="none"/>

</RelativeLayout>

1.作為ListView使用

//數(shù)據(jù)源
lists = new ArrayList<String>();
mRecyclerView = (RecyclerView)findViewById(R.id.swipe_target);
//創(chuàng)建默認的線性LayoutManager
mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);
//如果可以確定每個item的高度是固定的，設置這個選項可以提高性能
mRecyclerView.setHasFixedSize(true);
//創(chuàng)建并設置Adapter
mAdapter = new ItemAdapter(this, lists);
mRecyclerView.setAdapter(mAdapter);

2.作為GridView使用

//數(shù)據(jù)源
lists = new ArrayList<String>();
mRecyclerView = (RecyclerView)findViewById(R.id.swipe_target);
//創(chuàng)建默認的GridLayoutManager
mLayoutManager = new GridLayoutManager(this, 2);
mRecyclerView.setLayoutManager(mLayoutManager);
//如果可以確定每個item的高度是固定的，設置這個選項可以提高性能
mRecyclerView.setHasFixedSize(true);
//創(chuàng)建并設置Adapter
mAdapter = new ItemAdapter(this, lists);
mRecyclerView.setAdapter(mAdapter);

RecyclerView作為Listview、GridView使用的Adapter

public class ItemAdapter extends RecyclerView.Adapter<ItemAdapter.ItemViewHolder> implements View.OnClickListener, View.OnLongClickListener {

    private Context mContext;
    private List<String> datas = null;

    public ItemAdapter(Context context, List<String> lists){
        mContext = context;
        this.datas = lists;
    }

    //創(chuàng)建新View，被LayoutManager所調用
    @Override
    public ItemViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(mContext).inflate(R.layout.linearlayout_item, parent, false);

        ItemViewHolder holder = new ItemViewHolder(view);
        //view注冊事件
        view.setOnClickListener(this);
//        view.setOnLongClickListener(this);

        return holder;
    }

    //將數(shù)據(jù)與界面進行綁定的操作
    @Override
    public void onBindViewHolder(ItemViewHolder holder, int position) {
        //將數(shù)據(jù)保存在itemView的Tag中，以便點擊時進行獲取
        holder.itemView.setTag(datas.get(position));
        //控制綁定數(shù)據(jù)
        holder.text.setText(datas.get(position));
    }

    //獲取數(shù)據(jù)的數(shù)量
    @Override
    public int getItemCount() {
        return datas.size();
    }

    //自定義的ViewHolder, 持有每個Item的的所有界面元素
    static class ItemViewHolder extends RecyclerView.ViewHolder{

        private TextView text;

        public ItemViewHolder(View view){
            super(view);
            text = (TextView)view.findViewById(R.id.item_tv);
        }
    }

    //定義Item點擊事件
    public  interface OnRecyclerViewItemClickListener{
        //點擊事件
        void onItemClick(View view, String str);
        //長按事件
        void onItemLongClick(View view, String str);
    }

    private OnRecyclerViewItemClickListener mOnItemClickListener;

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

    //點擊事件
    @Override
    public void onClick(View v) {
        if(mOnItemClickListener != null){
            mOnItemClickListener.onItemClick(v, (String)v.getTag());
        }
    }

    //長按事件
    @Override
    public boolean onLongClick(View v) {
        if(mOnItemClickListener != null){
            mOnItemClickListener.onItemLongClick(v, (String)v.getTag());
        }
        return false;
    }
}

3.作為瀑布流樣式使用

//數(shù)據(jù)源
lists = new ArrayList<String>();
mRecyclerView = (RecyclerView)findViewById(R.id.swipe_target);
//創(chuàng)建默認的StaggeredGridLayoutManager
mLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
mRecyclerView.setLayoutManager(mLayoutManager);
//如果可以確定每個item的高度是固定的，設置這個選項可以提高性能
mRecyclerView.setHasFixedSize(true);
//創(chuàng)建并設置Adapter
mAdapter = new StaggeredAdapter(this, lists);
mRecyclerView.setAdapter(mAdapter);

RecyclerView作為瀑布流使用的Adapter

public class StaggeredAdapter extends RecyclerView.Adapter<StaggeredAdapter.StaggeredViewHolder> implements View.OnClickListener, View.OnLongClickListener {

    private Context mContext;
    private List<String> datas = null;

    public StaggeredAdapter(Context context, List<String> lists){
        mContext = context;
        this.datas = lists;
    }

    //創(chuàng)建新View，被LayoutManager所調用
    @Override
    public StaggeredViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(mContext).inflate(R.layout.linearlayout_item, parent, false);

        StaggeredViewHolder holder = new StaggeredViewHolder(view);
        //view注冊事件
        view.setOnClickListener(this);
//        view.setOnLongClickListener(this);

        return holder;
    }

    //將數(shù)據(jù)與界面進行綁定的操作
    @Override
    public void onBindViewHolder(StaggeredViewHolder holder, int position) {
        //將數(shù)據(jù)保存在itemView的Tag中，以便點擊時進行獲取
        holder.itemView.setTag(datas.get(position));
        //控制綁定數(shù)據(jù)
        holder.text.setText(datas.get(position));
        //更改高度，不同位置高度不同
        holder.text.setHeight(200 + (position % 2) * 60);
    }

    //獲取數(shù)據(jù)的數(shù)量
    @Override
    public int getItemCount() {
        return datas.size();
    }

    //自定義的ViewHolder, 持有每個Item的的所有界面元素
    static class StaggeredViewHolder extends RecyclerView.ViewHolder{

        private TextView text;

        public StaggeredViewHolder(View view){
            super(view);
            text = (TextView)view.findViewById(R.id.item_tv);
        }
    }

    //定義Item點擊事件
    public  interface OnRecyclerViewItemClickListener{
        //點擊事件
        void onItemClick(View view, String str);
        //長按事件
        void onItemLongClick(View view, String str);
    }

    private OnRecyclerViewItemClickListener mOnItemClickListener;

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

    //點擊事件
    @Override
    public void onClick(View v) {
        if(mOnItemClickListener != null){
            mOnItemClickListener.onItemClick(v, (String)v.getTag());
        }
    }

    //長按事件
    @Override
    public boolean onLongClick(View v) {
        if(mOnItemClickListener != null){
            mOnItemClickListener.onItemLongClick(v, (String)v.getTag());
        }
        return false;
    }
}

CardView的特點就是可以設置圓角、陰影，而以前我們需要自己定義shape文件來實現(xiàn)，下面我們看下CradView新增的屬性：

  • CardView_cardBackgroundColor 設置背景色
  • CardView_cardCornerRadius 設置圓角大小
  • CardView_cardElevation 設置z軸陰影
  • CardView_cardMaxElevation 設置z軸最大高度值
  • CardView_cardUseCompatPadding 是否使用CompadPadding
  • CardView_cardPreventCornerOverlap 是否使用PreventCornerOverlap
  • CardView_contentPadding 內容的padding
  • CardView_contentPaddingLeft 內容的左padding
  • CardView_contentPaddingTop 內容的上padding
  • CardView_contentPaddingRight 內容的右padding
  • CardView_contentPaddingBottom 內容的底padding

CardView在RecyclerView的item布局的使用xml如下

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    app:cardCornerRadius="8dp"
    app:cardBackgroundColor="@color/white">

    <TextView
        android:id="@+id/item_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:gravity="center"
        android:text="item數(shù)據(jù)0"
        android:textSize="24sp"/>

</android.support.v7.widget.CardView>

效果圖

ZJ8OFAD3@@[B@3309]WYJ%1.png

希望能給您帶去幫助、感謝您的閱讀。

最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發(fā)布，文章內容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,023評論 25贊 709
  • 現(xiàn)實終于不是童話故事里的結局，王子不論是和公主還是和灰姑娘的愛情都能夠有著美好的結局，我們的愛情故事里總會有不少是...
    彌日生閱讀 475評論 0贊 1
  • 突然想起來銀行的朋友說，9月份會發(fā)行憑證式國債，于是問媽媽他們有沒有這兩個月到期的存款，我拿去給他們買國債，比...
    江漢漁歌閱讀 362評論 0贊 0
  • 故事情節(jié)比較簡單，為了尋寶。尋寶的過程也不太曲折，但尋寶中的美景，笑點可給人一種輕松享受。 ...
    自由自在游泳的魚閱讀 256評論 1贊 1

友情鏈接更多精彩內容