June 30, 2014

SwipeRefreshLayout + ListView

Android Support Library v4 就有谷歌自己的拉下來重刷的布局:SwipeRefreshLayout

Android Support Library:https://developer.android.com/tools/support-library/index.html

不過,配合 ListView 一起使用就要用一個小方法來 fix 一個 bug。默認的 ListView 無論在不在頂部位置時會都會讓 SwipeRefreshLayout 的往下拉的手势重蓋了。

示意圖:

示意圖:Top 位置

綠色框 = ListView

藍色箭頭 = ListView 頂部位置

橙色箭頭 = SwipeRefreshLayout 容器位置

XML 布局文件大概這樣:

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

The Fix

代碼來源: nlopez.io

guidesList.setOnScrollListener(new AbsListView.OnScrollListener() {  
  @Override
  public void onScrollStateChanged(AbsListView view, int scrollState) {

  }

  @Override
  public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
    int topRowVerticalPosition = 
      (guidesList == null || guidesList.getChildCount() == 0) ? 
        0 : guidesList.getChildAt(0).getTop();
    swipeContainer.setEnabled(topRowVerticalPosition >= 0);
  }
});

計算 ListView 頂部位置,如果不是在頂部時就 disable 拉下來重刷的動作。這樣 ListView 又可以上下滑動了。

更新:

SwipeRefreshLayout 有個 method canChildScrollUp() 可以用來實現滾動的事件 Link