熟悉Android的朋友們都知道,不管是微部落格戶端還是新聞用戶端,都離不開列表組件,可以說列表組件是Android資料展現方面最重要的組件,我們 今天就要講一講列表組件ListView載入資料的相關內容。通常來說,一個應用在展現大量資料時,不會將全部的可用資料都呈現給使用者,因為這不管對於服 務端還是用戶端來說都是不小的壓力,因此,很多應用都是採用分批次載入的形式來擷取使用者所需的資料。比如:微部落格戶端可能會在使用者滑動至列表底端時自動加 載下一頁資料,也可能在底部放置一個“載入更多”按鈕,使用者點擊後,載入下一頁資料。
我們今天就結合執行個體來示範一下使用ListView擷取資料的過程。
建立一個loadmore項目,我們來看一下結構圖和最終效果圖:
左圖中包含了三個布局檔案、一個Adapter和一個Activity,右圖是我們運行後的主介面。
其中,main.xml是主介面的布局檔案,它包含一個ListView組件,代碼如下:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:paddingLeft="3dp" android:paddingRight="3dp"> <ListView android:id="@id/android:list" android:layout_width="fill_parent" android:layout_height="wrap_content"/> </LinearLayout>
這裡我們引用了Android內建的名為list的id,因為我們後面要使用到ListActivity,我們的MainActivity繼承於它。
然後就是list_item.xml,它是ListView中單個清單項目的布局檔案,從效果圖中可以看到,這裡只使用到了一個TextView組件,list_item.xml代碼如下:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:id="@+id/list_item_text" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:textSize="20sp" android:paddingTop="10dp" android:paddingBottom="10dp"/> </LinearLayout>
我們注意到在右圖中列表底部有一個按鈕不同於其他的清單項目,這是什麼情況?事實上這個按鈕是我們在ListView底部添加的一個視圖。 ListView組件提供了兩個很實用的功能,那就是可以在頂部和底部添加自訂的視圖。我們在此處ListView的底部添加了一個視圖用來載入更多數 據,這個視圖對應著load_more.xml布局檔案,代碼如下:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content"> <Button android:id="@+id/loadMoreButton" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="load more" android:onClick="loadMore"/> </LinearLayout>
接下來我們來瞭解一下我們的Adapter,ListViewAdapter代碼如下:
package com.scott.loadmore; import java.util.List; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.TextView; public class ListViewAdapter extends BaseAdapter { private List<String> items; private LayoutInflater inflater; public ListViewAdapter(Context context, List<String> items) { this.items = items; inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); } @Override public int getCount() { return items.size(); } @Override public Object getItem(int position) { return items.get(position); } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View view, ViewGroup parent) { if (view == null) { view = inflater.inflate(R.layout.list_item, null); } TextView text = (TextView) view.findViewById(R.id.list_item_text); text.setText(items.get(position)); return view; } /** * 添加清單項目 * @param item */ public void addItem(String item) { items.add(item); } }
這個ListViewAdapter是我們自訂配接器,它繼承自BaseAdapter,執行個體化此適配器需要一個Context對象來擷取 LayoutInflater執行個體和一個集合對象來充當適配器的資料集;在getView方法中我們填充list_item.xml布局檔案,自動完成清單每 一項的資料顯示;addItem方法用來在載入資料時向資料集中添加新資料。
最後我們來看一下MainActivity:
package com.scott.loadmore; import java.util.ArrayList; import android.app.ListActivity; import android.os.Bundle; import android.os.Handler; import android.util.Log; import android.view.View; import android.widget.AbsListView; import android.widget.AbsListView.OnScrollListener; import android.widget.Button; import android.widget.ListView; public class MainActivity extends ListActivity implements OnScrollListener { private ListView listView; private int visibleLastIndex = 0; //最後的可視項索引 private int visibleItemCount; // 當前視窗可見項總數 private ListViewAdapter adapter; private View loadMoreView; private Button loadMoreButton; private Handler handler = new Handler(); @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); loadMoreView = getLayoutInflater().inflate(R.layout.load_more, null); loadMoreButton = (Button) loadMoreView.findViewById(R.id.loadMoreButton); listView = getListView(); //擷取id是list的ListView listView.addFooterView(loadMoreView); //設定列表底部視圖 initAdapter(); setListAdapter(adapter); //自動為id是list的ListView設定適配器 listView.setOnScrollListener(this); //添加滑動監聽 } /** * 初始化適配器 */ private void initAdapter() { ArrayList<String> items = new ArrayList<String>(); for (int i = 0; i < 10; i++) { items.add(String.valueOf(i + 1)); } adapter = new ListViewAdapter(this, items); } /** * 滑動時被調用 */ @Override public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) { this.visibleItemCount = visibleItemCount; visibleLastIndex = firstVisibleItem + visibleItemCount - 1; } /** * 滑動狀態改變時被調用 */ @Override public void onScrollStateChanged(AbsListView view, int scrollState) { int itemsLastIndex = adapter.getCount() - 1; //資料集最後一項的索引 int lastIndex = itemsLastIndex + 1; //加上底部的loadMoreView項 if (scrollState == OnScrollListener.SCROLL_STATE_IDLE && visibleLastIndex == lastIndex) { //如果是自動載入,可以在這裡放置非同步載入資料的代碼 Log.i("LOADMORE", "loading..."); } } /** * 點擊按鈕事件 * @param view */ public void loadMore(View view) { loadMoreButton.setText("loading..."); //設定按鈕文字loading handler.postDelayed(new Runnable() { @Override public void run() { loadData(); adapter.notifyDataSetChanged(); //資料集變化後,通知adapter listView.setSelection(visibleLastIndex - visibleItemCount + 1); //設定選中項 loadMoreButton.setText("load more"); //恢複按鈕文字 } }, 2000); } /** * 類比載入資料 */ private void loadData() { int count = adapter.getCount(); for (int i = count; i < count + 10; i++) { adapter.addItem(String.valueOf(i + 1)); } } }
如代碼所示,我們在onCreate方法被調用時擷取listView組件,設定其底部視圖為loadMoreView,它包含一個按鈕,點擊時會 觸發loadMore方法調用,另外在為listView設定完適配器時,又為其設定了滑動事件監聽器,滑動列表時onScroll會被調用,滑動狀態改 變時onScrollStateChanged會被調用。
我們來示範一下這個載入過程:
如圖,當點擊完按鈕後,出現載入動作,載入完之後如右圖所示,新資料緊接在原資料之後。然後我們滑動到底部,載入按鈕仍可工作:
最後,我們測試一下滑動列表到底部,然後鬆開,控制台列印如下:
以上就是本文的全部內容,希望對大家的學習有所協助,也希望大家多多支援雲棲社區。