Android 快速开发系列 打造万能的ListView GridView 适配器

时间:2021-11-28 08:43:04

转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38902805 ,本文出自【张鸿洋的博客】

1、概述

相信做Android开发的写得最多的就是ListView,GridView的适配器吧,记得以前开发一同事开发项目,一个项目下来基本就一直在写ListView的Adapter都快吐了~~~对于Adapter一般都继承BaseAdapter复写几个方法,getView里面使用ViewHolder模式,其实大部分的代码基本都是类似的。

本篇博客为快速开发系列的第一篇,将一步一步带您封装出一个通用的Adapter。

2、常见的例子

首先看一个最常见的案例,大家一目十行的扫一眼

1、布局文件

主布局文件:

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent" >
  5. <ListView
  6. android:id="@+id/id_lv_main"
  7. android:layout_width="fill_parent"
  8. android:layout_height="fill_parent" />
  9. </RelativeLayout>

Item的布局文件:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <TextView xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:id="@+id/id_tv_title"
  4. android:layout_width="match_parent"
  5. android:layout_height="50dp"
  6. android:background="#aa111111"
  7. android:gravity="center_vertical"
  8. android:paddingLeft="15dp"
  9. android:textColor="#ffffff"
  10. android:text="hello"
  11. android:textSize="20sp"
  12. android:textStyle="bold" >
  13. </TextView>

2、Adapter

  1. package com.example.zhy_baseadapterhelper;
  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. public class MyAdapter extends BaseAdapter
  10. {
  11. private LayoutInflater mInflater;
  12. private Context mContext;
  13. private List<String> mDatas;
  14. public MyAdapter(Context context, List<String> mDatas)
  15. {
  16. mInflater = LayoutInflater.from(context);
  17. this.mContext = context;
  18. this.mDatas = mDatas;
  19. }
  20. @Override
  21. public int getCount()
  22. {
  23. return mDatas.size();
  24. }
  25. @Override
  26. public Object getItem(int position)
  27. {
  28. return mDatas.get(position);
  29. }
  30. @Override
  31. public long getItemId(int position)
  32. {
  33. return position;
  34. }
  35. @Override
  36. public View getView(int position, View convertView, ViewGroup parent)
  37. {
  38. ViewHolder viewHolder = null;
  39. if (convertView == null)
  40. {
  41. convertView = mInflater.inflate(R.layout.item_single_str, parent,
  42. false);
  43. viewHolder = new ViewHolder();
  44. viewHolder.mTextView = (TextView) convertView
  45. .findViewById(R.id.id_tv_title);
  46. convertView.setTag(viewHolder);
  47. } else
  48. {
  49. viewHolder = (ViewHolder) convertView.getTag();
  50. }
  51. viewHolder.mTextView.setText(mDatas.get(position));
  52. return convertView;
  53. }
  54. private final class ViewHolder
  55. {
  56. TextView mTextView;
  57. }
  58. }

3、Activity

  1. package com.example.zhy_baseadapterhelper;
  2. import java.util.ArrayList;
  3. import java.util.Arrays;
  4. import java.util.List;
  5. import android.app.Activity;
  6. import android.os.Bundle;
  7. import android.widget.ListView;
  8. public class MainActivity extends Activity
  9. {
  10. private ListView mListView;
  11. private List<String> mDatas = new ArrayList<String>(Arrays.asList("Hello",
  12. "World", "Welcome"));
  13. private MyAdapter mAdapter;
  14. @Override
  15. protected void onCreate(Bundle savedInstanceState)
  16. {
  17. super.onCreate(savedInstanceState);
  18. setContentView(R.layout.activity_main);
  19. mListView = (ListView) findViewById(R.id.id_lv_main);
  20. mListView.setAdapter(mAdapter = new MyAdapter(this, mDatas));
  21. }
  22. }

上面这个例子大家应该都写了无数遍了,MyAdapter集成BaseAdapter,然后getView里面使用ViewHolder模式;一般情况下,我们的写法是这样的:对于不同布局的ListView,我们会有一个对应的Adapter,在Adapter中又会有一个ViewHolder类来提高效率。

这样出现ListView就会出现与之对于的Adapter类、ViewHolder类;那么有没有办法减少我们的编码呢?

下面首先拿ViewHolder开刀~

3、通用的ViewHolder

首先分析下ViewHolder的作用,通过convertView.setTag与convertView进行绑定,然后当convertView复用时,直接从与之对于的ViewHolder(getTag)中拿到convertView布局中的控件,省去了findViewById的时间~

也就是说,实际上们每个convertView会绑定一个ViewHolder对象,这个viewHolder主要用于帮convertView存储布局中的控件。

那么我们只要写出一个通用的ViewHolder,然后对于任意的convertView,提供一个对象让其setTag即可;

既然是通用,那么我们这个ViewHolder就不可能含有各种控件的成员变量了,因为每个Item的布局是不同的,最好的方式是什么呢?

提供一个容器,专门存每个Item布局中的所有控件,而且还要能够查找出来;既然需要查找,那么ListView肯定是不行了,需要一个键值对进行保存,键为控件的Id,值为控件的引用,相信大家立刻就能想到Map;但是我们不用Map,因为有更好的替代类,就是我们android提供的SparseArray这个类,和Map类似,但是比Map效率,不过键只能为Integer.

下面看我们的ViewHolder类:

  1. package com.example.zhy_baseadapterhelper;
  2. import android.content.Context;
  3. import android.util.Log;
  4. import android.util.SparseArray;
  5. import android.view.LayoutInflater;
  6. import android.view.View;
  7. import android.view.ViewGroup;
  8. public class ViewHolder
  9. {
  10. private final SparseArray<View> mViews;
  11. private View mConvertView;
  12. private ViewHolder(Context context, ViewGroup parent, int layoutId,
  13. int position)
  14. {
  15. this.mViews = new SparseArray<View>();
  16. mConvertView = LayoutInflater.from(context).inflate(layoutId, parent,
  17. false);
  18. //setTag
  19. mConvertView.setTag(this);
  20. }
  21. /**
  22. * 拿到一个ViewHolder对象
  23. * @param context
  24. * @param convertView
  25. * @param parent
  26. * @param layoutId
  27. * @param position
  28. * @return
  29. */
  30. public static ViewHolder get(Context context, View convertView,
  31. ViewGroup parent, int layoutId, int position)
  32. {
  33. if (convertView == null)
  34. {
  35. return new ViewHolder(context, parent, layoutId, position);
  36. }
  37. return (ViewHolder) convertView.getTag();
  38. }
  39. /**
  40. * 通过控件的Id获取对于的控件,如果没有则加入views
  41. * @param viewId
  42. * @return
  43. */
  44. public <T extends View> T getView(int viewId)
  45. {
  46. View view = mViews.get(viewId);
  47. if (view == null)
  48. {
  49. view = mConvertView.findViewById(viewId);
  50. mViews.put(viewId, view);
  51. }
  52. return (T) view;
  53. }
  54. public View getConvertView()
  55. {
  56. return mConvertView;
  57. }
  58. }

与传统的ViewHolder不同,我们使用了一个SparseArray<View>用于存储与之对于的convertView的所有的控件,当需要拿这些控件时,通过getView(id)进行获取;

下面看使用该ViewHolder的MyAdapter;

  1. @Override
  2. public View getView(int position, View convertView, ViewGroup parent)
  3. {
  4. //实例化一个viewHolder
  5. ViewHolder viewHolder = ViewHolder.get(mContext, convertView, parent,
  6. R.layout.item_single_str, position);
  7. //通过getView获取控件
  8. TextView tv = viewHolder.getView(R.id.id_tv_title);
  9. //使用
  10. tv.setText(mDatas.get(position));
  11. return viewHolder.getConvertView();
  12. }

只看getView,其他方法都一样;首先调用ViewHolder的get方法,如果convertView为null,new一个ViewHolder实例,通过使用mInflater.inflate加载布局,然后new一个SparseArray用于存储View,最后setTag(this);

如果存在那么直接getTag

最后通过getView(id)获取控件,如果存在则直接返回,否则调用findViewById,返回存储,返回。

好了,一个通用的ViewHolder写好了,以后一个项目几十个Adapter一个ViewHolder直接hold住全场~~大家可以省点时间斗个小地主了~~

4、打造通用的Adapter

有了通用的ViewHolder大家肯定不能满足,怎么也得省出dota的时间,人在塔在~~

下面看如何打造一个通过的Adapter,我们叫做CommonAdapter

继续分析,Adapter一般需要保持一个List对象,存储一个Bean的集合,不同的ListView,Bean肯定是不同的,这个CommonAdapter肯定需要支持泛型,内部维持一个List<T>,就解决我们的问题了;

于是我们初步打造我们的CommonAdapter

  1. package com.example.zhy_baseadapterhelper;
  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. public abstract class CommonAdapter<T> extends BaseAdapter
  10. {
  11. protected LayoutInflater mInflater;
  12. protected Context mContext;
  13. protected List<T> mDatas;
  14. public CommonAdapter(Context context, List<T> mDatas)
  15. {
  16. mInflater = LayoutInflater.from(context);
  17. this.mContext = context;
  18. this.mDatas = mDatas;
  19. }
  20. @Override
  21. public int getCount()
  22. {
  23. return mDatas.size();
  24. }
  25. @Override
  26. public Object getItem(int position)
  27. {
  28. return mDatas.get(position);
  29. }
  30. @Override
  31. public long getItemId(int position)
  32. {
  33. return position;
  34. }
  35. }

我们的CommonAdapter依然是一个抽象类,除了getView以外我们把其他的代码都实现了,这样的话,在使用我们的Adapter只要实现一个getView,然后getView里面再使用我们打造的通过的ViewHolder是不是感觉还不错~

现在我们的MyAdapter是这样的:

  1. package com.example.zhy_baseadapterhelper;
  2. import java.util.List;
  3. import android.content.Context;
  4. import android.view.View;
  5. import android.view.ViewGroup;
  6. import android.widget.TextView;
  7. public class MyAdapter<T> extends CommonAdapter<T>
  8. {
  9. public MyAdapter(Context context, List<T> mDatas)
  10. {
  11. super(context, mDatas);
  12. }
  13. @Override
  14. public View getView(int position, View convertView, ViewGroup parent)
  15. {
  16. ViewHolder viewHolder = ViewHolder.get(mContext, convertView, parent,
  17. R.layout.item_single_str, position);
  18. TextView mTitle = viewHolder.getView(R.id.id_tv_title);
  19. mTitle.setText((String) mDatas.get(position));
  20. return viewHolder.getConvertView();
  21. }
  22. }

所有的代码加起来也就10行左右,是不是神清气爽~~稍等,我先去dota一把~

但是我们是否就这样满足了呢?显然还可以简化。

5、进一步铸造

注意我们的getView里面的代码,虽然只有4行,但是我觉得所有的Adapter的

第一行(ViewHolder viewHolder = getViewHolder(position, convertView,parent);)和

最后一行:return viewHolder.getConvertView();一定是一样的。

那么我们可以这样做:我们把第一行和最后一行写死,把中间变化的部分抽取出来,这不就是OO的设计原则嘛。现在CommonAdapter是这样的:

  1. package com.example.zhy_baseadapterhelper;
  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. public abstract class n<T> extends BaseAdapter
  9. {
  10. protected LayoutInflater mInflater;
  11. protected Context mContext;
  12. protected List<T> mDatas;
  13. protected final int mItemLayoutId;
  14. public CommonAdapter(Context context, List<T> mDatas, int itemLayoutId)
  15. {
  16. this.mContext = context;
  17. this.mInflater = LayoutInflater.from(mContext);
  18. this.mDatas = mDatas;
  19. this.mItemLayoutId = itemLayoutId;
  20. }
  21. @Override
  22. public int getCount()
  23. {
  24. return mDatas.size();
  25. }
  26. @Override
  27. public T getItem(int position)
  28. {
  29. return mDatas.get(position);
  30. }
  31. @Override
  32. public long getItemId(int position)
  33. {
  34. return position;
  35. }
  36. @Override
  37. public View getView(int position, View convertView, ViewGroup parent)
  38. {
  39. final ViewHolder viewHolder = getViewHolder(position, convertView,
  40. parent);
  41. convert(viewHolder, getItem(position));
  42. return viewHolder.getConvertView();
  43. }
  44. public abstract void convert(ViewHolder helper, T item);
  45. private ViewHolder getViewHolder(int position, View convertView,
  46. ViewGroup parent)
  47. {
  48. return ViewHolder.get(mContext, convertView, parent, mItemLayoutId,
  49. position);
  50. }
  51. }

对外公布了一个convert方法,并且还把viewHolder和本Item对于的Bean对象给传出去,现在convert方法里面需要干嘛呢?

通过ViewHolder把View找到,通过Item设置值;

现在我觉得代码简化到这样,我已经不需要单独写一个Adapter了,直接MainActivity匿名内部类走起~

  1. @Override
  2. protected void onCreate(Bundle savedInstanceState)
  3. {
  4. super.onCreate(savedInstanceState);
  5. setContentView(R.layout.activity_main);
  6. mListView = (ListView) findViewById(R.id.id_lv_main);
  7. //设置适配器
  8. mListView.setAdapter(mAdapter = new CommonAdapter<String>(
  9. getApplicationContext(), mDatas, R.layout.item_single_str)
  10. {
  11. @Override
  12. public void convert(ViewHolder c, String item)
  13. {
  14. TextView view = viewHolder.getView(R.id.id_tv_title);
  15. view.setText(item);
  16. }
  17. });
  18. }

可以看到效果咋样,不错吧。你觉得还能简化么?我觉得还能改善。

6、Adapter最后的封魔

我们现在在convertView里面需要这样:

@Override
public void convert(ViewHolder viewHolder, String item)
{
TextView view = viewHolder.getView(R.id.id_tv_title);
view.setText(item);
}

我们细想一下,其实布局里面的View常用也就那么几种:ImageView,TextView,Button,CheckBox等等;

那么我觉得ViewHolder还可以封装一些常用的方法,比如setText(id,String);setImageResource(viewId, resId);setImageBitmap(viewId, bitmap);

那么现在ViewHolder是:

  1. package com.example.zhy_baseadapterhelper;
  2. import android.content.Context;
  3. import android.graphics.Bitmap;
  4. import android.util.SparseArray;
  5. import android.view.LayoutInflater;
  6. import android.view.View;
  7. import android.view.ViewGroup;
  8. import android.widget.ImageView;
  9. import android.widget.TextView;
  10. import com.example.zhy_baseadapterhelper.ImageLoader.Type;
  11. public class ViewHolder
  12. {
  13. private final SparseArray<View> mViews;
  14. private int mPosition;
  15. private View mConvertView;
  16. private ViewHolder(Context context, ViewGroup parent, int layoutId,
  17. int position)
  18. {
  19. this.mPosition = position;
  20. this.mViews = new SparseArray<View>();
  21. mConvertView = LayoutInflater.from(context).inflate(layoutId, parent,
  22. false);
  23. // setTag
  24. mConvertView.setTag(this);
  25. }
  26. /**
  27. * 拿到一个ViewHolder对象
  28. *
  29. * @param context
  30. * @param convertView
  31. * @param parent
  32. * @param layoutId
  33. * @param position
  34. * @return
  35. */
  36. public static ViewHolder get(Context context, View convertView,
  37. ViewGroup parent, int layoutId, int position)
  38. {
  39. if (convertView == null)
  40. {
  41. return new ViewHolder(context, parent, layoutId, position);
  42. }
  43. return (ViewHolder) convertView.getTag();
  44. }
  45. public View getConvertView()
  46. {
  47. return mConvertView;
  48. }
  49. /**
  50. * 通过控件的Id获取对于的控件,如果没有则加入views
  51. *
  52. * @param viewId
  53. * @return
  54. */
  55. public <T extends View> T getView(int viewId)
  56. {
  57. View view = mViews.get(viewId);
  58. if (view == null)
  59. {
  60. view = mConvertView.findViewById(viewId);
  61. mViews.put(viewId, view);
  62. }
  63. return (T) view;
  64. }
  65. /**
  66. * 为TextView设置字符串
  67. *
  68. * @param viewId
  69. * @param text
  70. * @return
  71. */
  72. public ViewHolder setText(int viewId, String text)
  73. {
  74. TextView view = getView(viewId);
  75. view.setText(text);
  76. return this;
  77. }
  78. /**
  79. * 为ImageView设置图片
  80. *
  81. * @param viewId
  82. * @param drawableId
  83. * @return
  84. */
  85. public ViewHolder setImageResource(int viewId, int drawableId)
  86. {
  87. ImageView view = getView(viewId);
  88. view.setImageResource(drawableId);
  89. return this;
  90. }
  91. /**
  92. * 为ImageView设置图片
  93. *
  94. * @param viewId
  95. * @param drawableId
  96. * @return
  97. */
  98. public ViewHolder setImageBitmap(int viewId, Bitmap bm)
  99. {
  100. ImageView view = getView(viewId);
  101. view.setImageBitmap(bm);
  102. return this;
  103. }
  104. /**
  105. * 为ImageView设置图片
  106. *
  107. * @param viewId
  108. * @param drawableId
  109. * @return
  110. */
  111. public ViewHolder setImageByUrl(int viewId, String url)
  112. {
  113. ImageLoader.getInstance(3, Type.LIFO).loadImage(url,
  114. (ImageView) getView(viewId));
  115. return this;
  116. }
  117. public int getPosition()
  118. {
  119. return mPosition;
  120. }
  121. }

现在的MainActivity只需要这么写:

  1. mAdapter = new CommonAdapter<String>(getApplicationContext(),
  2. R.layout.item_single_str, mDatas)
  3. {
  4. @Override
  5. protected void convert(ViewHolder viewHolder, String item)
  6. {
  7. viewHolder.setText(R.id.id_tv_title, item);
  8. }
  9. };

convertView里面只要一行代码了~~~

好了,到此我们的通用的Adapter已经一步一步铸造完毕~咋样,以后写项目省下来的时间是不是可以陪我切磋dota了(ps:11昵称:血魔哥404)~~

注:关于ViewHolder里面的setText,setImageResource这类的方法,大家可以在使用的过程中不断的完善,今天发现这个控件可以这么设置值,好,放进去;时间长了,基本就完善了。还有那个ImageLoader是我另一篇博客里的,大家可以使用UIL,Volley或者自己写个图片加载器;

7、实践

说了这么多,还是得拿出来让我们的实践检验检验,顺便来几张套图,俗话说,没图没正相。

1、我们的实例代码的图是这样的:

Android 快速开发系列 打造万能的ListView GridView 适配器

关于Adapter和ViewHolder的代码是这样的:

  1. // 设置适配器
  2. mListView.setAdapter(mAdapter = new CommonAdapter<String>(
  3. getApplicationContext(), mDatas, R.layout.item_single_str)
  4. {
  5. @Override
  6. public void convert(ViewHolder helper, String item)
  7. {
  8. helper.setText(R.id.id_tv_title,item);
  9. }
  10. });

哎哟,我是不是只要贴一行;

2、来个复杂点的布局

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="wrap_content"
  5. android:background="#ffffff"
  6. android:orientation="vertical"
  7. android:padding="10dp" >
  8. <TextView
  9. android:id="@+id/tv_title"
  10. android:layout_width="match_parent"
  11. android:layout_height="wrap_content"
  12. android:singleLine="true"
  13. android:text="红色钱包"
  14. android:textSize="16sp"
  15. android:textColor="#444444" >
  16. </TextView>
  17. <TextView
  18. android:id="@+id/tv_describe"
  19. android:layout_width="match_parent"
  20. android:layout_height="wrap_content"
  21. android:layout_below="@id/tv_title"
  22. android:layout_marginTop="10dp"
  23. android:maxLines="2"
  24. android:minLines="1"
  25. android:text="周三早上丢失了红色钱包,在食堂二楼"
  26. android:textColor="#898989"
  27. android:textSize="16sp" >
  28. </TextView>
  29. <TextView
  30. android:id="@+id/tv_time"
  31. android:layout_width="wrap_content"
  32. android:layout_height="wrap_content"
  33. android:layout_below="@id/tv_describe"
  34. android:layout_marginTop="10dp"
  35. android:text="20130240122"
  36. android:textColor="#898989"
  37. android:textSize="12sp" >
  38. </TextView>
  39. <TextView
  40. android:id="@+id/tv_phone"
  41. android:layout_width="wrap_content"
  42. android:layout_height="wrap_content"
  43. android:layout_alignParentRight="true"
  44. android:layout_below="@id/tv_describe"
  45. android:layout_marginTop="10dp"
  46. android:background="#5cbe6c"
  47. android:drawableLeft="@drawable/icon_photo"
  48. android:drawablePadding="5dp"
  49. android:paddingBottom="3dp"
  50. android:paddingLeft="5dp"
  51. android:paddingRight="5dp"
  52. android:paddingTop="3dp"
  53. android:text="138024249542"
  54. android:textColor="#ffffff"
  55. android:textSize="12sp" >
  56. </TextView>
  57. </RelativeLayout>

效果图是这样的:

Android 快速开发系列 打造万能的ListView GridView 适配器

布局是不是挺复杂的了~~

但是代码是这样的:

  1. // 设置适配器
  2. mListView.setAdapter(mAdapter = new CommonAdapter<Bean>(
  3. getApplicationContext(), mDatas, R.layout.item_list)
  4. {
  5. @Override
  6. public void convert(ViewHolder helper, Bean item)
  7. {
  8. helper.setText(R.id.tv_title, item.getTitle());
  9. helper.setText(R.id.tv_describe, item.getDesc());
  10. helper.setText(R.id.tv_phone, item.getPhone());
  11. helper.setText(R.id.tv_time, item.getTime());
  12. //              helper.getView(R.id.tv_title).setOnClickListener(l)
  13. }
  14. });

从一个字符串的布局到这样的布局,Adapter加ViewHolder的改变就这么多,加起来3行左右代码~~~

到此,Android 快速开发系列 打造万能的ListView GridView 适配器结束;

最后给大家推荐一个gitHub项目:https://github.com/JoanZapata/base-adapter-helper ,这个项目所做的,和我上面写的基本一致。

还有上面的布局文件来自网络,感谢Bmob的提供~

好了,我要去快乐的玩耍了~~

源码点击下载