Android應用中ListView利用OnScrollListener分頁加載數據

2020-01-02 06:59:23

字體：大中小

來源：轉載

供稿：網友

當用戶從網絡上讀取微薄的時候，如果一下子全部加載用戶未讀的微薄這將耗費比較長的時間，造成不好的用戶體驗，同時一屏的內容也不足以顯示如此多的內容。這時候，我們就需要用到另一個功能，那就是listview的分頁了。通過分頁分次加載數據，用戶看多少就去加載多少。

通常這也分為兩種方式，一種是設置一個按鈕，用戶點擊即加載。另一種是當用戶滑動到底部時自動加載。今天我就和大家分享一下這個功能的實現。

首先，寫一個xml文件，moredata.xml，該文件即定義了放在listview底部的視圖：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="match_parent"  android:layout_height="match_parent"  android:orientation="vertical" > <Button     android:id="@+id/bt_load"     android:layout_width="fill_parent"     android:layout_height="wrap_content"    android:text="加載更多數據" />  <ProgressBar   android:id="@+id/pg"   android:layout_width="wrap_content"   android:layout_height="wrap_content"   android:layout_gravity="center_horizontal"   android:visibility="gone"   /></LinearLayout>

可以看到是一個按鈕和一個進度條。因為只做一個演示，這里簡單處理，通過設置控件的visibility，未加載時顯示按鈕，加載時就顯示進度條。

寫一個item.xml，大家應該很熟悉了。用來定義listview的每個item的視圖。

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="match_parent"  android:layout_height="match_parent"  android:orientation="vertical" >    <TextView    android:id="@+id/tv_title"    android:textSize="20sp"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_marginTop="5dp"    />  <TextView    android:textSize="12sp"    android:id="@+id/tv_content"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_marginTop="5dp"    /></LinearLayout>

main.xml就不貼了，整個主界面就一個listview。

直接先看下Activity的代碼，在里面實現分頁效果。

package com.notice.moredate;import java.util.ArrayList;import java.util.HashMap;import android.app.Activity;import android.os.Bundle;import android.os.Handler;import android.view.View;import android.view.View.OnClickListener;import android.widget.AbsListView;import android.widget.AbsListView.OnScrollListener;import android.widget.Button;import android.widget.ListView;import android.widget.ProgressBar;import android.widget.SimpleAdapter;import android.widget.Toast;public class MoreDateListActivity extends Activity implements OnScrollListener {    // ListView的Adapter  private SimpleAdapter mSimpleAdapter;  private ListView lv;  private Button bt;  private ProgressBar pg;  private ArrayList<HashMap<String,String>> list;  // ListView底部View  private View moreView;  private Handler handler;  // 設置一個最大的數據條數，超過即不再加載  private int MaxDateNum;  // 最后可見條目的索引  private int lastVisibleIndex;    /** Called when the activity is first created. */  @Override  public void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentView(R.layout.main);            MaxDateNum = 22; // 設置最大數據條數    lv = (ListView) findViewById(R.id.lv);    // 實例化底部布局    moreView = getLayoutInflater().inflate(R.layout.moredate, null);    bt = (Button) moreView.findViewById(R.id.bt_load);    pg = (ProgressBar) moreView.findViewById(R.id.pg);    handler = new Handler();    // 用map來裝載數據，初始化10條數據    list = new ArrayList<HashMap<String,String>>();    for (int i = 0; i < 10; i++) {      HashMap<String, String> map = new HashMap<String, String>();      map.put("ItemTitle", "第" + i + "行標題");      map.put("ItemText", "第" + i + "行內容");      list.add(map);    }    // 實例化SimpleAdapter    mSimpleAdapter = new SimpleAdapter(this, list, R.layout.item,        new String[] { "ItemTitle", "ItemText" },        new int[] { R.id.tv_title, R.id.tv_content });    // 加上底部View，注意要放在setAdapter方法前    lv.addFooterView(moreView);    lv.setAdapter(mSimpleAdapter);    // 綁定監聽器    lv.setOnScrollListener(this);    bt.setOnClickListener(new OnClickListener() {      @Override      public void onClick(View v) {        pg.setVisibility(View.VISIBLE);// 將進度條可見        bt.setVisibility(View.GONE);// 按鈕不可見        handler.postDelayed(new Runnable() {          @Override          public void run() {            loadMoreDate();// 加載更多數據            bt.setVisibility(View.VISIBLE);            pg.setVisibility(View.GONE);            mSimpleAdapter.notifyDataSetChanged();// 通知listView刷新數據          }        }, 2000);      }    });  }  private void loadMoreDate() {    int count = mSimpleAdapter.getCount();    if (count + 5 < MaxDateNum) {      // 每次加載5條      for (int i = count; i < count + 5; i++) {        HashMap<String, String> map = new HashMap<String, String>();        map.put("ItemTitle", "新增第" + i + "行標題");        map.put("ItemText", "新增第" + i + "行內容");        list.add(map);      }    } else {      // 數據已經不足5條      for (int i = count; i < MaxDateNum; i++) {        HashMap<String, String> map = new HashMap<String, String>();        map.put("ItemTitle", "新增第" + i + "行標題");        map.put("ItemText", "新增第" + i + "行內容");        list.add(map);      }    }  }  @Override  public void onScroll(AbsListView view, int firstVisibleItem,      int visibleItemCount, int totalItemCount) {    // 計算最后可見條目的索引    lastVisibleIndex = firstVisibleItem + visibleItemCount - 1;    // 所有的條目已經和最大條數相等，則移除底部的View    if (totalItemCount == MaxDateNum + 1) {      lv.removeFooterView(moreView);      Toast.makeText(this, "數據全部加載完成，沒有更多數據！", Toast.LENGTH_LONG).show();    }  }  @Override  public void onScrollStateChanged(AbsListView view, int scrollState) {    // 滑到底部后自動加載，判斷listview已經停止滾動并且最后可視的條目等于adapter的條目    if (scrollState == OnScrollListener.SCROLL_STATE_IDLE        && lastVisibleIndex == mSimpleAdapter.getCount()) {      // 當滑到底部時自動加載      // pg.setVisibility(View.VISIBLE);      // bt.setVisibility(View.GONE);      // handler.postDelayed(new Runnable() {      //      // @Override      // public void run() {      // loadMoreDate();      // bt.setVisibility(View.VISIBLE);      // pg.setVisibility(View.GONE);      // mSimpleAdapter.notifyDataSetChanged();      // }      //      // }, 2000);    }  }  }

通過注釋，大家應該很容易理解了。這里做下簡單的解析。首先要注意的是，addFootView方法一定要在setAdapter方法之前，否則會無效。addFootView方法為listview底部加入一個視圖，在本例中就是那個Button加progressbar的視圖。當用戶點擊按鈕時，調用loadmoreDate方法，為listview綁定更多的數據，通過adapter的notifyDataSetChanged方法通知listview刷新，顯示剛加入的數據。

這里用handler異步延遲2秒操作，模仿加載過程。同時listview綁定了onScrollListener監聽器，并且實現了onScroll和onScrollStateChanged方法。在后者方法中，我們通過判斷listview已經停止滾動并且最后可視的條目等于adapter的條目，可以知道用戶已經滑動到底部并且自動加載，代碼中將這部分代碼注釋掉了，大家可以自己試下。

代碼中還加入了一個MaxDateNum變量，用來記錄最大的數據數量。也就是說網絡或者其他地方一共的數據。通過onScroll方法判斷用戶加載完這些數據后，移除listview底部視圖，不讓繼續加載。同時在loadmoreDate方法中也對最大數據量做相應的操作來判斷加載數量。（默認加載5條，不足5條時加載剩余的）。

看下效果圖：

2016322143446104.png (480×800) 2016322143519983.png (480×800) 2016322143533203.png (480×800) 2016322143551742.png (480×800)

關于OnScrollListener事件順序次數的簡要分析
在 Android 的 OnScrollListener 整個事件我主要分析下他的執行順序：
實現滾動事件的監聽接口

new AbsListView.OnScrollListener(){   @Override   public void onScrollStateChanged(AbsListView absListView, int scrollState)   {     switch (scrollState) {       case AbsListView.OnScrollListener.SCROLL_STATE_TOUCH_SCROLL:         // 手指觸屏拉動準備滾動，只觸發一次    順序: 2         break;       case AbsListView.OnScrollListener.SCROLL_STATE_FLING:         // 持續滾動開始，只觸發一次        順序: 4         break;       case AbsListView.OnScrollListener.SCROLL_STATE_IDLE:         // 整個滾動事件結束，只觸發一次      順序: 6         break;       default:         break;     }   }    @Override   public void onScroll(AbsListView absListView, int i, int i1, int i2)   {     // 一直在滾動中，多次觸發             順序: 1、3、5   } }

之前一直很迷糊，后來仔細測試后得出上面代碼注釋中的結論。
另外對于 ListView 圖片列表的滾動，應該在SCROLL_STATE_FLING時讓圖片不顯示，提高滾動性能讓滾動更平滑，SCROLL_STATE_IDLE時顯示當前屏幕可見的圖片，對于onScroll()接口方法基本上不用他。
補充：
1. 當手指只輕觸屏幕不拉動只會觸發一次onScroll方法，不會觸發其他滾動事件；
2. 如果手指觸碰屏幕后停滯一下再滑動則首先執行一次onScroll方法然后才是SCROLL_STATE_TOUCH_SCROLL事件；
3. 如果手指碰到屏幕后直接滑動則第一次就執行SCROLL_STATE_TOUCH_SCROLL事件；
3. 觸發SCROLL_STATE_TOUCH_SCROLL事件后還會繼續多次觸發onScroll事件，而不是直接觸發SCROLL_STATE_FLING事件；
4. 滾動后不一定會觸發 SCROLL_STATE_FLING事件，可能和手指滑動的距離有關系；
5. 滾動的過程中會多次調用onScroll方法；
6. 除了onScroll觸發多次，其他事件在整個過程中只會觸發一次。