1. 程式人生 > >RecyclerView和CardView的使用以及注意

RecyclerView和CardView的使用以及注意

距離RecyclerView和CardView的出現已經很久了,網上也有很多關於這方面的部落格。因為最近自己在專案中用到了Material Design設計規範,所以才第一次接觸到了RecyclerView和CardView。在這篇部落格中,我將給大家介紹一下RecyclerView和CardView的使用方法以及在使用過程中可能遇到的一些問題。具體的實現將通過一個Demo來進行介紹。

RecyclerView和CardView的簡單介紹

2014年,隨著Google推出了全新的設計語言Material Design,還迎來了新的Android支援庫v7,其中就包含了RecyclerView和CardView。可在路徑sdk\extras\android\support\v7下找到相關的support包,通過匯入來進行依賴。

RecyclerView

我們為什麼要去使用RecyclerView呢?對比我們最常用的ListView,可以發現以下幾點:

1.使用方法
ListView僅需要設定adapter即可正常使用,而RecyclerView需要

//設定佈局管理器
list.setLayoutManager(new LinearLayoutManager(this));
//設定adapter
list.setAdapter(adapter)
//設定Item增加、移除動畫
list.setItemAnimator(new DefaultItemAnimator());

2.ViewHolder
在我們使用ListViewz中,我們經常會使用ViewHolder來進行復用,而在RecyclerView中則直接提供了ViewHolder,我們可以通過繼承來使用。

通過以上我們可以發現,RecyclerView正如其命名,只負責對view的回收和複用,其他的一切都交給程式設計師來實現。這樣我們才可以輕鬆的通過RecyclerView這個控制元件來實現ListView,GirdView,瀑布流等效果。

CardView

通過CardView我們可以很容易的實現卡片式的佈局,當然你也可以使用Drawable、Layout 來實現。但這畢竟需要一定的功底,所以對於不擅長的同學來說,CardView可以輕鬆滿足。

RecyclerView和CardView的使用

RecyclerView

RecyclerView的使用偏向於程式碼方面,因為本人也只是初次接觸所以未做深入的瞭解,詳細的使用可以通過這篇部落格來了解。

http://blog.csdn.net/lmj623565791/article/details/45059587,下面我只對常用到的方法進行介紹。
1.setLayoutManager
通過這個方法,我們可以很簡單的將RecyclerView改造成為Listview,GridView以及瀑布流的形式。例如:

        //線性佈局管理器
        list.setLayoutManager(new LinearLayoutManager(this));
        //網格佈局管理器
        list.setLayoutManager(new GridLayoutManager(this,2));
        //瀑布流佈局管理器
        list.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));

其中StaggeredGridLayoutManager的第二個引數為方向,可設定為VERTICAL和HORIZONTAL。為VERTICAL時表示有多少列,HORIZONTAL則表示有多少行。

2.setItemAnimator
通過這個方法,我們可以為每個item設定新增和刪除的動畫,官方當然只為我們提供了一種,不過我們可以去自定義或者去GitHub上查詢。需要注意的是若要有動畫效果,重新整理資料集的時候不可以使用notifyDataSetChanged()而要使用notifyItemInserted(position)和notifyItemRemoved(position)。

3.addItemDecoration
該方法可以為每個item之間設定分割線,大家可以通過實現該類的方法來自定義分割線。

4.itemClick與itemLongClick
由於官方並未給出以上兩個方法,所以我們只能自己實現。具體實現方法有兩種,可以在addOnItemTouchListener中監聽手勢來實現,也可直接在adapter中去添加回調。這裡為大家介紹第二種方法:

private OnItemClickListener mOnItemClickListener;
    private OnItemLongClickListener mOnItemLongClickListener;

    public interface OnItemClickListener {
        void OnItemClick(View view, int position);
    }

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

    public interface OnItemLongClickListener {
        void OnItemLongClick(View view, int position);
    }

    public void setOnItemLongClickListener(OnItemLongClickListener mOnItemLongClickListener) {
        this.mOnItemLongClickListener = mOnItemLongClickListener;
    }
    @Override
    public void onBindViewHolder(final RecyclerViewAdapter.ViewHolder holder, int position) {
        //設定點選事件
        if (mOnItemClickListener != null) {
            holder.itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    int pos = holder.getLayoutPosition();
                    mOnItemClickListener.OnItemClick(holder.itemView, pos);
                }
            });
        }

        //設定長按事件
        if (mOnItemLongClickListener != null) {
            holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View v) {
                    int pos = holder.getLayoutPosition();
                    mOnItemLongClickListener.OnItemLongClick(v, pos);
                    return true;
                }
            });
        }
       }

注意:監聽需要設定給adapter而不是RecyclerView。

CardView

CardView使用比較簡單,xml程式碼如下:

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="@dimen/card_margin"
        card_view:cardCornerRadius="2dp"
        card_view:cardElevation="4dp"
        android:foreground="?attr/selectableItemBackground">

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

需要匯入名稱空間

xmlns:card_view="http://schemas.android.com/apk/res-auto"
  • cardCornerRadius:設定卡片邊角的角度值
  • cardElevation:設定卡片的陰影

使用過程中設定cardElevation後,在低版本上CardView會留出空間來顯現出陰影,而在Lollipop 之後則需要手動設定 Margin 邊距來預留空間,否則CardView會擠在一起,因此我們需要為Lollipop之後的版本定義Margin 值:

1.建立 /res/value 和 /res/value-v21 資原始檔夾於專案對應目錄下,前者放置舊版本或者通用的資原始檔,後者放置Lollipop及更高 SDK 版本的資原始檔。

2.在資料夾內建立dimens.xml,<dimen name="card_margin">4dp</dimen>填入你期望的值。

3.在佈局中使用android:layout_margin="@dimen/card_margin"

通過android:foreground="?attr/selectableItemBackground"可以為CardView設定點選效果,在高版本上為Ripple效果,低版本則為變深到變亮的過程。

RecyclerView和CardView的結合使用Demo

這裡寫圖片描述
Demo下載地址:
https://github.com/AboutJoke/RcDemo
簡單的使用介紹就到此為止了,深層次的東西就需要大家自己去挖掘了,同時有任何問題,歡迎和我進行交流。