Android Imitation QQ buddy list Implementation list shrink and expand _android

Source: Internet
Author: User

Expandablelistview is a view with a vertical scrolling display of level two list items, unlike ListView, which can have two layers: each layer can be expanded independently and displayed with its subkeys.
Friends QQ list, you can expand, you can put up, in Android, the past is more than ListView, although you can implement the display of the list, but in some cases, we still want to use can be grouped and realize the contraction of the list, That is to use the Android Expandablelistview, today studied the use of this, but also refer to a lot of information to write a small demo, to achieve the basic functions, the following directly on the effect map and source code ~!
The effect of this article:

First, the realization principle
1, you must first define a Expandablelistview in the layout file
2, followed by the creation of a first-level entry corresponding to the layout file group
3, create a level two entry corresponding to the layout file child
4, the activity that loads Expandablelistview component must inherit from expandablelistactivity
second, layout and code
1, first in the main layout of the Activity_main.xml

<linearlayout xmlns:android= "http://schemas.android.com/apk/res/android" 
  android:layout_width= "Fill_ Parent " 
  android:layout_height=" fill_parent " 
  android:orientation=" vertical "> 
 
  < Expandablelistview 
    android:id= "@id/android:list" 
    android:layout_width= "fill_parent" 
    android:layout _height= "Fill_parent"/> 
 
</LinearLayout> 

2, next in the Drawable folder to define the layout level list Groups.xml

<linearlayout 
  xmlns:android= "http://schemas.android.com/apk/res/android" 
  android:orientation= " Vertical " 
  android:layout_width=" fill_parent " 
  android:layout_height=" fill_parent " 
> 
  < TextView 
    android:id= "@+id/textgroup" 
    android:layout_width= "Fill_parent" 
    Fill_parent " 
    android:paddingleft=" 40px " 
    android:paddingtop=" 6px " 
    android:paddingbottom=" 6px " 
    android:textsize= "25SP" 
    android:text= "No data" 
  /> 
 
</LinearLayout> 

3, then in the Drawable folder to define the layout level two list childs.xml

<linearlayout 
  xmlns:android= "http://schemas.android.com/apk/res/android" 
 android:orientation= " Vertical " 
  android:layout_width=" fill_parent " 
  android:layout_height=" fill_parent " 
> 
< TextView  
    android:id= "@+id/textchild" 
  android:layout_width= "Fill_parent" 
    Fill_parent " 
    android:paddingleft=" 60px " 
    android:paddingtop=" 10px " 
    android:paddingbottom=" 10px " 
    android:textsize= "20sp" 
  android:text= "No Data" 
/> 
 
</LinearLayout> 

4, and then it is initialized and used

Package Com.example.expandablelistview; 
Import java.util.ArrayList; 
Import Java.util.HashMap; 
Import java.util.List; 
Import Java.util.Map; 
Import Android.os.Bundle; 
Import android.app.ExpandableListActivity; 
Import Android.util.DisplayMetrics; 
Import Android.view.View; 
Import Android.widget.ExpandableListView; 
Import Android.widget.SimpleExpandableListAdapter; 
 
Import Android.widget.Toast; public class Mainactivity extends Expandablelistactivity {/** * Create a first level entry container * * list<map<string, STRING&G 
  t;> gruops = new arraylist<map<string, string>> (); /** * Store content for display in list * * list<list<map<string, string>>> childs = new Arraylist<list<map 
 
  <string, string>>> (); 
    @Override public void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); 
    Setcontentview (R.layout.activity_main); 
  Setlistdata (); 
    /** * Set list content */public void Setlistdata () {Create two first-level entry headings map<string, string> title_1 = new hashmap<string, string> (); 
    map<string, string> title_2 = new hashmap<string, string> (); 
    map<string, string> title_3 = new hashmap<string, string> (); 
    Title_1.put ("group", "Lin Bingwen"); 
    Title_2.put ("group", "Wenbinglin"); 
    Gruops.add (title_1); 
 
    Gruops.add (title_2); 
    Create level two entry content//content one map<string, string> title_1_content_1 = new hashmap<string, string> (); 
    map<string, string> title_1_content_2 = new hashmap<string, string> (); 
    map<string, string> title_1_content_3 = new hashmap<string, string> (); 
    Title_1_content_1.put ("Child", "worker"); 
    Title_1_content_2.put ("Child", "student"); 
 
    Title_1_content_3.put ("Child", "peasant"); 
    list<map<string, string>> childs_1 = new arraylist<map<string, string>> (); 
    Childs_1.add (title_1_content_1); 
    Childs_1.add (title_1_content_2); Childs_1.add (title_1_Content_3); 
    Content two map<string, string> title_2_content_1 = new hashmap<string, string> (); 
    map<string, string> title_2_content_2 = new hashmap<string, string> (); 
    map<string, string> title_2_content_3 = new hashmap<string, string> (); 
    Title_2_content_1.put ("Child", "orangutan"); 
    Title_2_content_2.put ("Child", "Tiger"); 
    Title_2_content_3.put ("Child", "lion"); 
    list<map<string, string>> childs_2 = new arraylist<map<string, string>> (); 
    Childs_2.add (title_2_content_1); 
    Childs_2.add (title_2_content_2); 
 
    Childs_2.add (Title_2_content_3); 
    Childs.add (Childs_1); 
 
    Childs.add (childs_2); /** * Create expandablelist Adapter container parameters: 1. Context 2. First-level collection 3. One-level style file 4. First level Entry key value * 5. Display control name 6. Second-level set 7. 
        Second-level style 8. Level Two entry key value 9. Two Display control name * */Simpleexpandablelistadapter SELA = new Simpleexpandablelistadapter ( This, Gruops, r.drawable.groups, new string[] {"Group"}, new INt[] {R.id.textgroup}, Childs, R.drawable.childs, new string[] {"Child"}, new int[] {r.id.textchild}); 
  Add list Setlistadapter (SELA); /** * List Content Press */@Override public boolean Onchildclick (expandablelistview parent, View v, int g 
            roupposition, int childposition, long id) {Toast.maketext (Mainactivity.this, "you selected" 
                + Gruops.get (groupposition). toString () + "sub-number" + Childs.get (groupposition). Get (Childposition) 
    . toString (), Toast.length_short). Show (); 
  Return Super.onchildclick (parent, V, groupposition, childposition, id); 
      /** * Level Two title Press */@Override public boolean setselectedchild (int groupposition, int childposition, Boolean Shouldexpandgroup) {return Super.setselectedchild (groupposition, Childposition, Shouldexpandgroup 
  ); /** * Level Header Press/@Override public void setselectedgroup (int groupposition) {super.setselectedgroup (groupposition); 
 } 
}

5, the effect
This is the effect on my phone, click on the worker. I have a cue box on my phone when I'm a two-level list of students, but I don't know why I recorded it.

Three, custom list icon
The above icon is generated by the system itself, below we want to change to their own
1, change the custom icon
Create a new Expandablelistview_change.xml under the Drawable folder

<?xml Version = "1.0"  encoding = "Utf-8"?> <selector xmlns:android  = "http://schemas.android.com /apk/res/android ">    
   <item android:state_expanded =" true "  android:drawable =" @drawable/w2 "/>    
   <item android:drawable = "@drawable/w1"/>    
</selector >  

2, modify the above layout Activity.main.xml

<linearlayout xmlns:android= "http://schemas.android.com/apk/res/android" 
  android:layout_width= "Fill_ Parent " 
  android:layout_height=" fill_parent " 
  android:orientation=" vertical "> 
 
  < Expandablelistview 
    android:id= "@id/android:list" 
    android:layout_width= "fill_parent" 
    android:layout _height= "Fill_parent" 
    android:background= "#f5f5f5" 
    android:cachecolorhint= "#f5f5f5" 
    android: Groupindicator= "@drawable/expandablelistview_change"/> 
 
</LinearLayout> 

In fact, just added a sentence
android:groupindicator= "@drawable/expandablelistview_change"
now let's take a look at the effect:

Four, the icon to put to the right
in the above Mainactivity.java function Setlistdata () plus:

Get the size of the screen 
displaymetrics dm = new Displaymetrics (); 
Getwindowmanager (). Getdefaultdisplay (). Getmetrics (DM); 
The icon is set to the right 
Getexpandablelistview (). Setindicatorbounds (dm.widthpixels-60, dm.widthpixels);//Set the location of the indicator icon 

Effect:

The above is the entire content of this article, I hope to learn more about Android software programming help.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.