本文内容

• 环境
• 项目结构
• 演示 1：简单 XListView
• 演示 2：XListView + Fragment
• 演示 3：XListView + ViewPager + Fragment

本文三个演示，循序渐进。

• 演示 1 是 GitHub 上的 ，具备“下拉更新”和“上拉加载”功能，使用它自己的示例；
• 演示 2 是将 XListView 控件封装到 Fragment 中，个人认为，这种封装在实际项目还是比较常用的；
• 演示 3 是进一步将 XListView 与 ViewPager 和 Fragment 相结合。也就是在演示 2 基础上，每个 ViewPager 的页都是 XListView 和 Fragment。

环境

---

• Windows 2008 R2 64 位
• Eclipse ADT V22.6.2，Android 4.4.2（API 19）
• SAMSUNG GT-8618，Android OS 4.1.2

项目结构

---

图 1 项目结构和主程序界面

演示 1：简单 XListView

---

这是 上的一个项目。本演示，只是简单说明它的功能。

图 2 演示 1

package com.wallace.xlistview.ui;

import java.util.ArrayList;

import com.wallace.xlistview.R;

import com.wallace.xlistview.widget.XListView;

import com.wallace.xlistview.widget.XListView.IXListViewListener;

import android.app.Activity;

import android.os.Bundle;

import android.os.Handler;

import android.view.View;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemClickListener;

import android.widget.AdapterView.OnItemSelectedListener;

import android.widget.ArrayAdapter;

import android.widget.Toast;

public class XListSimpleActivity extends Activity implements IXListViewListener {

private XListView mListView;

private ArrayAdapter
      
        mAdapter;
      

private ArrayList
      
        items = new ArrayList
       
        ();
       
      

private Handler mHandler;

private int start = 0;

private static int refreshCnt = 0;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_simple);

geneItems();

initClass();

initControl();

initXList();

}

private void geneItems() {

for (int i = 0; i != 20; ++i) {

items.add("refresh cnt " + (++start));

}

}

private void initClass() {

mHandler = new Handler();

}

private void initControl() {

mListView = (XListView) findViewById(R.id.xListView_a);

mAdapter = new ArrayAdapter
      
       (this, R.layout.xlist_simpleitem,
      

items);

}

private void initXList() {

mListView.setPullLoadEnable(true);

mListView.setPullRefreshEnable(true);

mListView.setAdapter(mAdapter);

mListView.setXListViewListener(this);

mListView.setOnItemClickListener(new OnItemClickListener() {

@Override

public void onItemClick(AdapterView
       parent, View view,

int position, long id) {

Toast.makeText(getApplicationContext(), items.get(position),

Toast.LENGTH_SHORT).show();

}

});

mListView.setOnItemSelectedListener(new OnItemSelectedListener() {

@Override

public void onItemSelected(AdapterView
       parent, View view,

int position, long id) {

Toast.makeText(getApplicationContext(), items.get(position),

Toast.LENGTH_SHORT).show();

}

@Override

public void onNothingSelected(AdapterView
       parent) {

}

});

}

private void onLoad() {

mListView.stopRefresh();

mListView.stopLoadMore();

mListView.setRefreshTime("刚刚");

}

// Refresh

@Override

public void onRefresh() {

mHandler.postDelayed(new Runnable() {

@Override

public void run() {

start = ++refreshCnt;

items.clear();

geneItems();

// mAdapter.notifyDataSetChanged();

mAdapter = new ArrayAdapter
      
       (XListSimpleActivity.this,
      

R.layout.xlist_simpleitem, items);

mListView.setAdapter(mAdapter);

onLoad();

}

}, 2000);

}

// LoadMore

@Override

public void onLoadMore() {

mHandler.postDelayed(new Runnable() {

@Override

public void run() {

geneItems();

mAdapter.notifyDataSetChanged();

onLoad();

}

}, 2000);

}

}

演示 2：XListView + Fragment

---

接下来，我就在想，如何将 XListView 放到 Fragment 中，毕竟实际项目中，这种情况可能会多点，这样，就能将 Fragment 放到 FrameLayout 里。顺便把数据换成自己的。

图 3 演示 2

package com.wallace.xlistview.view;

import java.util.ArrayList;

import java.util.List;

import com.wallace.xlistview.R;

import com.wallace.xlistview.dao.MusicDao;

import com.wallace.xlistview.entity.MusicItemEntity;

import com.wallace.xlistview.utils.ImageLoader;

import com.wallace.xlistview.widget.XListView;

import com.wallace.xlistview.widget.XListView.IXListViewListener;

import android.annotation.SuppressLint;

import android.app.Activity;

import android.content.Context;

import android.os.AsyncTask;

import android.os.Bundle;

import android.os.Handler;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseAdapter;

import android.widget.ImageView;

import android.widget.TextView;

@SuppressLint({ "ValidFragment", "HandlerLeak" })

public class MusicXListFragment extends Fragment implements IXListViewListener {

protected List
      
        musics = null;
      

private MusicDao musicDao;

protected Activity mActivity;

protected XListView listview;

protected NewXListFragmentAdapter mAdapter;

protected View view;

public LayoutInflater mInflater;

private Handler mHandler;

public MusicXListFragment(Activity c, List
      
        list) {
      

this.mActivity = c;

if (list != null) {

this.musics = list;

}

}

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

mHandler = new Handler();

musicDao = new MusicDao(this.mActivity);

}

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

super.onCreateView(inflater, container, savedInstanceState);

mInflater = inflater;

view = inflater.inflate(R.layout.xlist_main, null);

listview = (XListView) view.findViewById(R.id.xListView_b);

listview.setPullLoadEnable(true);

listview.setPullRefreshEnable(true);

listview.setXListViewListener(this);

mAdapter = new NewXListFragmentAdapter(mActivity, this.musics);

listview.setAdapter(mAdapter);

return view;

}

@Override

public void onSaveInstanceState(Bundle outState) {

super.onSaveInstanceState(outState);

}

protected void onLoad() {

listview.stopRefresh();

listview.stopLoadMore();

listview.setRefreshTime("刚刚");

}

/**

* onRefresh

*/

@Override

public void onRefresh() {

mHandler.postDelayed(new Runnable() {

@Override

public void run() {

new MyTask().execute(musicDao);

onLoad();

}

}, 2000);

}

/**

* onLoadMore

*/

@Override

public void onLoadMore() {

mHandler.postDelayed(new Runnable() {

@Override

public void run() {

new MyTask().execute(musicDao);

onLoad();

}

}, 2000);

}

class NewXListFragmentAdapter extends BaseAdapter {

private Activity activity;

private LayoutInflater inflater = null;

public ImageLoader imageLoader;

private List
      
        musics;
      

public NewXListFragmentAdapter(List
      
        lists) {
      

musics = lists;

inflater = (LayoutInflater) activity

.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

imageLoader = new ImageLoader(activity.getApplicationContext());

}

public NewXListFragmentAdapter(Activity a, List
      
        lists) {
      

activity = a;

musics = lists;

inflater = (LayoutInflater) activity

.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

imageLoader = new ImageLoader(activity.getApplicationContext());

}

public void appendToList(List
      
        lists) {
      

if (lists == null) {

return;

}

if (musics == null) {

musics = new ArrayList
      
       ();
      

}

musics.addAll(lists);

notifyDataSetChanged();

}

public int getCount() {

return musics == null ? 0 : musics.size();

}

public Object getItem(int position) {

return position;

}

public long getItemId(int position) {

return position;

}

public View getView(int position, View convertView, ViewGroup parent) {

View vi = convertView;

if (convertView == null)

vi = inflater.inflate(R.layout.xlist_row, null);

MusicItemEntity song = null;

ImageView image = (ImageView) vi.findViewById(R.id.imagethumb);

TextView tvartist = (TextView) vi.findViewById(R.id.artist);

TextView tvtitle = (TextView) vi.findViewById(R.id.title);

TextView tvduration = (TextView) vi.findViewById(R.id.duration);

song = musics.get(position);

imageLoader.DisplayImage(song.getThumbUrl(), image);

tvartist.setText(song.getArtist());

tvtitle.setText(song.getTitle());

tvduration.setText(song.getDuration());

return vi;

}

}

/**

* MyTask

*/

public class MyTask extends

AsyncTask
      
       > {
      

public MyTask() {

}

public MyTask(boolean useCache) {

}

@Override

protected void onPreExecute() {

super.onPreExecute();

}

@Override

protected List
      
        doInBackground(MusicDao... params) {
      

MusicDao dao = params[0];

List
      
        list = dao.getMore();
      

return list;

}

@Override

protected void onPostExecute(List
      
        result) {
      

// TODO Auto-generated method stub

super.onPostExecute(result);

mAdapter.appendToList(result);

mAdapter.notifyDataSetChanged();

}

}

}

说明：当然，你也可以把 NewXListFragmentAdapter 类单独写成一个 .java 文件，这里只是为了演示方便，但是 Demo 里是独立的。

演示 3：XListView + ViewPager + Fragment

---

然后再想，在演示 2 基础上，每个 Fragment 如何变成 ViewPager 的一页。

图 4 演示 3

package com.wallace.xlistview.ui;

import java.util.ArrayList;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

import com.wallace.xlistview.R;

//import com.wallace.xlistview.adapter.NewXListPageFragmentAdapter;

import com.wallace.xlistview.dao.MusicDao;

import com.wallace.xlistview.entity.CategorysEntity;

import com.wallace.xlistview.entity.MusicList;

import com.wallace.xlistview.view.HttpErrorFragment;

import com.wallace.xlistview.view.MusicXListFragment;

import android.app.Activity;

import android.os.AsyncTask;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentActivity;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentStatePagerAdapter;

import android.support.v4.view.PagerTabStrip;

import android.support.v4.view.ViewPager;

import android.util.Log;

import android.view.ViewGroup;

import android.view.Window;

public class XListPagerFragmentActivity extends FragmentActivity {

private ViewPager mViewPager;

private NewXListPageFragmentAdapter mBasePageAdapter;

private PagerTabStrip mPagerTabStrip;

private List
      
        categoryList;
      

private MusicDao musicDao;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.activity_viewpager);

initClass();

initControl();

initViewPager();

}

private void initControl() {

mViewPager = (ViewPager) findViewById(R.id.above_pager);

mPagerTabStrip = (PagerTabStrip) findViewById(R.id.myPagerTabStrip);

}

private void initClass() {

musicDao = new MusicDao(this);

mBasePageAdapter = new NewXListPageFragmentAdapter(

this.getSupportFragmentManager());

mBasePageAdapter.setActvity(XListPagerFragmentActivity.this);

}

private void initViewPager() {

mPagerTabStrip.setTabIndicatorColor(getResources()

.getColor(R.color.red));

mPagerTabStrip.setDrawFullUnderline(false);

mPagerTabStrip.setBackgroundColor(getResources()

.getColor(R.color.green));

// mPagerTabStrip.setTextSpacing(50);

mViewPager.setOffscreenPageLimit(0);

mViewPager.setAdapter(mBasePageAdapter);

new MyTask().execute(musicDao);

}

/* execute after killed */

@Override

public void onSaveInstanceState(Bundle outState) {

super.onSaveInstanceState(outState);

}

class NewXListPageFragmentAdapter extends FragmentStatePagerAdapter {

public ArrayList
      
        mFragments = new ArrayList
       
        ();
       
      

public List
      
        tabs = new ArrayList
       
        ();
       
      

private Activity mActivity;

public NewXListPageFragmentAdapter(FragmentManager fragmentManager) {

// TODO Auto-generated constructor stub

super(fragmentManager);

}

public void setActvity(Activity a) {

this.mActivity = a;

}

public void addFragment(List
      
        mList,
      

List
      
        listObject) {
      

tabs.addAll(mList);

for (int i = 0; i < listObject.size(); i++) {

MusicList musics = listObject.get(i);

addTab(new MusicXListFragment(mActivity, musics.getMusics()));

}

}

/**

* only load listview, donot include tabs

*

* @param listObject

*/

public void addFragment(List
      
        listObject) {
      

for (int i = 0; i < listObject.size(); i++) {

MusicList musics = listObject.get(i);

addTab(new MusicXListFragment(mActivity, musics.getMusics()));

}

}

public void addNullFragment() {

CategorysEntity cate = new CategorysEntity();

cate.setName("connect error");

tabs.add(cate);

addTab(new HttpErrorFragment());

}

public void Clear() {

mFragments.clear();

tabs.clear();

}

public void addTab(Fragment fragment) {

mFragments.add(fragment);

notifyDataSetChanged();

}

@Override

public CharSequence getPageTitle(int position) {

Log.d("vp-getPageTitle", tabs.get(position).getName());

return tabs.get(position).getName();

}

@Override

public Fragment getItem(int arg0) {

Log.d("vp-getItem", String.format("%s", arg0));

return mFragments.get(arg0);

}

// 初始化每个页卡选项

@Override

public Object instantiateItem(ViewGroup arg0, int position) {

Log.d("vp-instantiateItem", String.format("%s", position));

return super.instantiateItem(arg0, position);

}

@Override

public int getCount() {

Log.d("vp-instantiateItem", String.format("%s", mFragments.size()));

return mFragments.size();

}

@Override

public void destroyItem(ViewGroup container, int position, Object object) {

// TODO Auto-generated method stub

super.destroyItem(container, position, object);

}

}

public class MyTask extends

AsyncTask
      
       > {
      

public MyTask() {

}

public MyTask(boolean useCache) {

}

@Override

protected void onPreExecute() {

mViewPager.removeAllViews();

mBasePageAdapter.Clear();

super.onPreExecute();

}

@Override

protected Map
      
        doInBackground(MusicDao... params) {
      

MusicDao dao = params[0];

List
      
        categorys = new ArrayList
       
        ();
       
      

Map
      
        map = new HashMap
       
        ();
       
      

if ((categoryList = dao.getClassEntity()) != null) {

categorys = dao.getCategorys();

map.put("tabs", categorys);

map.put("list", categoryList);

}

return map;

// return null;

}

@SuppressWarnings("unchecked")

@Override

protected void onPostExecute(Map
      
        result) {
      

// TODO Auto-generated method stub

super.onPostExecute(result);

mBasePageAdapter.Clear();

mViewPager.removeAllViews();

if (result != null && !result.isEmpty()) {

mBasePageAdapter.addFragment(

(List
      
       ) result.get("tabs"),
      

(List
      
       ) result.get("list"));
      

} else {

mBasePageAdapter.addNullFragment();

}

mBasePageAdapter.notifyDataSetChanged();

mViewPager.setCurrentItem(0);

}

}

}

说明：当然，你也可以把 NewXListPageFragmentAdapter 类单独写成一个 .java 文件，这里只是为了演示方便，但是 Demo 里是独立的。

注意：演示 3 是有问题的，不知道为什么 ViewPager 每页的名字显示不出来。