[Android]使用RecyclerView替代ListView（三）

以下內容為原創，轉載請注明：

來自天天博客：http://www.cnblogs.com/tiantianbyconan/p/4268097.html 

 

這次來使用RecyclerView實現PinnedListView的效果，效果很常見：

開發的代碼建立在上一篇（[Android]使用RecyclerView替代ListView（二）：http://www.cnblogs.com/tiantianbyconan/p/4242541.html）基礎之上。

修改布局如下：

<?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:layout_height="match_parent">

    <android.support.v7.widget.Toolbar
            android:id="@+id/recycler_view_pinned_toolbar"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:background="?attr/colorPrimary"
            />
    <android.support.v4.widget.SwipeRefreshLayout
            android:id="@+id/recycler_view_pinned_srl"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            >

        <com.wangjie.androidbucket.support.recyclerview.pinnedlayout.PinnedRecyclerViewLayout
                android:id="@+id/recycler_view_pinned_layout"
                android:layout_width="match_parent" android:layout_height="match_parent">
            <android.support.v7.widget.RecyclerView
                    android:id="@+id/recycler_view_pinned_rv"
                    android:scrollbars="vertical"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="#bbccaa"
                    />
            <Button
                    android:id="@+id/recycler_view_pinned_add_btn"
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:background="#abcabc"
                    android:text="add"
                    />

        </com.wangjie.androidbucket.support.recyclerview.pinnedlayout.PinnedRecyclerViewLayout>

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

</LinearLayout>

可以看到RecyclerView是被一個PinnedRecyclerViewLayout（https://github.com/wangjiegulu/AndroidBucket/blob/master/src/com/wangjie/androidbucket/support/recyclerview/pinnedlayout/PinnedRecyclerViewLayout.java）包含在里面的。這個在項目AndroidBucket（https://github.com/wangjiegulu/AndroidBucket）中。先看看代碼中怎么使用吧，具體實現待會說。

pinnedLayout.initRecyclerPinned(recyclerView, layoutManager, LayoutInflater.from(context).inflate(R.layout.recycler_view_item_float, null));
pinnedLayout.setOnRecyclerViewPinnedViewListener(this);

如上，使用方式很簡單：

Line1：初始化綁定PinnedRecyclerViewLayout和RecyclerView，並設置需要被頂上去的pinnedView

Line2：設置OnRecyclerViewPinnedViewListener，作用是在頂部被頂上去替換掉的時候，會回調重新渲染數據，傳入的OnRecyclerViewPinnedViewListener是this，顯然，此Activity實現了這個接口，實現代碼如下：

// 渲染pinnedView數據
    @Override
    public void onPinnedViewRender(PinnedRecyclerViewLayout pinnedRecyclerViewLayout, View pinnedView, int position) {
        switch (pinnedRecyclerViewLayout.getId()) {
            case R.id.recycler_view_pinned_layout:
                TextView nameTv = (TextView) pinnedView.findViewById(R.id.recycler_view_item_float_name_tv);
                nameTv.setText(personList.get(position).getName());
                TextView ageTv = (TextView) pinnedView.findViewById(R.id.recycler_view_item_float_age_tv);
                ageTv.setText(personList.get(position).getAge() + "歲");
                break;
        }
    }

然后，我們來看看PinnedRecyclerViewLayout是怎么實現的。

/**
 * Author: wangjie
 * Email: [e-mail]
 * Date: 2/2/15.
 */
public class PinnedRecyclerViewLayout extends RelativeLayout {

    private static final String TAG = PinnedRecyclerViewLayout.class.getSimpleName();

    public static interface OnRecyclerViewPinnedViewListener {
        void onPinnedViewRender(PinnedRecyclerViewLayout pinnedRecyclerViewLayout, View pinnedView, int position);
    }

    private OnRecyclerViewPinnedViewListener onRecyclerViewPinnedViewListener;

    public void setOnRecyclerViewPinnedViewListener(OnRecyclerViewPinnedViewListener onRecyclerViewPinnedViewListener) {
        this.onRecyclerViewPinnedViewListener = onRecyclerViewPinnedViewListener;
    }

    public PinnedRecyclerViewLayout(Context context) {
        super(context);
        init(context);
    }

    public PinnedRecyclerViewLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public PinnedRecyclerViewLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    private void init(Context context) {
    }

    private View pinnedView;
    private ABaseLinearLayoutManager layoutManager;

    public void initRecyclerPinned(RecyclerView recyclerView, ABaseLinearLayoutManager layoutManager, View pinnedView) {
        this.pinnedView = pinnedView;
        this.layoutManager = layoutManager;
        this.addView(this.pinnedView);
        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        this.pinnedView.setLayoutParams(lp);
        layoutManager.getRecyclerViewScrollManager().addScrollListener(recyclerView, new OnRecyclerViewScrollListener() {
            @Override
            public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
            }

            @Override
            public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
                refreshPinnedView();
            }
        });
        pinnedView.setVisibility(GONE);
    }

    // 保存上次的position
    private int lastPosition = RecyclerView.NO_POSITION;

    public void refreshPinnedView() {
        if (null == pinnedView || null == layoutManager) {
            Logger.e(TAG, "Please init pinnedView and layoutManager with initRecyclerPinned method first!");
            return;
        }
        if (VISIBLE != pinnedView.getVisibility()) {
            pinnedView.setVisibility(VISIBLE);
        }
        int curPosition = layoutManager.findFirstVisibleItemPosition();
        if (RecyclerView.NO_POSITION == curPosition) {
            return;
        }
        View curItemView = layoutManager.findViewByPosition(curPosition);
        if (null == curItemView) {
            return;
        }
        // 如果當前的curPosition和上次的lastPosition不一樣，則說明需要重新刷新數據，避免curPosition一樣的情況下重復刷新相同數據
        if (curPosition != lastPosition) {
            if (null != onRecyclerViewPinnedViewListener) {
                onRecyclerViewPinnedViewListener.onPinnedViewRender(this, pinnedView, curPosition);
            }
            lastPosition = curPosition;
        }

        int displayTop;
        int itemHeight = curItemView.getHeight();
        int curTop = curItemView.getTop();
        int floatHeight = pinnedView.getHeight();
        if (curTop < floatHeight - itemHeight) {
            displayTop = itemHeight + curTop - floatHeight;
        } else {
            displayTop = 0;
        }
        RelativeLayout.LayoutParams lp = (LayoutParams) pinnedView.getLayoutParams();
        lp.topMargin = displayTop;
        pinnedView.setLayoutParams(lp);
        pinnedView.invalidate();
    }


}

 

這個PinnedRecyclerViewLayout 是繼承RelativeLayout的，因為我們需要在里面添加一個被頂上去的pinnedView，需要覆蓋在RecyclerView上面。

Line44：把傳進來的pinnedView增加到PinnedRecyclerViewLayout 里面

Line47～56：在ABaseLinearLayoutManager中增加一個滾動的監聽器，因為我們需要在滾動的時候動態的改變pinnedView的位置，這樣才能模擬頂上去的效果。並滾動時調用refreshPinnedView來刷新pinnedView的位置。

Line57：因為在調用initRecyclerPinned方法時，RecyclerView可能還沒有數據源，所以不需要顯示這個pinnedView，等到真正滾動的時候再顯示就可以了。

refreshPinnedView()方法的作用是在滾動的同時用來刷新pinnedView的位置和顯示的數據：

Line71～78：通過layoutManager獲取當前第一個顯示的數據position，然后根據position獲取當前第一個顯示的View。

Line79~85：如果當前的curPosition和上次的lastPosition不一樣，則說明需要重新刷新數據，避免curPosition一樣的情況下重復刷新相同數據。

Line87～95：根據當前第一個顯示的View，根據它的top、它的高度和pinnedView的高度計算出pinnedView需要往上移動的距離（畫個幾何圖一目了然了）。

Line96～99：刷新pinnedView的位置

 

示例代碼：

https://github.com/wangjiegulu/RecyclerViewSample

 

[Android]使用RecyclerView替代ListView（一）：

http://www.cnblogs.com/tiantianbyconan/p/4232560.html

 

[Android]使用RecyclerView替代ListView（二）： 

http://www.cnblogs.com/tiantianbyconan/p/4242541.html