一個視圖顯示垂直滾動兩級列表中的條目。這不同於列表視圖,允許兩個層次,類似於QQ的好友分組。要實現這個效果的整體思路為: 1.要給ExpandableListView 設置適配器,那麼必須先設置數據源。 2.數據源,就是此處的適配器類,此方法繼承了BaseExpandableListAdapter, ...
一個視圖顯示垂直滾動兩級列表中的條目。這不同於列表視圖,允許兩個層次,類似於QQ的好友分組。要實現這個效果的整體思路為:
1.要給ExpandableListView 設置適配器,那麼必須先設置數據源。
2.數據源,就是此處的適配器類,此方法繼承了BaseExpandableListAdapter,它是ExpandableListView的一個子類。需要重寫裡面的多個方法。方法的意思,代碼中都有詳細的註釋。數據源中,用到了自定義的View佈局,此時根據自己的需求,來設置組和子項的佈局樣式。getChildView()和getGroupView()方法設置自定義佈局。
3.數據源設置好,直接給ExpandableListView.setAdapter()即可實現此收縮功能。
下麵是我自己簡單做的一個顯示效果:
layout中主視圖expandable_layout.xml(ExpandableListView佈局):
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:orientation="vertical" android:layout_width="match_parent" 4 android:layout_height="match_parent"> 5 <ExpandableListView 6 android:layout_width="match_parent" 7 android:layout_height="match_parent" 8 android:id="@+id/el"> 9 </ExpandableListView> 10 </LinearLayout>
Layout中group_layout.xml(分組組名展示佈局):
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 xmlns:app="http://schemas.android.com/apk/res-auto" 4 android:orientation="horizontal" android:layout_width="wrap_content" 5 android:layout_height="wrap_content" 6 android:gravity="center_vertical"> 7 <ImageView 8 android:layout_width="wrap_content" 9 android:layout_height="wrap_content" 10 app:srcCompat="@mipmap/ic_launcher" 11 android:id="@+id/iv_group" /> 12 <TextView 13 android:text="TextView" 14 android:layout_width="wrap_content" 15 android:layout_height="wrap_content" 16 android:id="@+id/tv_group" /> 17 </LinearLayout>
Layout中child_layout.xml(子菜單item佈局):
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 xmlns:app="http://schemas.android.com/apk/res-auto" 4 android:orientation="horizontal" android:layout_width="wrap_content" 5 android:layout_height="wrap_content" 6 android:gravity="center_vertical" 7 android:paddingLeft="50dp"> 8 <ImageView 9 android:layout_width="wrap_content" 10 android:layout_height="wrap_content" 11 app:srcCompat="@mipmap/ic_launcher" 12 android:id="@+id/iv_item" /> 13 <TextView 14 android:text="TextView" 15 android:layout_width="wrap_content" 16 android:layout_height="wrap_content" 17 android:id="@+id/tv_item" /> 18 </LinearLayout>
Layout中alertdialog_layout.xml(AlertDialog自定義顯示佈局):
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:orientation="vertical" android:layout_width="match_parent" 4 android:layout_height="match_parent"> 5 <EditText 6 android:layout_width="match_parent" 7 android:layout_height="wrap_content" 8 android:id="@+id/et" 9 android:hint="請輸入想對他說的話"/> 10 </LinearLayout>
Activity中Java實現代碼(ExpandableListViewDemo.java):
1 import android.content.DialogInterface; 2 import android.os.Bundle; 3 import android.support.annotation.Nullable; 4 import android.support.v7.app.AlertDialog; 5 import android.support.v7.app.AppCompatActivity; 6 import android.view.View; 7 import android.view.ViewGroup; 8 import android.widget.BaseExpandableListAdapter; 9 import android.widget.ExpandableListView; 10 import android.widget.ImageView; 11 import android.widget.TextView; 12 import android.widget.Toast; 13 /** 14 * Created by panchengjia on 2016/12/2. 15 */ 16 public class ExpandableListViewDemo extends AppCompatActivity { 17 ExpandableListView el; 18 //定義分組名以及對應的圖片數組,需一一對應 19 String[] country={"魏國","蜀國","吳國"}; 20 int[] icon={R.mipmap.wei,R.mipmap.shu,R.mipmap.wu}; 21 //使用二維定義組內成員以及對應頭像,同樣需要以一一對應 22 String[][] heros={{"司馬懿","郭嘉","夏侯惇","甄姬"},{"劉備","趙雲","張飛"},{"孫權","周瑜"}}; 23 int[][] icons={{R.mipmap.simayi,R.mipmap.guojia,R.mipmap.xiahoudun,R.mipmap.zhenji}, 24 {R.mipmap.liubei,R.mipmap.zhaoyun,R.mipmap.zhangfei},{R.mipmap.sunquan,R.mipmap.zhouyu}}; 25 @Override 26 protected void onCreate(@Nullable Bundle savedInstanceState) { 27 super.onCreate(savedInstanceState); 28 setContentView(R.layout.expandable_layout); 29 el= (ExpandableListView) findViewById(R.id.el); 30 //設置點擊下拉子菜單的監聽事件 31 el.setOnChildClickListener(new ExpandableListView.OnChildClickListener() { 32 @Override 33 public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) { 34 //獲取分組成員的姓名 35 TextView tv = (TextView) v.findViewById(R.id.tv_item); 36 String name = tv.getText().toString(); 37 //調用show方法(自定義AlertDialog) 38 show(v,name); 39 return false; 40 } 41 }); 42 el.setAdapter(new MyAdapter());//設置自定義適配器 43 } 44 //定義show方法調出AlertDialog(不再贅述,詳情請看前期相關博文,文章末尾有鏈接) 45 public void show(View v,String name){ 46 AlertDialog.Builder builder = new AlertDialog.Builder(this); 47 builder.setTitle(name);//設置標題名為傳入的字元串(分組內點擊對應的人物名) 48 View msg = getLayoutInflater().inflate(R.layout.altertdialog_layout,null); 49 builder.setView(msg); 50 builder.setPositiveButton("確定", new DialogInterface.OnClickListener() { 51 @Override 52 public void onClick(DialogInterface dialog, int which) { 53 Toast.makeText(ExpandableListViewDemo.this, "已發送", Toast.LENGTH_SHORT).show(); 54 } 55 }); 56 builder.setNegativeButton("取消", new DialogInterface.OnClickListener() { 57 @Override 58 public void onClick(DialogInterface dialog, int which) { 59 Toast.makeText(ExpandableListViewDemo.this, "不想說了", Toast.LENGTH_SHORT).show(); 60 } 61 }); 62 builder.show(); 63 } 64 //設置自定義適配器 65 class MyAdapter extends BaseExpandableListAdapter{ 66 //獲取國家個數 67 @Override 68 public int getGroupCount() { 69 return country.length; 70 } 71 //獲取每個國家對應的人數 72 @Override 73 public int getChildrenCount(int groupPosition) { 74 return heros[groupPosition].length; 75 } 76 //獲取對應國家名 77 @Override 78 public Object getGroup(int groupPosition) { 79 return country[groupPosition]; 80 } 81 //獲取對應國家對應的任務 82 @Override 83 public Object getChild(int groupPosition, int childPosition) { 84 return heros[groupPosition][childPosition]; 85 } 86 //獲取選擇的國家對應數組下標 87 @Override 88 public long getGroupId(int groupPosition) { 89 return groupPosition; 90 } 91 //獲取選擇的任務對應數組下標 92 @Override 93 public long getChildId(int groupPosition, int childPosition) { 94 return childPosition; 95 } 96 //表示人物和國家ID是否穩定的更改底層數據 97 @Override 98 public boolean hasStableIds() { 99 return true; 100 } 101 //獲取一個視圖顯示國家名以及對應的圖標(ListView適配器優化) 102 @Override 103 public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) { 104 ViewHolder vh; 105 if(convertView==null){ 106 convertView=getLayoutInflater().inflate(R.layout.group_layout,null); 107 vh=new ViewHolder(); 108 vh.tv= (TextView) convertView.findViewById(R.id.tv_group); 109 vh.iv= (ImageView) convertView.findViewById(R.id.iv_group); 110 convertView.setTag(vh); 111 } 112 vh= (ViewHolder) convertView.getTag(); 113 vh.tv.setText(country[groupPosition]); 114 vh.iv.setImageResource(icon[groupPosition]); 115 return convertView; 116 } 117 //獲取一個視圖顯示國家對應人物以及對應的圖標(ListView適配器優化) 118 @Override 119 public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) { 120 ViewHolder vh; 121 if(convertView==null){ 122 convertView=getLayoutInflater().inflate(R.layout.child_layout,null); 123 vh=new ViewHolder(); 124 vh.tv= (TextView) convertView.findViewById(R.id.tv_item); 125 vh.iv= (ImageView) convertView.findViewById(R.id.iv_item); 126 convertView.setTag(vh); 127 } 128 vh= (ViewHolder) convertView.getTag(); 129 vh.tv.setText(heros[groupPosition][childPosition]); 130 vh.iv.setImageResource(icons[groupPosition][childPosition]); 131 return convertView; 132 } 133 class ViewHolder{ 134 ImageView iv; 135 TextView tv; 136 } 137 //設置子選項(對應人物)是可選的 138 @Override 139 public boolean isChildSelectable(int groupPosition, int childPosition) { 140 return true; 141 } 142 } 143 }
補充說明:
java實現代碼中用到自定義適配器ListView的優化,優化步驟如下:
(1)使用固定寬高(match_parent)的ListView,有助於在填充item(ListView中每行的佈局)時避免重覆渲染ListView組件,導致重覆多次調用getView方法。
(2)Convertview用來重覆使用已被隱藏的item對象,從而避免重覆創建每個item的view對象。
(3)使用ViewHolder優化提高容器中查找組件的效率。
相關博文鏈接:
Android中的AlertDialog使用示例五(自定義對話框)