安卓(android)怎麼實現下拉重新整理_Android

來源:互聯網
上載者:User

這裡我們將採取的方案是使用組合View的方式,先自訂一個布局繼承自LinearLayout,然後在這個布局中加入下拉頭和ListView這兩個子項目,並讓這兩個子項目縱向排列。初始化的時候,讓下拉頭向上位移出螢幕,這樣我們看到的就只有ListView了。然後對ListView的touch事件進行監聽,如果當前ListView已經滾動到頂部並且手指還在向下拉的話,那就將下拉頭顯示出來,鬆手後進行重新整理操作,並將下拉頭隱藏。那我們現在就來動手實現一下,建立一個項目起名叫PullToRefreshTest,先在項目中定義一個下拉頭的布局檔案pull_to_refresh.xml,代碼如下所示:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:id="@+id/pull_to_refresh_head"android:layout_width="fill_parent"android:layout_height="dip" ><LinearLayoutandroid:layout_width="dip"android:layout_height="dip"android:layout_centerInParent="true"android:orientation="horizontal" ><RelativeLayoutandroid:layout_width="dip"android:layout_height="dip"android:layout_weight=""><ImageView android:id="@+id/arrow"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:src="@drawable/arrow"/><ProgressBar android:id="@+id/progress_bar"android:layout_width="dip"android:layout_height="dip"android:layout_centerInParent="true"android:visibility="gone"/></RelativeLayout><LinearLayoutandroid:layout_width="dip"android:layout_height="dip"android:layout_weight=""android:orientation="vertical" ><TextViewandroid:id="@+id/description"android:layout_width="fill_parent"android:layout_height="dip"android:layout_weight=""android:gravity="center_horizontal|bottom"android:text="@string/pull_to_refresh" /><TextViewandroid:id="@+id/updated_at"android:layout_width="fill_parent"android:layout_height="dip"android:layout_weight=""android:gravity="center_horizontal|top"android:text="@string/updated_at" /></LinearLayout></LinearLayout></RelativeLayout> 

•在這個布局中,我們包含了一個下拉指示箭頭,一個下拉狀態文字提示,和一個上次更新的時間。當然,還有一個隱藏的旋轉進度條,只有正在重新整理的時候我們才會將它顯示出來。布局中所有引用的字串我們都放在strings.xml中,如下所示:

<?xml version="." encoding="utf-"?><resources><string name="app_name">PullToRefreshTest</string><string name="pull_to_refresh">下拉可以重新整理</string><string name="release_to_refresh">釋放立即重新整理</string><string name="refreshing">正在重新整理…</string><string name="not_updated_yet">暫未更新過</string><string name="updated_at">上次更新於%$s前</string><string name="updated_just_now">剛剛更新</string><string name="time_error">時間有問題</string></resources> 

•然後建立一個RefreshableView繼承自LinearLayout,代碼如下所示:

public class RefreshableView extends LinearLayout implements OnTouchListener {//下拉狀態public static final int STATUS_PULL_TO_REFRESH = ;//釋放立即重新整理狀態public static final int STATUS_RELEASE_TO_REFRESH = //正在重新整理狀態public static final int STATUS_REFRESHING = ;//重新整理完成或未重新整理狀態public static final int STATUS_REFRESH_FINISHED = ;//下拉頭部復原的速度public static final int SCROLL_SPEED = -;//一分鐘的毫秒值,用於判斷上次的更新時間public static final long ONE_MINUTE = * ;//一小時的毫秒值,用於判斷上次的更新時間public static final long ONE_HOUR = * ONE_MINUTE;//一天的毫秒值,用於判斷上次的更新時間public static final long ONE_DAY = * ONE_HOUR;//一月的毫秒值,用於判斷上次的更新時間public static final long ONE_MONTH = * ONE_DAY;//一年的毫秒值,用於判斷上次的更新時間public static final long ONE_YEAR = * ONE_MONTH;//上次更新時間的字串常量,用於作為SharedPreferences的索引值private static final String UPDATED_AT = "updated_at";//下拉重新整理的回調介面private PullToRefreshListener mListener;//用於儲存上次更新時間private SharedPreferences preferences;//下拉頭的Viewprivate View header;//需要去下拉重新整理的ListViewprivate ListView listView;//重新整理時顯示的進度條private ProgressBar progressBar;//指示下拉和釋放的箭頭private ImageView arrow;//指示下拉和釋放的文字描述private TextView description;//上次更新時間的文字描述private TextView updateAt;//下拉頭的布局參數private MarginLayoutParams headerLayoutParams;//上次更新時間的毫秒值private long lastUpdateTime;//為了防止不同介面的下拉重新整理在上次更新時間上互相有衝突,使用id來做區分private int mId = -;//下拉頭的高度private int hideHeaderHeight;//當前處理什麼狀態,可選值有STATUS_PULL_TO_REFRESH,STATUS_RELEASE_TO_REFRESH,STATUS_REFRESHING 和 STATUS_REFRESH_FINISHEDprivate int currentStatus = STATUS_REFRESH_FINISHED;;//記錄上一次的狀態是什麼,避免進行重複操作private int lastStatus = currentStatus;//手指按下時的螢幕縱座標private float yDown;//在被判定為滾動之前使用者手指可以移動的最大值。private int touchSlop;//是否已載入過一次layout,這裡onLayout中的初始化只需載入一次private boolean loadOnce;//當前是否可以下拉,只有ListView滾動到頭的時候才允許下拉private boolean ableToPull;//下拉重新整理控制項的建構函式,會在運行時動態添加一個下拉頭的布局。public RefreshableView(Context context, AttributeSet attrs) {super(context, attrs);preferences = PreferenceManager.getDefaultSharedPreferences(context);header = LayoutInflater.from(context).inflate(R.layout.pull_to_refresh, null, true);progressBar = (ProgressBar) header.findViewById(R.id.progress_bar);arrow = (ImageView) header.findViewById(R.id.arrow);description = (TextView) header.findViewById(R.id.description);updateAt = (TextView) header.findViewById(R.id.updated_at);touchSlop = ViewConfiguration.get(context).getScaledTouchSlop();refreshUpdatedAtValue();setOrientation(VERTICAL);addView(header, );}//進行一些關鍵性的初始化操作,比如:將下拉頭向上位移進行隱藏,給ListView註冊touch事件。protected void onLayout(boolean changed, int l, int t, int r, int b) {super.onLayout(changed, l, t, r, b);if (changed && !loadOnce) {hideHeaderHeight = -header.getHeight();headerLayoutParams = (MarginLayoutParams) header.getLayoutParams();headerLayoutParams.topMargin = hideHeaderHeight;listView = (ListView) getChildAt();listView.setOnTouchListener(this);loadOnce = true;}}//當ListView被觸摸時調用,其中處理了各種下拉重新整理的具體邏輯。public boolean onTouch(View v, MotionEvent event) {setIsAbleToPull(event);if (ableToPull) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN:yDown = event.getRawY();break;case MotionEvent.ACTION_MOVE:float yMove = event.getRawY();int distance = (int) (yMove - yDown);// 如果手指是下滑狀態,並且下拉頭是完全隱藏的,就屏蔽下拉事件if (distance <= && headerLayoutParams.topMargin <= hideHeaderHeight) {return false;}if (distance < touchSlop) {return false;}if (currentStatus != STATUS_REFRESHING) {if (headerLayoutParams.topMargin > ) {currentStatus = STATUS_RELEASE_TO_REFRESH;} else {currentStatus = STATUS_PULL_TO_REFRESH;}// 通過位移下拉頭的topMargin值,來實現下拉效果headerLayoutParams.topMargin = (distance / ) + hideHeaderHeight;header.setLayoutParams(headerLayoutParams);}break;case MotionEvent.ACTION_UP:default:if (currentStatus == STATUS_RELEASE_TO_REFRESH) {// 鬆手時如果是釋放立即重新整理狀態,就去調用正在重新整理的任務new RefreshingTask().execute();} else if (currentStatus == STATUS_PULL_TO_REFRESH) {// 鬆手時如果是下拉狀態,就去調用隱藏下拉頭的任務new HideHeaderTask().execute();}break;}// 時刻記得更新下拉頭中的資訊if (currentStatus == STATUS_PULL_TO_REFRESH|| currentStatus == STATUS_RELEASE_TO_REFRESH) {updateHeaderView();// 當前正處於下拉或釋放狀態,要讓ListView失去焦點,否則被點擊的那一項會一直處於選中狀態listView.setPressed(false);listView.setFocusable(false);listView.setFocusableInTouchMode(false);lastStatus = currentStatus;// 當前正處於下拉或釋放狀態,通過返回true屏蔽掉ListView的滾動事件return true;}}return false;}//給下拉重新整理控制項註冊一個監聽器。//為了防止不同介面的下拉重新整理在上次更新時間上互相有衝突, 請不同介面在註冊下拉重新整理監聽器時一定要傳入不同的id。public void setOnRefreshListener(PullToRefreshListener listener, int id) {mListener = listener;mId = id;}// 當所有的重新整理邏輯完成後,記錄調用一下,否則你的ListView將一直處於正在重新整理狀態。public void finishRefreshing() {currentStatus = STATUS_REFRESH_FINISHED;preferences.edit().putLong(UPDATED_AT + mId, System.currentTimeMillis()).commit();new HideHeaderTask().execute();}//根據當前ListView的滾動狀態來設定 {@link #ableToPull}的值,每次都需要在onTouch中第一個執行,這樣可以判斷出當前應該是滾動ListView,還是應該進行下拉。private void setIsAbleToPull(MotionEvent event) {View firstChild = listView.getChildAt();if (firstChild != null) {int firstVisiblePos = listView.getFirstVisiblePosition();if (firstVisiblePos == && firstChild.getTop() == ) {if (!ableToPull) {yDown = event.getRawY();}// 如果首個元素的上邊緣,距離父布局值為,就說明ListView滾動到了最頂部,此時應該允許下拉重新整理ableToPull = true;} else {if (headerLayoutParams.topMargin != hideHeaderHeight) {headerLayoutParams.topMargin = hideHeaderHeight;header.setLayoutParams(headerLayoutParams);}ableToPull = false;}} else {// 如果ListView中沒有元素,也應該允許下拉重新整理ableToPull = true;}}//更新下拉頭中的資訊。private void updateHeaderView() {if (lastStatus != currentStatus) {if (currentStatus == STATUS_PULL_TO_REFRESH) {description.setText(getResources().getString(R.string.pull_to_refresh));arrow.setVisibility(View.VISIBLE);progressBar.setVisibility(View.GONE);rotateArrow();} else if (currentStatus == STATUS_RELEASE_TO_REFRESH) {description.setText(getResources().getString(R.string.release_to_refresh));arrow.setVisibility(View.VISIBLE);progressBar.setVisibility(View.GONE);rotateArrow();} else if (currentStatus == STATUS_REFRESHING) {description.setText(getResources().getString(R.string.refreshing));progressBar.setVisibility(View.VISIBLE);arrow.clearAnimation();arrow.setVisibility(View.GONE);}refreshUpdatedAtValue();}}//根據當前的狀態來旋轉箭頭。private void rotateArrow() {float pivotX = arrow.getWidth() / f;float pivotY = arrow.getHeight() / f;float fromDegrees = f;float toDegrees = f;if (currentStatus == STATUS_PULL_TO_REFRESH) {fromDegrees = f;toDegrees = f;} else if (currentStatus == STATUS_RELEASE_TO_REFRESH) {fromDegrees = f;toDegrees = f;}RotateAnimation animation = new RotateAnimation(fromDegrees, toDegrees, pivotX, pivotY);animation.setDuration();animation.setFillAfter(true);arrow.startAnimation(animation);}//重新整理下拉頭中上次更新時間的文字描述。private void refreshUpdatedAtValue() {lastUpdateTime = preferences.getLong(UPDATED_AT + mId, -);long currentTime = System.currentTimeMillis();long timePassed = currentTime - lastUpdateTime;long timeIntoFormat;String updateAtValue;if (lastUpdateTime == -) {updateAtValue = getResources().getString(R.string.not_updated_yet);} else if (timePassed < ) {updateAtValue = getResources().getString(R.string.time_error);} else if (timePassed < ONE_MINUTE) {updateAtValue = getResources().getString(R.string.updated_just_now);} else if (timePassed < ONE_HOUR) {timeIntoFormat = timePassed / ONE_MINUTE;String value = timeIntoFormat + "分鐘";updateAtValue = String.format(getResources().getString(R.string.updated_at), value);} else if (timePassed < ONE_DAY) {timeIntoFormat = timePassed / ONE_HOUR;String value = timeIntoFormat + "小時";updateAtValue = String.format(getResources().getString(R.string.updated_at), value);} else if (timePassed < ONE_MONTH) {timeIntoFormat = timePassed / ONE_DAY;String value = timeIntoFormat + "天";updateAtValue = String.format(getResources().getString(R.string.updated_at), value);} else if (timePassed < ONE_YEAR) {timeIntoFormat = timePassed / ONE_MONTH;String value = timeIntoFormat + "個月";updateAtValue = String.format(getResources().getString(R.string.updated_at), value);} else {timeIntoFormat = timePassed / ONE_YEAR;String value = timeIntoFormat + "年";updateAtValue = String.format(getResources().getString(R.string.updated_at), value);}updateAt.setText(updateAtValue);}//正在重新整理的任務,在此任務中會去回調註冊進來的下拉重新整理監聽器。class RefreshingTask extends AsyncTask<Void, Integer, Void> {protected Void doInBackground(Void... params) {int topMargin = headerLayoutParams.topMargin;while (true) {topMargin = topMargin + SCROLL_SPEED;if (topMargin <= ) {topMargin = ;break;}publishProgress(topMargin);sleep();}currentStatus = STATUS_REFRESHING;publishProgress();if (mListener != null) {mListener.onRefresh();}return null;}protected void onProgressUpdate(Integer... topMargin) {updateHeaderView();headerLayoutParams.topMargin = topMargin[];header.setLayoutParams(headerLayoutParams);}}//隱藏下拉頭的任務,當未進行下拉重新整理或下拉重新整理完成後,此任務將會使下拉頭重新隱藏。class HideHeaderTask extends AsyncTask<Void, Integer, Integer> {protected Integer doInBackground(Void... params) {int topMargin = headerLayoutParams.topMargin;while (true) {topMargin = topMargin + SCROLL_SPEED;if (topMargin <= hideHeaderHeight) {topMargin = hideHeaderHeight;break;}publishProgress(topMargin);sleep();}return topMargin;}protected void onProgressUpdate(Integer... topMargin) {headerLayoutParams.topMargin = topMargin[];header.setLayoutParams(headerLayoutParams);}protected void onPostExecute(Integer topMargin) {headerLayoutParams.topMargin = topMargin;header.setLayoutParams(headerLayoutParams);currentStatus = STATUS_REFRESH_FINISHED;}}//使當前線程睡眠指定的毫秒數。指定當前線程睡眠多久,以毫秒為單位private void sleep(int time) {try {Thread.sleep(time);} catch (InterruptedException e) {e.printStackTrace();}}//下拉重新整理的監聽器,使用下拉重新整理的地方應該註冊此監聽器來擷取重新整理回調。public interface PullToRefreshListener {//重新整理時會去回調此方法,在方法內編寫具體的重新整理邏輯。注意此方法是在子線程中調用的, 你可以不必另開線程來進行耗時操作。void onRefresh();}}

•這個類是整個下拉重新整理功能中最重要的一個類,注釋已經寫得比較詳細了,我再簡單解釋一下。首先在RefreshableView的建構函式中動態添加了剛剛定義的pull_to_refresh這個布局作為下拉頭,然後在onLayout方法中將下拉頭向上位移出了螢幕,再給ListView註冊了touch事件。之後每當手指在ListView上滑動時,onTouch方法就會執行。在onTouch方法中的第一行就調用了setIsAbleToPull方法來判斷ListView是否滾動到了最頂部,只有滾動到了最頂部才會執行後面的代碼,否則就視為正常的ListView滾動,不做任何處理。當ListView滾動到了最頂部時,如果手指還在向下拖動,就會改變下拉頭的位移值,讓下拉頭顯示出來,下拉的距離設定為手指移動距離的1/2,這樣才會有拉力的感覺。如果下拉的距離足夠大,在鬆手的時候就會執行重新整理操作,如果距離不夠大,就僅僅重新隱藏下拉頭。

•具體的重新整理操作會在RefreshingTask中進行,其中在doInBackground方法中回調了PullToRefreshListener介面的onRefresh方法,這也是大家在使用RefreshableView時必須要去實現的一個介面,因為具體重新整理的邏輯就應該寫在onRefresh方法中,後面會示範使用的方法。

•另外每次在下拉的時候都還會調用updateHeaderView方法來改變下拉頭中的資料,比如箭頭方向的旋轉,下拉文字描述的改變等。更加深入的理解請大家仔細去閱讀RefreshableView中的代碼。

現在我們已經把下拉重新整理的所有功能都完成了,接下來就要看一看如何在項目中引入下拉重新整理了。開啟或建立activity_main.xml作為程式主介面的布局,加入如下代碼:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity" ><com.example.pulltorefreshtest.RefreshableViewandroid:id="@+id/refreshable_view"android:layout_width="fill_parent"android:layout_height="fill_parent" ><ListViewandroid:id="@+id/list_view"android:layout_width="fill_parent"android:layout_height="fill_parent" ></ListView></com.example.pulltorefreshtest.RefreshableView></RelativeLayout> 

•可以看到,我們在自訂的RefreshableView中加入了一個ListView,這就意味著給這個ListView加入了下拉重新整理的功能,就是這麼簡單!然後我們再來看一下程式的主Activity,開啟或建立MainActivity,加入如下代碼:

public class MainActivity extends Activity {RefreshableView refreshableView;ListView listView;ArrayAdapter<String> adapter;String[] items = { "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L" };protected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);refreshableView = (RefreshableView) findViewById(R.id.refreshable_view);listView = (ListView) findViewById(R.id.list_view);adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_, items);listView.setAdapter(adapter);refreshableView.setOnRefreshListener(new PullToRefreshListener() {public void onRefresh() {try {Thread.sleep();} catch (InterruptedException e) {e.printStackTrace();}refreshableView.finishRefreshing();}}, );}}

•可以看到,我們通過調用RefreshableView的setOnRefreshListener方法註冊了一個監聽器,當ListView正在重新整理時就會回調監聽器的onRefresh方法,重新整理的具體邏輯就在這裡處理。而且這個方法已經自動開啟了線程,可以直接在onRefresh方法中進行耗時操作,比如向伺服器請求最新資料等,在這裡我就簡單讓線程睡眠3秒鐘。另外在onRefresh方法的最後,一定要調用RefreshableView中的finishRefreshing方法,這個方法是用來通知RefreshableView重新整理結束了,不然我們的ListView將一直處於正在重新整理的狀態。

•不知道大家有沒有注意到,setOnRefreshListener這個方法其實是有兩個參數的,我們剛剛也是傳入了一個不起眼的0。那這第二個參數是用來做什麼的呢?由於RefreshableView比較智能,它會自動幫我們記錄上次重新整理完成的時間,然後下拉的時候會在下拉頭中顯示距上次重新整理已過了多久。這是一個非常好用的功能,讓我們不用再自己手動去記錄和計算時間了,但是卻存在一個問題。

•如果當前我們的項目中有三個地方都使用到了下拉重新整理的功能,現在在一處進行了重新整理,其它兩處的時間也都會跟著改變!因為重新整理完成的時間是記錄在設定檔中的,由於在一處重新整理更改了設定檔,導致在其它兩處讀取到的設定檔時間已經是更改過的了。

•那解決方案是什嗎?就是每個用到下拉重新整理的地方,給setOnRefreshListener方法的第二個參數中傳入不同的id就行了。這樣各處的上次重新整理完成時間都是單獨記錄的,相互之間就不會再有影響。

•讓我們來運行一下,看看效果吧。

•效果看起來還是非常不錯的。我們最後再來總結一下,在項目中引入ListView下拉重新整理功能只需三步:

1.在Activity的布局檔案中加入自訂的RefreshableView,並讓ListView包含在其中。

2.在Activity中調用RefreshableView的setOnRefreshListener方法註冊回調介面。

3.在onRefresh方法的最後,記得調用RefreshableView的finishRefreshing方法,通知重新整理結束。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.