QQ分组显示列表ExpandableListView组件应用源码

ExpandableListView又称为可扩展的ListView组件，他和ListView组件很相似

不过每行的显示有两个xml文件，一个xml文件用于定义分组列表的显示风格，

还有一个xml文件用于定义分组下面的列表显示风格。如要显示如下图所示的风格

可以用如下代码实现：

public class Friend_manage extends Activity {
    private static final String GROUP_TEXT = "group_text";// 大组成员Map的key
    private Relationshipdao instanceRelationshipdao;//该对象用于获取数据源（由于该类涉及到数据库的操作，故没有给出源代码）

    private List<Map<String, String>> groupData = new ArrayList<Map<String, String>>();// 大组成员
    private List<List<User>> childDatalist = new ArrayList<List<User>>();// 小组成员

    ExAdapter adapter;//将数据绑定到ExpandableListView组件上
    ExpandableListView exList;// 可扩展的ListView
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.friend_manage);
        instanceRelationshipdao = DaoFactory
                .getinstanceRelationshipdao(Friend_manage.this);

        List<User> childrenlist = new ArrayList<User>();
        List<Relationship> rel_user_id = null;
        for (int j = 0; j < 4; j++) {
            rel_user_id = instanceRelationshipdao.getrelationship(
                Login.user.getId(), j);
            childrenlist = getUserbyRelationship(rel_user_id);
            childDatalist.add(childrenlist);
        }

        // 为大小组中添加数据
        Map<String, String> curGroupMap1 = new HashMap<String, String>();
        Map<String, String> curGroupMap2 = new HashMap<String, String>();
        Map<String, String> curGroupMap3 = new HashMap<String, String>();
        Map<String, String> curGroupMap4 = new HashMap<String, String>();
        curGroupMap1.put(GROUP_TEXT, "朋友(" + childDatalist.get(0).size() + ")");
        groupData.add(curGroupMap1);
        curGroupMap2.put(GROUP_TEXT, "亲人(" + childDatalist.get(1).size() + ")");
        groupData.add(curGroupMap2);
        curGroupMap3.put(GROUP_TEXT, "同学(" + childDatalist.get(2).size() + ")");
        groupData.add(curGroupMap3);
        curGroupMap4
                .put(GROUP_TEXT, "陌生人(" + childDatalist.get(3).size() + ")");
        groupData.add(curGroupMap4);

        adapter = new ExAdapter(Friend_manage.this, childDatalist, groupData);
        exList = (ExpandableListView) findViewById(R.id.list);
        exList.setAdapter(adapter);
        exList.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {

            @Override
            public boolean onChildClick(ExpandableListView parent, View v,
                    int groupPosition, int childPosition, long id) {
                // TODO Auto-generated method stub
                Bundle bundle=new Bundle();
                bundle.putSerializable("user1", childDatalist.get(groupPosition).get(childPosition));
                Intent intent=new Intent(Friend_manage.this, Friend_type_show.class);
                intent.putExtras(bundle);
                Friend_manage.this.startActivity(intent);
                return false;
            }
        });
        exList.setOnLongClickListener(new View.OnLongClickListener() {

            @Override
            public boolean onLongClick(View v) {
                // TODO Auto-generated method stub
                return false;
            }
        });
        exList.setGroupIndicator(null);// 不设置大组指示器图标，因为我们自定义设置了
        exList.setDivider(null);// 设置图片可拉伸的
    }

    // 根据List<Relationship>获取User表中的字段
    public List<User> getUserbyRelationship(List<Relationship> rel_list) {
        List<User> list = new ArrayList<User>();
        Userdao instanceUserdao = DaoFactory
                .getinstanceUserdao(Friend_manage.this);
        if(rel_list!=null){
            for (int i = 0; i < rel_list.size(); i++) {
                list.add(instanceUserdao.getUserByid(rel_list.get(i).getUser_id()));
            }
        }
        return list;
    }

    // 关键代码是这个可扩展的listView适配器
    class ExAdapter extends BaseExpandableListAdapter {
        private Context context;//该数据成员必不可少
　　　　 //大小组的数据源可以自定义其数据类型，并不一定就是我这样
        private List<List<User>> childdatalist;//小组列表的数据源
        private List<Map<String, String>> groupData;//大组列表的数据源

        public ExAdapter(Context context, List<List<User>> childdatalist,
                List<Map<String, String>> groupData) {
            super();
            this.context = context;
            this.childdatalist = childdatalist;
            this.groupData = groupData;
        }

        // 得到大组成员的view
        public View getGroupView(int groupPosition, boolean isExpanded,
                View convertView, ViewGroup parent) {
            View view = convertView;
            if (view == null) {
                LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                view = inflater.inflate(R.layout.member_listview, null);//member_listview.xml文件用于定义GroupView的显示
            }

            TextView title = (TextView) view.findViewById(R.id.content_001);
            title.setText(getGroup(groupPosition).toString());// 设置大组成员名称

            ImageView image = (ImageView) view.findViewById(R.id.ImageView01);// 是否展开大组的箭头图标
            if (isExpanded)// 大组展开时
                image.setBackgroundResource(R.drawable.uyun_next_n);
            else
                // 大组合并时
                image.setBackgroundResource(R.drawable.uyun_next_no);

            return view;
        }

        // 得到大组成员的id
        public long getGroupId(int groupPosition) {
            return groupPosition;
        }

        // 得到大组成员名称
        public Object getGroup(int groupPosition) {
            return groupData.get(groupPosition).get(GROUP_TEXT).toString();
        }

        // 得到大组成员总数
        public int getGroupCount() {
            return groupData.size();

        }

        // 得到小组成员的view
        public View getChildView(int groupPosition, int childPosition,
                boolean isLastChild, View convertView, ViewGroup parent) {
            View view = convertView;
            if (view == null) {
                LayoutInflater inflater = LayoutInflater.from(context);
                view = inflater.inflate(R.layout.member_childitem, null);//member_childitem.xml文件定义小组列表的显示风格
            }
            final TextView title = (TextView) view
                    .findViewById(R.id.child_text);
            title.setText(childdatalist.get(groupPosition).get(childPosition)
                    .getName());// 大标题

            final TextView title2 = (TextView) view
                    .findViewById(R.id.child_text2);
            title2.setText(childdatalist.get(groupPosition).get(childPosition)
                    .getInfo());// 小标题
            final ImageView seximage=(ImageView)view.findViewById(R.id.child_image);
            if("男".equals(childdatalist.get(groupPosition).get(childPosition).getSex())){
                seximage.setBackgroundResource(R.drawable.friends_man);
            }else{
                seximage.setBackgroundResource(R.drawable.friends_woman);
            }
            return view;
        }

        // 得到小组成员id
        public long getChildId(int groupPosition, int childPosition) {
            return childPosition;
        }

        // 得到小组成员的名称
        public Object getChild(int groupPosition, int childPosition) {
                return childdatalist.get(groupPosition).get(childPosition);
        }

        // 得到小组成员的数量
        public int getChildrenCount(int groupPosition) {
            return childdatalist.get(groupPosition).size();
        }

        public boolean hasStableIds() {
            return true;
        }

        // 得到小组成员是否被选择
        public boolean isChildSelectable(int groupPosition, int childPosition) {
            return true;
        }

    }
}

member_listview.xml文件用于定义GroupView的显示，代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:orientation="horizontal">
        <ImageView
            android:id="@+id/ImageView01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:paddingTop="10dp">
        </ImageView>
            <TextView
                android:id="@+id/content_001"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_gravity="center_vertical"
                android:gravity="center_vertical"
                android:paddingLeft="10dp"
                android:textColor="#ff0000"
                android:textSize="30sp" >
            </TextView>
    </LinearLayout>

member_childitem.xml文件定义小组列表的显示风格，代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/childlayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" >  

    <ImageView
        android:id="@+id/child_image"
        android:layout_width="50dip"
        android:layout_height="60dip"
        android:layout_marginLeft="40dp"
        android:background="@drawable/friends_man"
        android:paddingTop="10dp" >
    </ImageView>  

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical" >  

        <TextView
            android:id="@+id/child_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:gravity="center_vertical"
            android:text=""
            android:textColor="#000000"
            android:textSize="25sp" >
        </TextView>  

        <TextView
            android:id="@+id/child_text2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:gravity="center_vertical"
            android:text=""
            android:textColor="#000000"
            android:textSize="20sp" >
        </TextView>
    </LinearLayout>  

</LinearLayout>