TShopping

 找回密碼
 註冊
搜索
查看: 185|回復: 0

[教學] ListView之BaseAdapter的基本使用以及ViewHolder模式

[複製鏈接]
發表於 2016-7-22 17:11:04 | 顯示全部樓層 |閱讀模式
 
Push to Facebook Push to Plurk Push to Twitter 
話說開髮用了各種Adapter之後感覺用的最舒服的還是BaseAdapter,儘管使用起來比其他適配器有些麻煩,但是使用它卻能實現很多自己喜歡的列表佈局,比如ListView、GridView、Gallery、Spinner等等。它是直接繼承自接口類Adapter的,使用BaseAdapter時需要重寫很多方法,其中最重要的當屬getView,因為這會涉及到ListView優化等問題,其他的方法可以參考鏈接的文章

BaseAdapter與其他Adapter有些不一樣,其他的Adapter可以直接在其構造方法中進行數據的設置,比如

  1. SimpleAdapter adapter = new SimpleAdapter(this, getData(), R.layout.list_item, new String[]{"img","title","info",new int[]{R.id.img, R.id.title, R.id.info}});
複製代碼

但是在BaseAdapter中需要實現一個繼承自BaseAdapter的類,並且重寫裡面的很多方法,例如

  1. class MyAdapter extends BaseAdapter
  2.     {
  3.         private Context context;
  4.         public MyAdapter(Context context)
  5.         {
  6.             this.context = context;
  7.         }
  8.         @Override
  9.         public int getCount() {
  10.             // How many items are in the data set represented by this Adapter.(在此适配器中所代表的数据集中的条目数)
  11.             return 0;
  12.         }
  13.         @Override
  14.         public Object getItem(int position) {
  15.             // Get the data item associated with the specified position in the data set.(获取数据集中与指定索引对应的数据项)
  16.             return null;
  17.         }
  18.         @Override
  19.         public long getItemId(int position) {
  20.             // Get the row id associated with the specified position in the list.(取在列表中与指定索引对应的行id)
  21.             return 0;
  22.         }
  23.         @Override
  24.         public View getView(int position, View convertView, ViewGroup parent) {
  25.             // Get a View that displays the data at the specified position in the data set.
  26.             return null;
  27.         }
  28.                                                                                                                              
  29.     }
複製代碼


這裡面沒什麼難度,但是這個getView方法必須好好處理,也是最麻煩的

第一種:沒有任何處理,不建議這樣寫。如果數據量少看將就,但是如果列表項數據量很大的時候,會每次都重新創建View,設置資源,嚴重影響性能,所以從一開始就不要用這種方式
  1. @Override
  2.         public View getView(int position, View convertView, ViewGroup parent) {
  3.             View item = mInflater.inflate(R.layout.list_item, null);
  4.             ImageView img = (ImageView)item.findViewById(R.id.img)
  5.             TextView title = (TextView)item.findViewById(R.id.title);
  6.             TextView info = (TextView)item.findViewById(R.id.info);
  7.             img.setImageResource(R.drawable.ic_launcher);
  8.             title.setText("Hello");
  9.             info.setText("world");                                                                                       
  10.             return item;
  11.         }
複製代碼


第二種ListView優化:通過緩存convertView,這種利用緩存contentView的方式可以判斷如果緩存中不存在View才創建View,如果已經存在可以利用緩存中的View,提升了性能
  1. public View getView(int position, View convertView, ViewGroup parent) {
  2.             if(convertView == null)
  3.             {
  4.                 convertView = mInflater.inflate(R.layout.list_item, null);
  5.             }
  6.                                                                                              
  7.             ImageView img = (ImageView)convertView.findViewById(R.id.img)
  8.             TextView title = (TextView)convertView.findViewById(R.id.title);
  9.             TextView info = (TextView)ConvertView.findViewById(R.id.info);
  10.             img.setImageResource(R.drawable.ic_launcher);
  11.             title.setText("Hello");
  12.             info.setText("world");
  13.                                                                                              
  14.             return convertView;
  15.         }
複製代碼

第三種ListView優化:通過convertView+ViewHolder來實現,ViewHolder就是一個靜態類,使用ViewHolder 的關鍵好處是緩存了顯示數據的視圖(View),加快了UI 的響應速度。

當我們判斷convertView == null 的時候,如果為空,就會根據設計好的List的Item佈局(XML),來為convertView賦值,並生成一個viewHolder來綁定converView裡面的各個View控件(XML佈局裡面的那些控件)。再用convertView的setTag將viewHolder設置到Tag中,以便系統第二次繪製ListView時從Tag中取出。(看下面代碼中)

如果convertView不為空的時候,就會直接用convertView的getTag(),來獲得一個ViewHolder。
  1. //在外面先定义,ViewHolder静态类
  2. static class ViewHolder
  3. {
  4.     public ImageView img;
  5.     public TextView title;
  6.     public TextView info;
  7. }
  8. //然后重写getView
  9. @Override
  10. public View getView(int position, View convertView, ViewGroup parent) {
  11.     ViewHolder holder;
  12.     if(convertView == null)
  13.     {
  14.         holder = new ViewHolder();
  15.         convertView = mInflater.inflate(R.layout.list_item, null);
  16.         holder.img = (ImageView)item.findViewById(R.id.img)
  17.         holder.title = (TextView)item.findViewById(R.id.title);
  18.         holder.info = (TextView)item.findViewById(R.id.info);
  19.         convertView.setTag(holder);
  20.     }else
  21.     {
  22.         holder = (ViewHolder)convertView.getTag();
  23.     }
  24.         holder.img.setImageResource(R.drawable.ic_launcher);
  25.         holder.title.setText("Hello");
  26.         holder.info.setText("World");
  27.     }
  28.                                                                                                 
  29.     return convertView;
  30. }
複製代碼

到這裡,可能會有人問ViewHolder靜態類結合緩存convertView與直接使用convertView有什麼區別嗎,是否重複了

在這裡,官方給出了解釋

提升Adapter的兩種方法

有效地工作在這裡實現適配器使用兩種技術:
-它重用convertView傳遞給getView(),以避免充氣查看時,沒有必要

(譯:重用緩存convertView傳遞給getView()方法來避免填充不必要的視圖)
-It uses the ViewHolder pattern to avoid calling findViewById() when it is not necessary

(譯:使用ViewHolder模式來避免沒有必要的調用findViewById():因為太多的findViewById也會影響性能)ViewHolder類的作用 -The ViewHolder pattern consists in storing a data structure in the tag of the view returned by getView( ).This data structures contains references to the views we want to bind data to, thus avoiding calling to findViewById() every time getView() is invoked




(譯:ViewHolder模式通過getView()方法返回的視圖的標籤(Tag)中存儲一個數據結構,這個數據結構包含了指向我們

要綁定數據的視圖的引用,從而避免每次調用getView()的時候調用findViewById())

實例:用BaseAdapter來自定義ListView佈局
main.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="fill_parent"
  4.     android:layout_height="fill_parent"
  5.     android:orientation="vertical" >
  6.     <ListView
  7.         android:id="@+id/lv"
  8.         android:layout_width="fill_parent"
  9.         android:layout_height="wrap_content"
  10.         android:fastScrollEnabled="true"
  11.         />
  12. </LinearLayout>
複製代碼


list_item.xml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="match_parent"
  5.     android:orientation="horizontal" >
  6.     <ImageView
  7.         android:id="@+id/img"
  8.         android:layout_width="wrap_content"
  9.         android:layout_height="wrap_content"
  10.         />
  11.     <LinearLayout
  12.         android:layout_width="fill_parent"
  13.         android:layout_height="wrap_content"
  14.         android:orientation="vertical"
  15.         >
  16.         <TextView
  17.             android:id="@+id/tv"
  18.             android:layout_width="wrap_content"
  19.             android:layout_height="wrap_content"
  20.             android:textSize="20sp"
  21.         />
  22.         <TextView
  23.             android:id="@+id/info"
  24.             android:layout_width="wrap_content"
  25.             android:layout_height="wrap_content"
  26.             android:textSize="14sp"
  27.             />
  28.     </LinearLayout>
  29.                                                             
  30. </LinearLayout>
複製代碼


Activity
  1. package com.loulijun.demo17;
  2. import java.util.ArrayList;
  3. import java.util.HashMap;
  4. import java.util.List;
  5. import java.util.Map;
  6. import android.app.Activity;
  7. import android.content.Context;
  8. import android.os.Bundle;
  9. import android.view.LayoutInflater;
  10. import android.view.View;
  11. import android.view.ViewGroup;
  12. import android.widget.BaseAdapter;
  13. import android.widget.ImageView;
  14. import android.widget.ListView;
  15. import android.widget.TextView;
  16. public class Demo17Activity extends Activity {
  17.     private ListView lv;
  18.     private List<Map<String, Object>> data;
  19.     @Override
  20.     public void onCreate(Bundle savedInstanceState) {
  21.         super.onCreate(savedInstanceState);
  22.         setContentView(R.layout.main);
  23.         lv = (ListView)findViewById(R.id.lv);
  24.         //获取将要绑定的数据设置到data中
  25.         data = getData();
  26.         MyAdapter adapter = new MyAdapter(this);
  27.         lv.setAdapter(adapter);
  28.     }
  29.                                                      
  30.     private List<Map<String, Object>> getData()
  31.     {
  32.         List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();
  33.         Map<String, Object> map;
  34.         for(int i=0;i<10;i++)
  35.         {
  36.             map = new HashMap<String, Object>();
  37.             map.put("img", R.drawable.ic_launcher);
  38.             map.put("title", "跆拳道");
  39.             map.put("info", "快乐源于生活...");
  40.             list.add(map);
  41.         }
  42.         return list;
  43.     }
  44.                                                      
  45.     //ViewHolder静态类
  46.     static class ViewHolder
  47.     {
  48.         public ImageView img;
  49.         public TextView title;
  50.         public TextView info;
  51.     }
  52.                                                      
  53.     public class MyAdapter extends BaseAdapter
  54.     {   
  55.         private LayoutInflater mInflater = null;
  56.         private MyAdapter(Context context)
  57.         {
  58.             //根据context上下文加载布局,这里的是Demo17Activity本身,即this
  59.             this.mInflater = LayoutInflater.from(context);
  60.         }
  61.         @Override
  62.         public int getCount() {
  63.             //How many items are in the data set represented by this Adapter.
  64.             //在此适配器中所代表的数据集中的条目数
  65.             return data.size();
  66.         }
  67.         @Override
  68.         public Object getItem(int position) {
  69.             // Get the data item associated with the specified position in the data set.
  70.             //获取数据集中与指定索引对应的数据项
  71.             return position;
  72.         }
  73.         @Override
  74.         public long getItemId(int position) {
  75.             //Get the row id associated with the specified position in the list.
  76.             //获取在列表中与指定索引对应的行id
  77.             return position;
  78.         }
  79.                                                          
  80.         //Get a View that displays the data at the specified position in the data set.
  81.         //获取一个在数据集中指定索引的视图来显示数据
  82.         @Override
  83.         public View getView(int position, View convertView, ViewGroup parent) {
  84.             ViewHolder holder = null;
  85.             //如果缓存convertView为空,则需要创建View
  86.             if(convertView == null)
  87.             {
  88.                 holder = new ViewHolder();
  89.                 //根据自定义的Item布局加载布局
  90.                 convertView = mInflater.inflate(R.layout.list_item, null);
  91.                 holder.img = (ImageView)convertView.findViewById(R.id.img);
  92.                 holder.title = (TextView)convertView.findViewById(R.id.tv);
  93.                 holder.info = (TextView)convertView.findViewById(R.id.info);
  94.                 //将设置好的布局保存到缓存中,并将其设置在Tag里,以便后面方便取出Tag
  95.                 convertView.setTag(holder);
  96.             }else
  97.             {
  98.                 holder = (ViewHolder)convertView.getTag();
  99.             }
  100.             holder.img.setBackgroundResource((Integer)data.get(position).get("img"));
  101.             holder.title.setText((String)data.get(position).get("title"));
  102.             holder.info.setText((String)data.get(position).get("info"));
  103.                                                             
  104.             return convertView;
  105.         }
  106.                                                          
  107.     }
  108. }
複製代碼

運行結果如下:
49381413875812.png

 

臉書網友討論
您需要登錄後才可以回帖 登錄 | 註冊 |

本版積分規則



Archiver|手機版|小黑屋|免責聲明|TShopping

GMT+8, 2016-12-12 02:05 , Processed in 0.104200 second(s), 26 queries .

本論壇言論純屬發表者個人意見,與 TShopping綜合論壇 立場無關 如有意見侵犯了您的權益 請寫信聯絡我們。

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回復 返回頂部 返回列表