RecyclerView 加載更多與 CoordinatorLayout 的簡單實現

RecyclerView 加載更多與 CoordinatorLayout 的簡單實現

在2015年Google的年度大會上，已經升級了新的Support Library，視覺效果及用戶體驗毋庸置疑，所以今天主要簡單主要介紹Material Design中最主要的二個控件，RecyclerView的上拉加載更多和CoordinatorLayout的結合使用，廢話不多說，先上圖：

CoordinatorLayout

CoordinatorLayout 從字面上理解，它是一個協調view，主要處理子view之間的相互依賴關系，增加交互體驗，通過layoutDependsOn（）來判斷子view（child）是否依賴dependency，通過onDependentViewChanged（）來判斷子view（child）在所依賴view發生改變后的是否要做處理，好，我們看一下源碼：

/**
 * Determine whether the supplied child view has another specific sibling view as a
* layout dependency.
* ／
public boolean layoutDependsOn(CoordinatorLayout parent, V child, View dependency) {
            return false;
        }


/**
* Respond to a change in a child's dependent view
*／
public boolean onDependentViewChanged(CoordinatorLayout parent, V child, View dependency) {
            return false;
        }

如果有自定義功能我們可以extends CoordinatorLayout.Behavior，今天我們介紹簡單使用，后續會對CoordinatorLayout.Behavior做詳細探討：

1. 首先要在Gradle中加入Library

compile 'com.android.support:design:24.2.1'

1. 在布局文件中加入CoordinatorLayout，如果是新建項目的話選擇Navigation Drawer Actiivty模版會包含，這里加入了開源庫NavigationTabStrip對 demo 中的viewpage做綁定
2. 需要注意的是，如果要實現圖片中的Toolbar隱藏效果必須加入，Toolbar其實就是我們的上面提到的子view

app:layout_scrollFlags="scroll|enterAlways"

1. 加入所依賴的behavior可以用ViewPager

<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/vp"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >
</android.support.v4.view.ViewPager>

1. 同樣必須加入

app:layout_behavior="@string/appbar_scrolling_view_behavior"

1. ok，至于下拉加載更多用SwipeRefreshLayout

<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/swiprefreshlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.recyclerviewmore.widget.RecyclerViewUpRefresh
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></com.recyclerviewmore.widget.RecyclerViewUpRefresh>

</android.support.v4.widget.SwipeRefreshLayout>

RecyclerView

以上簡單實現了CoordinatorLayout的效果下面再介紹RecyclerView的上拉加載更多，與CoordinatorLayout配合使用，其實相對與大家比較熟悉的listview來說RecyclerView更靈活，是完美的替代品，所有效果都可以自定義 布局管理（LayoutManager）下面是最簡單的用法，要特殊需求需要自定義LayoutManager

1. 布局管理（LayoutManager）下面是最簡單的用法，要特殊需求需要自定義LayoutManager

mRecyclerView.setLayoutManager(newLinearLayoutManager(getActivity()));

mRecyclerView.setLayoutManager(new GridLayoutManager(getActivity(), 3));

1. 設置分割線（ItemDecoration） 要extends RecyclerView.ItemDecoration

2. ItemAnimator 動畫效果 （同樣RecyclerView 實現 RecyclerView.Adapter可以實現豐富的ui效果，上拉加載更多就是利用Adapter中的viewtype來實現）

3. 重寫RecyclerView的onScrollStateChanged

   @Override
       public void onScrollStateChanged(int state) {
           super.onScrollStateChanged(state);
           if (state == RecyclerView.SCROLL_STATE_IDLE && loadMoreListener != null && !isLoadingData && canloadMore) {
               LayoutManager layoutManager = getLayoutManager();
               int lastVisibleItemPosition;
               if (layoutManager instanceof GridLayoutManager) {
                   lastVisibleItemPosition = ((GridLayoutManager) layoutManager).findLastVisibleItemPosition();
               } else if (layoutManager instanceof StaggeredGridLayoutManager) {
                   int[] into = new int[((StaggeredGridLayoutManager) layoutManager).getSpanCount()];
                   ((StaggeredGridLayoutManager) layoutManager).findLastVisibleItemPositions(into);
                   lastVisibleItemPosition = last(into);
               } else {
                   lastVisibleItemPosition = ((LinearLayoutManager) layoutManager).findLastVisibleItemPosition();
               }
   
               if (layoutManager.getChildCount() > 0
                       && lastVisibleItemPosition >= layoutManager.getItemCount() - 1) {
                   if (loadingMoreFooter != null) {
                       loadingMoreFooter.setVisible();
                   }
                   isLoadingData = true;
                   loadMoreListener.onLoadMore();
               }
           }
       }

4. 根據viewType來顯示FooterView

   @Override
     public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
       if (viewType == FOOTER) {
         return new SimpleViewHolder(loadingMoreFooter);
       }
       return adapter.onCreateViewHolder(parent, viewType);
     }

5. 綁定數據

   @Override
   public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
     holder.itemView.setOnClickListener(this);
     holder.itemView.setOnLongClickListener(this);
     if (adapter != null) {
       int count = adapter.getItemCount();
       if (position < count) {
         adapter.onBindViewHolder(holder, position);
         return;
       }
     }
   }

另外事件處理需要自定義 初來乍到，有寫的不合理之處請多指正，具體簡單實現見 demo

來自：https://jiandanxinli.github.io/2016-10-18.html