Android中ListView封裝收縮與展開

本文轉載自查看原文 2015-03-06 17:20 5099 ListView/ Adapter/ Android

常有這種需求，即ListView中數據較多(不涉及分頁)，如果都展開，數據量較多，體驗不好，所以需要提供用戶查看更多、收縮數據的交互

截圖如下：

如圖所示，點擊更多，則展開所有數據。點擊收起，則自動收縮。

代碼如下(主要通過繼承Adapetr，控制展示的數據量getCount()方法實現，當數據量大於默認值(2)時，自動只展示2條數據，當點擊更多時，則展示全部數據)：

(在使用這種方法前曾想自定義ListView實現，但遇到較多問題，如：

1.由於我們通過adapter設置數據，不直接調用listview的方法，所以需要了解Adapter中notifyDataSetChanged方法的回調函數，通過分析源碼了解到notifyDataSetChanged方法會回調ListView的requestLayout方法。所以通過在requestLayout中添加動態設置listview高度的方法，但設置高度會回調requestLayout，從而造成死循環，可通過設計標志位解決

2.動態設置listview高度並沒有實現把多余的listitem隱藏，導致本該顯示footview的高度顯示了部分listitem。隱藏多余的listitem后，目前還是未顯示出footview，通過網上了解到的一些解決辦法，還是沒有解決

3.此外還有其他問題，所以后來索性轉為繼承BaseAdapter實現)

  1 package com.example.android_train.adapter;
  2 
  3 import java.util.ArrayList;
  4 
  5 import android.annotation.SuppressLint;
  6 import android.content.Context;
  7 import android.view.LayoutInflater;
  8 import android.view.View;
  9 import android.view.View.OnClickListener;
 10 import android.view.ViewGroup;
 11 import android.widget.BaseAdapter;
 12 import android.widget.Button;
 13 import android.widget.LinearLayout;
 14 import android.widget.ListAdapter;
 15 import android.widget.ListView;
 16 
 17 import com.example.android_train.R;
 18 
 19 public abstract class BaseFootviewAdapter<E> extends BaseAdapter {
 20     
 21     public static final int DEFAULT_SHOW_COUNT = 2;
 22     
 23     protected Context mContext;
 24     protected ListView mListView;
 25     protected LayoutInflater inflater;
 26     protected LinearLayout headView;
 27     protected Button btn_loadmore;
 28     protected ArrayList<E> mShowObjects = new ArrayList<E>();
 29     protected ArrayList<E> mAllObjects = null;
 30     protected boolean shrink = true;
 31 
 32     @SuppressWarnings("unused")
 33     private BaseFootviewAdapter() {
 34     }
 35 
 36     @SuppressLint("InflateParams")
 37     public BaseFootviewAdapter( Context mContext, ListView mListView) {
 38         this.mContext = mContext;
 39         this.mListView = mListView;
 40         inflater = LayoutInflater.from(mContext);
 41         headView = (LinearLayout) inflater.inflate(R.layout.lv_footer_button, null);
 42         btn_loadmore = (Button) headView.findViewById(R.id.btn_loadmore);
 43         btn_loadmore.setOnClickListener(new OnClickListener() {
 44             @Override
 45             public void onClick(View v) {
 46                 changeShow();
 47             }
 48         });
 49         mListView.addFooterView(headView, null, false);
 50     }
 51     
 52     public void setAdapterData( ArrayList<E> mAllObjects ) {
 53         this.mAllObjects = mAllObjects;
 54         mShowObjects.clear();
 55         if( mAllObjects != null ) {
 56             if( mAllObjects.size() <= DEFAULT_SHOW_COUNT ) {
 57                 headView.setVisibility(View.GONE);
 58                 mShowObjects.addAll(mAllObjects);
 59             } else {
 60                 headView.setVisibility(View.VISIBLE);
 61                 for (int i = 0; i < DEFAULT_SHOW_COUNT; i++) {
 62                     mShowObjects.add(mAllObjects.get(i));
 63                 }
 64             }
 65         }
 66         notifyDataSetChanged();
 67         setListViewHeightBasedOnChildren(mListView);
 68     }
 69     
 70     @Override
 71     public int getCount() {
 72         int showCount = 0;
 73         if( mShowObjects != null ) {
 74             showCount = mShowObjects.size();
 75         }
 76         return showCount;
 77     }
 78 
 79     @Override
 80     public E getItem(int position) {
 81         E object = null;
 82         if( mShowObjects != null ) {
 83             object = mShowObjects.get(position);
 84         }
 85         return object;
 86     }
 87 
 88     @Override
 89     public long getItemId(int position) {
 90         return position;
 91     }
 92 
 93     private void changeShow() {
 94         if( headView.getVisibility() == View.GONE ) {
 95             headView.setVisibility(View.VISIBLE);
 96         }
 97         mShowObjects.clear();
 98         if( shrink ) {
 99             shrink = false;
100             mShowObjects.addAll(mAllObjects);
101             btn_loadmore.setText("收起");
102         } else {
103             shrink = true;
104             for (int i = 0; i < DEFAULT_SHOW_COUNT; i++) {
105                 mShowObjects.add(mAllObjects.get(i));
106             }
107             btn_loadmore.setText("更多");
108         }
109         notifyDataSetChanged();
110         setListViewHeightBasedOnChildren(mListView);
111     }
112     
113     /**
114      * 當ListView外層有ScrollView時，需要動態設置ListView高度
115      * @param listView
116      */
117     protected void setListViewHeightBasedOnChildren(ListView listView) { 
118         if(listView == null) return;
119         ListAdapter listAdapter = listView.getAdapter(); 
120         if (listAdapter == null) { 
121             return; 
122         } 
123         int totalHeight = 0; 
124         for (int i = 0; i < listAdapter.getCount(); i++) { 
125             View listItem = listAdapter.getView(i, null, listView); 
126             listItem.measure(0, 0); 
127             totalHeight += listItem.getMeasuredHeight(); 
128         }
129         ViewGroup.LayoutParams params = listView.getLayoutParams(); 
130         params.height = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1)); 
131         listView.setLayoutParams(params); 
132     }
133 
134 }

資源文件lv_footer_button.xml（此處需注意，不要在fl_loadmore這個外部LinearLayout設置高度，而應在Button中設置，否則listview展示的高度與設置的不符(暫不了解原因)）

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:id="@+id/fl_loadmore"
 4     android:layout_width="match_parent"
 5     android:layout_height="wrap_content"
 6     android:background="#ffffff"
 7     android:orientation="vertical" >
 8     
 9     <LinearLayout android:layout_width="match_parent"
10         android:layout_height="1px"
11         android:orientation="vertical"
12         android:background="#000000"/>
13 
14     <Button
15         android:id="@+id/btn_loadmore"
16         android:layout_width="match_parent"
17         android:layout_height="32dp"
18         android:gravity="center"
19         android:background="#00000000"
20         android:text="更多"
21         android:textSize="14sp" />
22 
23 </LinearLayout>

外部調用例子：

對象Bean（StationImage）：

 1 package com.example.android_train.bean;
 2 
 3 public class StationImage {
 4 
 5     public String img_name = "";
 6     public String img_url_s = "";
 7     public String img_url_l = "";
 8 
 9     public String getImg_name() {
10         return img_name;
11     }
12 
13     public void setImg_name(String img_name) {
14         this.img_name = img_name;
15     }
16 
17     public String getImg_url_s() {
18         return img_url_s;
19     }
20 
21     public void setImg_url_s(String img_url_s) {
22         this.img_url_s = img_url_s;
23     }
24 
25     public String getImg_url_l() {
26         return img_url_l;
27     }
28 
29     public void setImg_url_l(String img_url_l) {
30         this.img_url_l = img_url_l;
31     }
32 
33 }

FootviewAdapter繼承BaseFootviewAdapter，並實現getView()方法

 1 package com.example.android_train.adapter;
 2 
 3 import android.content.Context;
 4 import android.graphics.Paint;
 5 import android.view.View;
 6 import android.view.ViewGroup;
 7 import android.widget.LinearLayout;
 8 import android.widget.ListView;
 9 import android.widget.TextView;
10 
11 import com.example.android_train.R;
12 import com.example.android_train.bean.StationImage;
13 
14 public class FootviewAdapter extends BaseFootviewAdapter<StationImage>{
15     
16     private ListItemView listItemView = null;
17 
18     public final class ListItemView {
19         public LinearLayout gas_station_groupon_ll;
20         public TextView gpn_name;
21         public TextView gpn_price;
22         public TextView gpn_old_price;
23     }
24 
25     public FootviewAdapter( Context mContext, ListView mListView) {
26         super(mContext, mListView);
27     }
28     
29     @Override
30     public View getView(int position, View convertView, ViewGroup parent) {
31         final StationImage object = (StationImage)getItem(position);
32         if (convertView == null) {
33             convertView = inflater.inflate(R.layout.lv_gas_station_detail_groupon, parent, false);
34             listItemView = new ListItemView();
35             creatView(convertView, listItemView);
36             convertView.setTag(listItemView);
37         } else {
38             listItemView = (ListItemView) convertView.getTag();
39         }
40         listItemView.gpn_name.setText(object.getImg_name());
41         listItemView.gpn_price.setText("￥" + object.getImg_url_l());
42         listItemView.gpn_old_price.setText("￥" + object.getImg_url_s());
43         listItemView.gpn_old_price.getPaint().setFlags(Paint.STRIKE_THRU_TEXT_FLAG); //中划線
44         return convertView;
45     }
46     
47     private void creatView(View rowView, ListItemView listItemView) {
48         listItemView.gas_station_groupon_ll = (LinearLayout) rowView.findViewById(R.id.gas_station_groupon_ll);
49         listItemView.gpn_name = (TextView) rowView.findViewById(R.id.gpn_name);
50         listItemView.gpn_price = (TextView) rowView.findViewById(R.id.gpn_price);
51         listItemView.gpn_old_price = (TextView) rowView.findViewById(R.id.gpn_old_price);
52     }
53 
54 }

資源文件(lv_gas_station_detail_groupon)如下：

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:id="@+id/gas_station_groupon_ll"
 4     android:layout_width="match_parent"
 5     android:layout_height="wrap_content"
 6     android:orientation="horizontal" >
 7 
 8     <RelativeLayout
 9         android:layout_width="match_parent"
10         android:layout_height="48dp"
11         android:paddingLeft="16dp"
12         android:paddingRight="16dp" >
13 
14         <TextView
15             android:id="@+id/gpn_name"
16             android:layout_width="wrap_content"
17             android:layout_height="wrap_content"
18             android:layout_alignParentLeft="true"
19             android:text="ahah"
20             android:textSize="16sp" />
21 
22         <TextView
23             android:id="@+id/gpn_price"
24             android:layout_width="wrap_content"
25             android:layout_height="wrap_content"
26             android:layout_alignParentBottom="true"
27             android:layout_alignParentLeft="true"
28             android:layout_marginRight="16dp"
29             android:singleLine="true"
30             android:text="abc" />
31 
32         <TextView
33             android:id="@+id/gpn_old_price"
34             android:layout_width="wrap_content"
35             android:layout_height="wrap_content"
36             android:layout_alignParentBottom="true"
37             android:layout_toRightOf="@id/gpn_price"
38             android:singleLine="true"
39             android:text="qew"
40             android:textSize="16sp" />
41     </RelativeLayout>
42 
43 </LinearLayout>

Activity中的調用(實例化FootviewAdapter子類，然后設置相應數據即可)：

 1 ArrayList<StationImage> mStationImages = new ArrayList<StationImage>();
 2 ListView listview = null;
 3 for (int i = 0; i < 5; i++) {
 4     StationImage mStationImage = new StationImage();
 5     mStationImage.setImg_name("第" + i + "個項目的名字");
 6     mStationImage.setImg_url_l("第" + i + "個項目的長URL");
 7     mStationImage.setImg_url_s("第" + i + "個項目的短URL");
 8     mStationImages.add(mStationImage);
 9 }
10 listview = (ListView) findViewById(R.id.listview);
11 FootviewAdapter mFootviewAdapter = new FootviewAdapter(this, listview);
12 listview.setAdapter(mFootviewAdapter);
13 mFootviewAdapter.setAdapterData(mStationImages);

免責聲明！

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

猜您在找 android 可展開（收縮）的列表ListView(ExpandableListView) excel中收縮和展開行的設置 android代碼優化----ListView中自定義adapter的封裝（ListView的模板寫法） jquery展開收縮列表 TreeList節點展開與收縮 jquery 展開收縮table jQuery 收縮展開效果 elment 中tree組件展開所有和收縮所有節點 elment 中tree組件展開所有和收縮所有 Android中ListView的使用