Android 中 ListView 分頁加載數據

熟悉Android的朋友們都知道,無論是微博客戶端仍是新聞客戶端,都離不開列表組件,能夠說列表組件是Android數據展示方面最重要的組 件,咱們今天就要講一講列表組件ListView加載數據的相關內容。一般來講,一個應用在展示大量數據時,不會將所有的可用數據都呈現給用戶,由於這不 管對於服務端仍是客戶端來講都是不小的壓力,所以,不少應用都是採用分批次加載的形式來獲取用戶所需的數據。好比:微博客戶端可能會在用戶滑動至列表底端 時自動加載下一頁數據,也可能在底部放置一個「加載更多」按鈕,用戶點擊後,加載下一頁數據。java

咱們今天就結合實例來演示一下使用ListView獲取數據的過程。android

新建一個loadmore項目,咱們來看一下結構圖和最終效果圖:app

左圖中包含了三個佈局文件、一個Adapter和一個Activity,右圖是咱們運行後的主界面。異步

其中,main.xml是主界面的佈局文件,它包含一個ListView組件,代碼以下:ide

<?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代碼以下:post

<?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:this

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會被調用。spa

咱們來演示一下這個加載過程:

如圖,當點擊完按鈕後,出現加載動做,加載完以後如右圖所示,新數據緊接在原數據以後。而後咱們滑動到底部,加載按鈕仍可工做:


最後,咱們測試一下滑動列表到底部,而後鬆開,控制檯打印以下:


咱們看到onScrollStateChanged方法裏的if語句裏代碼執行了,因此若是咱們但願自動加載的話,能夠把加載代碼放於此處。

相關文章
相關標籤/搜索