1. 程式人生 > >面試問題之:Android中ListView分頁載入資料

面試問題之:Android中ListView分頁載入資料

熟悉Android的朋友們都知道,不管是微部落格戶端還是新聞客戶端,都離不開列表元件,可以說列表元件是Android資料展現方面最重要的元件,我們今天就要講一講列表元件ListView載入資料的相關內容。通常來說,一個應用在展現大量資料時,不會將全部的可用資料都呈現給使用者,因為這不管對於服務端還是客戶端來說都是不小的壓力,因此,很多應用都是採用分批次載入的形式來獲取使用者所需的資料。比如:微部落格戶端可能會在使用者滑動至列表底端時自動載入下一頁資料,也可能在底部放置一個“載入更多”按鈕,使用者點選後,載入下一頁資料。

我們今天就結合例項來演示一下使用ListView獲取資料的過程。

新建一個loadmore專案,我們來看一下結構圖和最終效果圖:

 

左圖中包含了三個佈局檔案、一個Adapter和一個Activity,右圖是我們執行後的主介面。

其中,main.xml是主介面的佈局檔案,它包含一個ListView元件,程式碼如下:

  1. <?xmlversion="1.0"encoding="utf-8"?>
  2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:orientation="vertical"
  4.     android:layout_width
    ="fill_parent"
  5.     android:layout_height="fill_parent"
  6.     android:paddingLeft="3dp"
  7.     android:paddingRight="3dp">
  8.     <ListView
  9.         android:id="@id/android:list"
  10.         android:layout_width="fill_parent"
  11.         android:layout_height="wrap_content"/>
  12. </LinearLayout>
這裡我們引用了Android內建的名為list的id,因為我們後面要使用到ListActivity,我們的MainActivity繼承於它。

然後就是list_item.xml,它是ListView中單個列表項的佈局檔案,從效果圖中可以看到,這裡只使用到了一個TextView元件,list_item.xml程式碼如下:

  1. <?xmlversion="1.0"encoding="utf-8"?>
  2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:orientation="vertical"
  4.     android:layout_width="fill_parent"
  5.     android:layout_height="fill_parent">
  6.     <TextView
  7.         android:id="@+id/list_item_text"
  8.         android:layout_width="fill_parent"
  9.         android:layout_height="fill_parent"
  10.         android:gravity="center"
  11.         android:textSize="20sp"
  12.         android:paddingTop="10dp"
  13.         android:paddingBottom="10dp"/>
  14. </LinearLayout>
我們注意到在右圖中列表底部有一個按鈕不同於其他的列表項,這是什麼情況?事實上這個按鈕是我們在ListView底部新增的一個檢視。ListView元件提供了兩個很實用的功能,那就是可以在頂部和底部新增自定義的檢視。我們在此處ListView的底部添加了一個檢視用來載入更多資料,這個檢視對應著load_more.xml佈局檔案,程式碼如下:
  1. <?xmlversion="1.0"encoding="utf-8"?>
  2. <LinearLayout
  3.   xmlns:android="http://schemas.android.com/apk/res/android"
  4.   android:orientation="vertical"
  5.   android:layout_width="fill_parent"
  6.   android:layout_height="wrap_content">
  7.   <Button
  8.         android:id="@+id/loadMoreButton"
  9.         android:layout_width="fill_parent"
  10.         android:layout_height="wrap_content"
  11.         android:text="load more"
  12.         android:onClick="loadMore"/>
  13. </LinearLayout>
接下來我們來了解一下我們的Adapter,ListViewAdapter程式碼如下:
  1. package com.scott.loadmore;  
  2. import java.util.List;  
  3. import android.content.Context;  
  4. import android.view.LayoutInflater;  
  5. import android.view.View;  
  6. import android.view.ViewGroup;  
  7. import android.widget.BaseAdapter;  
  8. import android.widget.TextView;  
  9. publicclass ListViewAdapter extends BaseAdapter {  
  10.     private List<String> items;  
  11.     private LayoutInflater inflater;  
  12.     public ListViewAdapter(Context context, List<String> items) {  
  13.         this.items = items;  
  14.         inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);        
  15.     }  
  16.     @Override
  17.     publicint getCount() {  
  18.         return items.size();  
  19.     }  
  20.     @Override
  21.     public Object getItem(int position) {  
  22.         return items.get(position);  
  23.     }  
  24.     @Override
  25.     publiclong getItemId(int position) {  
  26.         return position;  
  27.     }  
  28.     @Override
  29.     public View getView(int position, View view, ViewGroup parent) {  
  30.         if (view == null) {  
  31.             view = inflater.inflate(R.layout.list_item, null);  
  32.         }  
  33.         TextView text = (TextView) view.findViewById(R.id.list_item_text);  
  34.         text.setText(items.get(position));  
  35.         return view;  
  36.     }  
  37.     /** 
  38.      * 新增列表項 
  39.      * @param item 
  40.      */
  41.     publicvoid addItem(String item) {  
  42.         items.add(item);  
  43.     }  
  44. }  
這個ListViewAdapter是我們自定義介面卡,它繼承自BaseAdapter,例項化此介面卡需要一個Context物件來獲取LayoutInflater例項和一個集合物件來充當介面卡的資料集;在getView方法中我們填充list_item.xml佈局檔案,完成列表每一項的資料顯示;addItem方法用來在載入資料時向資料集中新增新資料。

最後我們來看一下MainActivity:

  1. package com.scott.loadmore;  
  2. import java.util.ArrayList;  
  3. import<