Use ExpandableListView in Android to implement friend grouping and expandablelistview

Use ExpandableListView in Android to implement friend grouping and expandablelistview

A view shows entries in the list vertically scrolling. This is different from the list view, which allows two levels, similar to QQ's friend group. The overall idea for achieving this effect is:

1. To set an adapter for ExpandableListView, you must first set the data source.

2. The data source is the adapter class here. This method inherits BaseExpandableListAdapter, which is a subclass of ExpandableListView. You need to override multiple methods in it. Detailed comments are provided in the Code. The custom View layout is used in the data source. In this case, you can set the layout style of the group and subitem based on your needs. The getChildView () and getGroupView () methods are used to set the custom layout.

3. After the data source is set, you can directly perform this contraction by setting ExpandableListView. setAdapter.

The following is a simple display result:

In layout, the main view expandable_layout.xml (ExpandableListView layout ):

 

 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>

 

Group_layout.x in LayoutM L ( Group group name displayLayout ):

 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     <TextView13         android:text="TextView"14         android:layout_width="wrap_content"15         android:layout_height="wrap_content"16         android:id="@+id/tv_group" />17 </LinearLayout>

Child_layout.x in LayoutM L ( Sub-menu itemLayout ):

 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     <TextView14         android:text="TextView"15         android:layout_width="wrap_content"16         android:layout_height="wrap_content"17         android:id="@+id/tv_item" />18 </LinearLayout>

Alertdialog_layout.x in LayoutM L ( AlertDialog custom display Layout ):

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 = "enter what you want to say to him"/> 10 </LinearLayout>

Java implementation code in Activity (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 // defines the group name and the corresponding image array, which must correspond to 19 String [] country = {"Wei Guo ", "Shu Guo", "Wu Guo"}; 20 int [] icon = {R. mipmap. wei, R. mipmap. shu, R. mipmap. wu}; 21 // use a two-dimensional definition to define the group members and their corresponding portraits. Similarly, use a one-to-one correspondence with 22 String [] [] heros = {"Sima Yi", "guo jia ", "xia houyao", "Ji" },{ "Liu Bei", "Zhao Yun", "Zhang Fei" },{ "Sun Quan", "Zhou Yu "}}; 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 // set listening event 31 el from the drop-down menu. setOnChildClickListener (new ExpandableListView. onChildClickListener () {32 @ Override 33 public boolean onChildClick (ExpandableListView parent, View v, int groupPosition, int childPosition, long id) {34 // obtain the group member name 35 TextView TV = (TextView) v. findViewById (R. id. TV _item); 36 String name = TV. getText (). toString (); 37 // call the show method (custom AlertDialog) 38 show (v, name); 39 return false; 40} 41}); 42 el. setAdapter (new MyAdapter (); // sets the custom adapter 43} 44 // defines the show method to call up AlertDialog (do not repeat it here. For details, see the previous blog post. There is a link at the end of the article) 45 public void show (View v, String name) {46 AlertDialog. builder builder = new AlertDialog. builder (this); 47 builder. setTitle (name); // set the name of the title to the input string (click the corresponding character name in the group) 48 View msg = getLayoutInflater (). inflate (R. layout. altertdialog_layout, null); 49 builder. setView (msg); 50 builder. setPositiveButton ("OK", new DialogInterface. onClickListener () {51 @ Override 52 public void onClick (DialogInterface dialog, int which) {53 Toast. makeText (ExpandableListViewDemo. this, "sent", Toast. LENGTH_SHORT ). show (); 54} 55}); 56 builder. setNegativeButton ("cancel", new DialogInterface. onClickListener () {57 @ Override 58 public void onClick (DialogInterface dialog, int which) {59 Toast. makeText (ExpandableListViewDemo. this, "don't want to talk about it", Toast. LENGTH_SHORT ). show (); 60} 61}); 62 builder. show (); 63} 64 // set the custom adapter 65 class MyAdapter extends BaseExpandableListAdapter {66 // obtain the number of countries 67 @ Override 68 public int getGroupCount () {69 return country. length; 70} 71 // obtain the number of people in each country 72 @ Override 73 public int getChildrenCount (int groupPosition) {74 return heros [groupPosition]. length; 75} 76 // obtain the corresponding country name 77 @ Override 78 public Object getGroup (int groupPosition) {79 return country [groupPosition]; 80} 81 // obtain the task 82 @ Override 83 public Object getChild (int groupPosition, int childPosition) {84 return heros [groupPosition] [childPosition]; 85} 86 // obtain the array subscript 87 @ Override 88 public long getGroupId (int groupPosition) {89 return groupPosition; 90} 91 // obtain the subscript of the selected task array 92 @ Override 93 public long getChildId (int groupPosition, int childPosition) {94 return childPosition; 95} 96 // indicates whether the underlying data of the character and country ID is stably changed. 97 @ Override 98 public boolean hasStableIds () {99 return true; 100} 101 // get a View to display the country name and corresponding icons (ListView adapter optimization) 102 @ Override103 public View getGroupView (int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {104 ViewHolder VL; 105 if (convertView = null) {106 convertView = getLayoutInflater (). inflate (R. layout. group_layout, null); 107 consecutive seconds = new ViewHolder (); 108 consecutive seconds. TV = (TextView) convertView. findViewById (R. id. TV _group); 109 consecutive seconds. iv = (ImageView) convertView. findViewById (R. id. iv_group); 110 convertView. setTag (vh); 111} 112 VL = (ViewHolder) convertView. getTag (); 113 consecutive seconds. TV. setText (country [groupPosition]); 114 Vl. iv. setImageResource (icon [groupPosition]); 115 return convertView; 116} 117 // obtain a view to display the corresponding country characters and corresponding icons (ListView adapter optimization) 118 @ Override119 public View getChildView (int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {120 ViewHolder VL; 121 if (convertView = null) {122 convertView = getLayoutInflater (). inflate (R. layout. child_layout, null); 123 consecutive seconds = new ViewHolder (); 124 consecutive seconds. TV = (TextView) convertView. findViewById (R. id. TV _item); 125 consecutive seconds. iv = (ImageView) convertView. findViewById (R. id. (iv_item); 126 convertView. setTag (vh); 127} 128 VL = (ViewHolder) convertView. getTag (); 129 consecutive seconds. TV. setText (heros [groupPosition] [childPosition]); 130. iv. setImageResource (icons [groupPosition] [childPosition]); 131 return convertView; 132} 133 class ViewHolder {134 ImageView iv; 135 TextView TV; 136} 137 // set sub-options (corresponding characters) to optional 138 @ Override139 public boolean isChildSelectable (int groupPosition, int childPosition) {140 return true; 141} 142} 143}

 

Note:

The optimization steps of the custom adapter ListView are as follows:

(1) using a ListView with fixed width and height (match_parent) helps avoid repeated rendering of the ListView component when filling the item (layout of each row in the ListView), resulting in repeated calls to the getView method.

(2) Convertview is used to reuse hidden item objects, so as to avoid repeated creation of view objects for each item.

(3) Use ViewHolder optimization to improve the efficiency of searching components in containers.

Related blog links: Example 5 of AlertDialog in Android (custom dialog box)