能夠下拉重新整理和上拉載入的瀑布流，下拉瀑布

能夠下拉重新整理和上拉載入的瀑布流，下拉瀑布
瀑布流在剛出來的時候很火，大家都覺得下過很炫，於是乎我也玩了一把，但結果，應用到具體情境的時候，我們需要使用上拉重新整理功能，開源的效果不能達到，於是乎，經過大神指點，重新實現了這一效果。
     首先，我們需要引用瀑布流的工程，github項目地址：https://github.com/paulzeng/AndroidStaggeredGrid,這個項目我已經fork到了我的首頁，下載，然後對其library進行引用。
     然後我們引入下拉重新整理的工程，github項目地址：https://github.com/paulzeng/Android-PullToRefresh,這個項目我也fork了，下載，引入library。我們需要修改PullToRefreshBase.java類，加入兩個方法，用於判斷是上拉還是下拉。

public boolean isHeaderShown() {return getHeaderLayout().isShown();}public boolean isFooterShown() {return getFooterLayout().isShown();      }

 至此，工程庫的引用，我們已經完成，接下來，我們需要自訂PullToRefreshStaggeredGridView類，將瀑布流與重新整理組件合并。

import android.annotation.SuppressLint;import android.annotation.TargetApi;import android.content.Context;import android.os.Build.VERSION;import android.os.Build.VERSION_CODES;import android.os.Bundle;import android.util.AttributeSet;import android.view.View;import com.etsy.android.grid.StaggeredGridView;import com.handmark.pulltorefresh.library.OverscrollHelper;import com.handmark.pulltorefresh.library.PullToRefreshBase;import com.handmark.pulltorefresh.library.R;@SuppressLint("NewApi")public class PullToRefreshStaggeredGridView extendsPullToRefreshBase<StaggeredGridView> {private static final OnRefreshListener<StaggeredGridView> defaultOnRefreshListener = new OnRefreshListener<StaggeredGridView>() {@Overridepublic void onRefresh(PullToRefreshBase<StaggeredGridView> refreshView) {}};public PullToRefreshStaggeredGridView(Context context) {super(context);/** * Added so that by default, Pull-to-Refresh refreshes the page */setOnRefreshListener(defaultOnRefreshListener);}public PullToRefreshStaggeredGridView(Context context, AttributeSet attrs) {super(context, attrs);/** * Added so that by default, Pull-to-Refresh refreshes the page */setOnRefreshListener(defaultOnRefreshListener);}public PullToRefreshStaggeredGridView(Context context, Mode mode) {super(context, mode);/** * Added so that by default, Pull-to-Refresh refreshes the page */setOnRefreshListener(defaultOnRefreshListener);}public PullToRefreshStaggeredGridView(Context context, Mode mode,AnimationStyle style) {super(context, mode, style);/** * Added so that by default, Pull-to-Refresh refreshes the page */setOnRefreshListener(defaultOnRefreshListener);}@Overridepublic final Orientation getPullToRefreshScrollDirection() {return Orientation.VERTICAL;}@Overrideprotected StaggeredGridView createRefreshableView(Context context,AttributeSet attrs) {StaggeredGridView gridView;if (VERSION.SDK_INT >= VERSION_CODES.GINGERBREAD) {gridView = new InternalStaggeredGridViewSDK9(context, attrs);} else {gridView = new StaggeredGridView(context, attrs);}gridView.setId(R.id.gridview);return gridView;}@Overrideprotected boolean isReadyForPullStart() {boolean result = false;View v = getRefreshableView().getChildAt(0);if (getRefreshableView().getFirstVisiblePosition() == 0) {if (v != null) {// getTop() and getBottom() are relative to the ListView,// so if getTop() is negative, it is not fully visibleboolean isTopFullyVisible = v.getTop() >= 0;result = isTopFullyVisible;}}return result;}@Overrideprotected boolean isReadyForPullEnd() {boolean result = false;int last = getRefreshableView().getChildCount() - 1;View v = getRefreshableView().getChildAt(last);int firstVisiblePosition = getRefreshableView().getFirstVisiblePosition();int visibleItemCount = getRefreshableView().getChildCount();int itemCount = getRefreshableView().getAdapter().getCount();if (firstVisiblePosition + visibleItemCount >= itemCount) {if (v != null) {boolean isLastFullyVisible = v.getBottom() <= getRefreshableView().getHeight();result = isLastFullyVisible;}}return result;}@Overrideprotected void onPtrRestoreInstanceState(Bundle savedInstanceState) {super.onPtrRestoreInstanceState(savedInstanceState);}@Overrideprotected void onPtrSaveInstanceState(Bundle saveState) {super.onPtrSaveInstanceState(saveState);}@TargetApi(9)final class InternalStaggeredGridViewSDK9 extends StaggeredGridView {// WebView doesn't always scroll back to it's edge so we add some// fuzzinessstatic final int OVERSCROLL_FUZZY_THRESHOLD = 2;// WebView seems quite reluctant to overscroll so we use the scale// factor to scale it's valuestatic final float OVERSCROLL_SCALE_FACTOR = 1.5f;public InternalStaggeredGridViewSDK9(Context context, AttributeSet attrs) {super(context, attrs);}@Overrideprotected boolean overScrollBy(int deltaX, int deltaY, int scrollX,int scrollY, int scrollRangeX, int scrollRangeY,int maxOverScrollX, int maxOverScrollY, boolean isTouchEvent) {final boolean returnValue = super.overScrollBy(deltaX, deltaY,scrollX, scrollY, scrollRangeX, scrollRangeY,maxOverScrollX, maxOverScrollY, isTouchEvent);// Does all of the hard work...OverscrollHelper.overScrollBy(PullToRefreshStaggeredGridView.this,deltaX, scrollX, deltaY, getScrollRange(), isTouchEvent);return returnValue;}/** * Taken from the AOSP ScrollView source */private int getScrollRange() {int scrollRange = 0;if (getChildCount() > 0) {View child = getChildAt(0);scrollRange = Math.max(0, child.getHeight()- (getHeight() - getPaddingBottom() - getPaddingTop()));}return scrollRange;}}}

然後我們自訂布局檔案，使用我們重新寫好的控制項

<LinearLayout 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:background="#FFF"    android:orientation="vertical" >    <com.thomas.pulltorefreshstaggeredgridview.PullToRefreshStaggeredGridView        android:id="@+id/pull_grid_view"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_margin="10dp"        android:background="#F0F0F0"        android:cacheColorHint="#00000000"        android:fadingEdge="none"        android:overScrollMode="never"        android:scrollbars="none"        app:column_count="2"        app:item_margin="8dp" /></LinearLayout>

然後我們在activity中進行coding 

import java.util.ArrayList;import java.util.List;import android.annotation.SuppressLint;import android.app.Activity;import android.content.Context;import android.os.Bundle;import com.etsy.android.grid.StaggeredGridView;import com.handmark.pulltorefresh.library.PullToRefreshBase;import com.handmark.pulltorefresh.library.PullToRefreshBase.Mode;import com.handmark.pulltorefresh.library.PullToRefreshBase.OnRefreshListener;import com.nostra13.universalimageloader.cache.disc.naming.Md5FileNameGenerator;import com.nostra13.universalimageloader.core.ImageLoader;import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;import com.nostra13.universalimageloader.core.assist.QueueProcessingType;@SuppressLint("NewApi")public class MainActivity extends Activity implementsOnRefreshListener<StaggeredGridView> {private List<PhotoBean> photos;private StaggeredGridView mDongTaiGridView;private MyPhotoAdapter mAdapter;/** 下來重新整理 **/private PullToRefreshStaggeredGridView mPullToRefreshStaggerdGridView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);initImageLoader(this);setContentView(R.layout.activity_main);photos = getPhotos();mAdapter = new MyPhotoAdapter(this, photos);mPullToRefreshStaggerdGridView = (PullToRefreshStaggeredGridView) this.findViewById(R.id.pull_grid_view);mPullToRefreshStaggerdGridView.setMode(Mode.PULL_FROM_START);mPullToRefreshStaggerdGridView.setMode(Mode.BOTH);mPullToRefreshStaggerdGridView.setOnRefreshListener(this);mDongTaiGridView = mPullToRefreshStaggerdGridView.getRefreshableView();mDongTaiGridView.setAdapter(mAdapter);}private List<PhotoBean> getPhotos() {List<PhotoBean> photos = new ArrayList<PhotoBean>();PhotoBean PhotoBean = new PhotoBean("http://img4q.duitang.com/uploads/item/201506/29/20150629140736_5JR8c.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img5q.duitang.com/uploads/item/201506/29/20150629141607_LNFkx.thumb.700_0.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img5q.duitang.com/uploads/item/201506/29/20150629141550_MuVm5.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img5q.duitang.com/uploads/item/201506/29/20150629141740_TUB2H.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img4q.duitang.com/uploads/item/201506/29/20150629141716_nCUrG.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://cdnq.duitang.com/uploads/item/201506/29/20150629141656_5GBzS.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img4q.duitang.com/uploads/item/201506/29/20150629141634_CEida.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img5q.duitang.com/uploads/item/201506/29/20150629141236_sAHim.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img4q.duitang.com/uploads/item/201506/29/20150629141218_ezRd4.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://cdnq.duitang.com/uploads/item/201506/29/20150629141200_nykzY.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img4q.duitang.com/uploads/item/201506/29/20150629141125_FCtVN.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img4q.duitang.com/uploads/item/201506/29/20150629141108_mBrUc.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://cdnq.duitang.com/uploads/item/201506/29/20150629141052_cdFuA.thumb.700_0.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://cdnq.duitang.com/uploads/item/201506/29/20150629141030_zv2Rt.jpeg","夏天的風");photos.add(PhotoBean);PhotoBean = new PhotoBean("http://img5q.duitang.com/uploads/item/201506/29/20150629140948_UMWTQ.jpeg","夏天的風");photos.add(PhotoBean);return photos;}@Overridepublic void onRefresh(PullToRefreshBase<StaggeredGridView> refreshView) {// TODO Auto-generated method stubif (refreshView.isHeaderShown()) {} else {}}public void initImageLoader(Context context) {ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(context).threadPriority(Thread.NORM_PRIORITY - 2).denyCacheImageMultipleSizesInMemory().discCacheFileNameGenerator(new Md5FileNameGenerator()).tasksProcessingOrder(QueueProcessingType.LIFO).writeDebugLogs() // Remove for release app.build();ImageLoader.getInstance().init(config);}}

接下來，請看：


如果還有不清楚的，可以進入我的github首頁，下載完整代碼 demo
點擊開啟連結

項目我會進一步在github上面進行完整，還希望能與大家一起完善。

著作權聲明：本文為博主原創文章，未經博主允許不得轉載。