碼上快樂

相關內容    簡體    繁體

ListView實現多種item布局的方法和注意事項

本文轉載自   查看原文   2017-03-16 14:51   3748 

這篇文章的效果也是大家常見的，各種通訊應用的對話列表都是這種方式，像微信、whatsapp、易信、米聊等。我們這篇文章也權當為回憶，形成簡單的筆記。這篇文章參考了2009年Google IO中的《TurboChargeYourUI-How to make your AndroidUI fast and efficient》和2010年Google IO中的《The World of List View》。像2009年Google IO的資料還是很前沿的，那會Android開發資料很少，最重要的就是參考google發布的各種資料。

 

    在《TurboChargeYourUI-How to make your AndroidUI fast and efficient》介紹了怎樣提高listview的性能，優化了listview的加載速度。這里的item使用的是單一布局，能夠實現view的重用和回收，那么多種布局文件的怎么辦呢，如果再使用上面的方法，view的重用會出現問題，Android使用的BaseAdapter提供了解決多種布局文件的重用方法。

 

1）重寫 getViewTypeCount() – 該方法返回多少個不同的布局

2）重寫 getItemViewType(int) – 根據position返回相應的Item

 

 

[java]  view plain  copy
 
 
 
 在CODE上查看代碼片派生到我的代碼片
  1. /** 
  2.  * 比原來的多了getItemViewType和getViewTypeCount這兩個方法， 
  3.  *  
  4.  * */  
  5. public class ChatAdapter extends BaseAdapter {  
  6.   
  7.     public static final String KEY = "key";  
  8.     public static final String VALUE = "value";  
  9.   
  10.     public static final int VALUE_TIME_TIP = 0;// 7種不同的布局  
  11.     public static final int VALUE_LEFT_TEXT = 1;  
  12.     public static final int VALUE_LEFT_IMAGE = 2;  
  13.     public static final int VALUE_LEFT_AUDIO = 3;  
  14.     public static final int VALUE_RIGHT_TEXT = 4;  
  15.     public static final int VALUE_RIGHT_IMAGE = 5;  
  16.     public static final int VALUE_RIGHT_AUDIO = 6;  
  17.     private LayoutInflater mInflater;  
  18.   
  19.     private List<Message> myList;  
  20.   
  21.     public ChatAdapter(Context context, List<Message> myList) {  
  22.         this.myList = myList;  
  23.   
  24.         mInflater = (LayoutInflater) context  
  25.                 .getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
  26.     }  
  27.   
  28.     @Override  
  29.     public int getCount() {  
  30.         return myList.size();  
  31.     }  
  32.   
  33.     @Override  
  34.     public Object getItem(int arg0) {  
  35.         return myList.get(arg0);  
  36.     }  
  37.   
  38.     @Override  
  39.     public long getItemId(int arg0) {  
  40.         return arg0;  
  41.     }  
  42.   
  43.     @Override  
  44.     public View getView(int position, View convertView, ViewGroup arg2) {  
  45.   
  46.         Message msg = myList.get(position);  
  47.         int type = getItemViewType(position);  
  48.         ViewHolderTime holderTime = null;  
  49.         ViewHolderRightText holderRightText = null;  
  50.         ViewHolderRightImg holderRightImg = null;  
  51.         ViewHolderRightAudio holderRightAudio = null;  
  52.         ViewHolderLeftText holderLeftText = null;  
  53.         ViewHolderLeftImg holderLeftImg = null;  
  54.         ViewHolderLeftAudio holderLeftAudio = null;  
  55.           
  56.         if (convertView == null) {  
  57.             switch (type) {  
  58.             case VALUE_TIME_TIP:  
  59.                 holderTime = new ViewHolderTime();  
  60.                 convertView = mInflater.inflate(R.layout.list_item_time_tip,  
  61.                         null);  
  62.                 holderTime.tvTimeTip = (TextView) convertView  
  63.                         .findViewById(R.id.tv_time_tip);  
  64.                 holderTime.tvTimeTip.setText(msg.getValue());  
  65.                 convertView.setTag(holderTime);  
  66.                 break;  
  67.             // 左邊  
  68.             case VALUE_LEFT_TEXT:  
  69.                 holderLeftText = new ViewHolderLeftText();  
  70.                 convertView = mInflater.inflate(R.layout.list_item_left_text,  
  71.                         null);  
  72.                 holderLeftText.ivLeftIcon = (ImageView) convertView  
  73.                         .findViewById(R.id.iv_icon);  
  74.                 holderLeftText.btnLeftText = (Button) convertView  
  75.                         .findViewById(R.id.btn_left_text);  
  76.                 holderLeftText.btnLeftText.setText(msg.getValue());  
  77.                 convertView.setTag(holderLeftText);  
  78.                 break;  
  79.   
  80.             case VALUE_LEFT_IMAGE:  
  81.                 holderLeftImg = new ViewHolderLeftImg();  
  82.                 convertView = mInflater.inflate(R.layout.list_item_left_iamge,  
  83.                         null);  
  84.                 holderLeftImg.ivLeftIcon = (ImageView) convertView  
  85.                         .findViewById(R.id.iv_icon);  
  86.                 holderLeftImg.ivLeftImage = (ImageView) convertView  
  87.                         .findViewById(R.id.iv_left_image);  
  88.                 holderLeftImg.ivLeftImage.setImageResource(R.drawable.test);  
  89.                 convertView.setTag(holderLeftImg);  
  90.                 break;  
  91.   
  92.             case VALUE_LEFT_AUDIO:  
  93.                 holderLeftAudio = new ViewHolderLeftAudio();  
  94.                 convertView = mInflater.inflate(R.layout.list_item_left_audio,  
  95.                         null);  
  96.                 holderLeftAudio.ivLeftIcon = (ImageView) convertView  
  97.                         .findViewById(R.id.iv_icon);  
  98.                 holderLeftAudio.btnLeftAudio = (Button) convertView  
  99.                         .findViewById(R.id.btn_left_audio);  
  100.                 holderLeftAudio.tvLeftAudioTime = (TextView) convertView  
  101.                         .findViewById(R.id.tv_left_audio_time);  
  102.                 holderLeftAudio.tvLeftAudioTime.setText(msg.getValue());  
  103.                 convertView.setTag(holderLeftAudio);  
  104.                 break;  
  105.             // 右邊  
  106.             case VALUE_RIGHT_TEXT:  
  107.                 holderRightText= new ViewHolderRightText();  
  108.                 convertView = mInflater.inflate(R.layout.list_item_right_text,  
  109.                         null);  
  110.                 holderRightText.ivRightIcon = (ImageView) convertView  
  111.                         .findViewById(R.id.iv_icon);  
  112.                 holderRightText.btnRightText = (Button) convertView  
  113.                         .findViewById(R.id.btn_right_text);  
  114.                 holderRightText.btnRightText.setText(msg.getValue());  
  115.                 convertView.setTag(holderRightText);  
  116.                 break;  
  117.   
  118.             case VALUE_RIGHT_IMAGE:  
  119.                 holderRightImg= new ViewHolderRightImg();  
  120.                 convertView = mInflater.inflate(R.layout.list_item_right_iamge,  
  121.                         null);  
  122.                 holderRightImg.ivRightIcon = (ImageView) convertView  
  123.                         .findViewById(R.id.iv_icon);  
  124.                 holderRightImg.ivRightImage = (ImageView) convertView  
  125.                         .findViewById(R.id.iv_right_image);  
  126.                 holderRightImg.ivRightImage.setImageResource(R.drawable.test);  
  127.                 convertView.setTag(holderRightImg);  
  128.                 break;  
  129.   
  130.             case VALUE_RIGHT_AUDIO:  
  131.                 holderRightAudio=new ViewHolderRightAudio();  
  132.                 convertView = mInflater.inflate(R.layout.list_item_right_audio,  
  133.                         null);  
  134.                 holderRightAudio.ivRightIcon = (ImageView) convertView  
  135.                         .findViewById(R.id.iv_icon);  
  136.                 holderRightAudio.btnRightAudio = (Button) convertView  
  137.                         .findViewById(R.id.btn_right_audio);  
  138.                 holderRightAudio.tvRightAudioTime = (TextView) convertView  
  139.                         .findViewById(R.id.tv_right_audio_time);  
  140.                 holderRightAudio.tvRightAudioTime.setText(msg.getValue());  
  141.                 convertView.setTag(holderRightAudio);  
  142.                 break;  
  143.   
  144.             default:  
  145.                 break;  
  146.             }  
  147.               
  148.         } else {  
  149.             Log.d("baseAdapter", "Adapter_:"+(convertView == null) );  
  150.             switch (type) {  
  151.             case VALUE_TIME_TIP:  
  152.                 holderTime=(ViewHolderTime)convertView.getTag();  
  153.                 holderTime.tvTimeTip.setText(msg.getValue());  
  154.                 break;  
  155.             case VALUE_LEFT_TEXT:  
  156.                 holderLeftText=(ViewHolderLeftText)convertView.getTag();  
  157.                 holderLeftText.btnLeftText.setText(msg.getValue());  
  158.                 break;  
  159.             case VALUE_LEFT_IMAGE:  
  160.                 holderLeftImg=(ViewHolderLeftImg)convertView.getTag();  
  161.                 holderLeftImg.ivLeftImage.setImageResource(R.drawable.test);  
  162.                 break;  
  163.             case VALUE_LEFT_AUDIO:  
  164.                 holderLeftAudio=(ViewHolderLeftAudio)convertView.getTag();  
  165.                 holderLeftAudio.tvLeftAudioTime.setText(msg.getValue());  
  166.                 break;  
  167.             case VALUE_RIGHT_TEXT:  
  168.                 holderRightText=(ViewHolderRightText)convertView.getTag();  
  169.                 holderRightText.btnRightText.setText(msg.getValue());  
  170.                 break;  
  171.             case VALUE_RIGHT_IMAGE:  
  172.                 holderRightImg=(ViewHolderRightImg)convertView.getTag();  
  173.                 holderRightImg.ivRightImage.setImageResource(R.drawable.test);  
  174.                 break;  
  175.             case VALUE_RIGHT_AUDIO:  
  176.                 holderRightAudio=(ViewHolderRightAudio)convertView.getTag();  
  177.                 holderRightAudio.tvRightAudioTime.setText(msg.getValue());  
  178.                 break;  
  179.   
  180.             default:  
  181.                 break;  
  182.             }  
  183.               
  184.             //holder = (ViewHolder) convertView.getTag();  
  185.         }  
  186.         return convertView;  
  187.     }  
  188.   
  189.     /** 
  190.      * 根據數據源的position返回需要顯示的的layout的type 
  191.      *  
  192.      * type的值必須從0開始 
  193.      *  
  194.      * */  
  195.     @Override  
  196.     public int getItemViewType(int position) {  
  197.   
  198.         Message msg = myList.get(position);  
  199.         int type = msg.getType();  
  200.         Log.e("TYPE:", "" + type);  
  201.         return type;  
  202.     }  
  203.   
  204.     /** 
  205.      * 返回所有的layout的數量 
  206.      *  
  207.      * */  
  208.     @Override  
  209.     public int getViewTypeCount() {  
  210.         return 7;  
  211.     }  
  212.   
  213.     class ViewHolderTime {  
  214.         private TextView tvTimeTip;// 時間  
  215.     }  
  216.   
  217.     class ViewHolderRightText {  
  218.         private ImageView ivRightIcon;// 右邊的頭像  
  219.         private Button btnRightText;// 右邊的文本  
  220.     }  
  221.   
  222.     class ViewHolderRightImg {  
  223.         private ImageView ivRightIcon;// 右邊的頭像  
  224.         private ImageView ivRightImage;// 右邊的圖像  
  225.     }  
  226.   
  227.     class ViewHolderRightAudio {  
  228.         private ImageView ivRightIcon;// 右邊的頭像  
  229.         private Button btnRightAudio;// 右邊的聲音  
  230.         private TextView tvRightAudioTime;// 右邊的聲音時間  
  231.     }  
  232.   
  233.     class ViewHolderLeftText {  
  234.         private ImageView ivLeftIcon;// 左邊的頭像  
  235.         private Button btnLeftText;// 左邊的文本  
  236.     }  
  237.   
  238.     class ViewHolderLeftImg {  
  239.         private ImageView ivLeftIcon;// 左邊的頭像  
  240.         private ImageView ivLeftImage;// 左邊的圖像  
  241.     }  
  242.   
  243.     class ViewHolderLeftAudio {  
  244.         private ImageView ivLeftIcon;// 左邊的頭像  
  245.         private Button btnLeftAudio;// 左邊的聲音  
  246.         private TextView tvLeftAudioTime;// 左邊的聲音時間  
  247.     }  
  248.   
  249. }  

 

 

 

分享兩張微信、易信的圖，你也可以做成這樣子。

     

 

 

注意：

 

使用Listview顯示多樣視圖時，用到了getItemViewType和getViewTypeCount，但是我一運行程序就會報數組越界異常，經過查資料發現，getItemViewType的值一定要從0開始，我開始設置的type類型是從1開始的，結果就悲催了，app一直崩潰，報Java.lang.ArrayIndexOutOfBoundsException。最后把type類型改成從0開始就好了，最后注意一點，getViewTypeCount返回值一定要大於等於getItemViewType的個數。


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 ListView具有多種item布局——實現微信對話列 ListView實現加載不同Item布局？ python 單例模式的四種實現方法及注意事項 php實現長連接的方法和注意事項 ListView嵌套GridView使用詳解及注意事項 【ajax 提交表單】多種方式的注意事項 ,serialize()的使用 移動端網頁布局中需要注意事項以及解決方法總結 使用FastDFS的刪除方法注意事項 Android WebView的loadData方法注意事項 oracle交換分區方法以及注意事項
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM