ExpandableListView简单使用

　　　　Android 中关于ExpandableListView的简单使用，以一个demo为例，比较简单，主要用于理解一些概念性的知识。仅作为学习笔记。

1、定义：可扩展的ListView。

public class ExpandableListView extends ListView {
    ......
}

继承自ListView,因此基本使用方法同ListView：
（1）需要自定义一个继承自BaseExpandableListAdapter的Adapter；当然包括相关的布局等。
（2）注册监听事件；

由于该例子很简单，直接查看代码及注释，更清晰的显示常用方法的作用，在此不再详述。

2、基本用法：

//主界面布局：
    <Button
        android:id="@+id/expandBtn"
        android:textSize="18sp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/expandable_des" 
        />
    
    <ExpandableListView 
        android:layout_marginTop="10dp"
        android:id="@+id/expandableListView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/bg_default" 
        android:groupIndicator="@null"
        android:visibility="gone"
         
        ></ExpandableListView>
    <!-- 
    android:groupIndicator="@null"  去掉系统自带的展开图标
     -->

//自定义适配器ExpandAdapter.java
public class ExpandAdapter extends BaseExpandableListAdapter {
    private final String TAG = "ExpandAdapter";

    private Context mContext;
    private LayoutInflater layoutInflater;

    private String[] groupNames = new String[]
            {"C++","JAVA","Android","HTML"};

//    private Drawable leftDrawable;　　　　　　　　//具体看本文末尾补充部分
    private int arrowUpId,arrowDownId;

    public ExpandAdapter(Context context) {
        // TODO Auto-generated constructor stub
        mContext = context;
        layoutInflater = LayoutInflater.from(mContext);

        arrowUpId = R.drawable.arrow_up;
        arrowDownId = R.drawable.arrow_down;
        
//        leftDrawable = context.getDrawable(R.drawable.ic_launcher);
//        leftDrawable.setBounds(0, 0, leftDrawable.getMinimumWidth(), leftDrawable.getMinimumHeight());
    }

    @Override
    public Object getChild(int arg0, int arg1) {
        // TODO Auto-generated method stub
        return null;
    }

    @Override
    public long getChildId(int arg0, int arg1) {
        // TODO Auto-generated method stub
        return arg1;
    }

    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View childView,
            ViewGroup parent) {   //子项布局
        // TODO Auto-generated method stub
        ChildHolder childHolder;

        if(childView == null){
            childView = layoutInflater.inflate(R.layout.child_view, null);
            childHolder = new ChildHolder();
            childHolder.child_content = (TextView) childView.findViewById(R.id.child_content);
            childView.setTag(childHolder);
        }else{
            childHolder = (ChildHolder) childView.getTag();
        }

//        Log.d(TAG, "getChildView groupPos: " + groupPosition + "  childPos: " + childPosition);

//        if(groupPosition < groupNames.length){
//            groupHolder.name_type.setText(groupNames[groupPosition]);
//        }
        
//        if(childPosition % 2 == 0){
//            childHolder.child_content.setText("使用  drawableLeft getChildView  getChildView  getChildView getChildView");
//            childHolder.child_content.setCompoundDrawables(leftDrawable, null, null, null);
//        }    

        return childView;
    }

    @Override
    public int getChildrenCount(int arg0) {  //子项总数
        return 5;
    }

    @Override
    public Object getGroup(int arg0) {
        return groupNames[arg0];
    }

    @Override
    public int getGroupCount() {    //一级列表项数
        return groupNames.length;
    }

    @Override
    public long getGroupId(int groupPosition) {
        return groupPosition;
    }

    @Override
    public View getGroupView(int groupPosition, boolean isExpand, View convertView, ViewGroup parent) {//一级列表项
        // TODO Auto-generated method stub
        GroupHolder groupHolder;

        if(convertView == null){
            convertView = layoutInflater.inflate(R.layout.grounp_view, null);
            groupHolder = new GroupHolder();
            groupHolder.img_type = (ImageView) convertView.findViewById(R.id.img_type);
            groupHolder.name_type = (TextView) convertView.findViewById(R.id.name_type);
            groupHolder.img_arrow = (ImageView) convertView.findViewById(R.id.img_arrow);
            convertView.setTag(groupHolder);
        }else{
            groupHolder = (GroupHolder) convertView.getTag();
        }

        if(isExpand){
//            groupHolder.img_arrow.setImageResource(R.drawable.arrow_up);
            groupHolder.img_arrow.setImageResource(arrowUpId);
        }else{
//            groupHolder.img_arrow.setImageResource(R.drawable.arrow_down);
            groupHolder.img_arrow.setImageResource(arrowDownId);
        }
        
        Log.i(TAG, "getGroupView groupPosition: " + groupPosition + "  isExpand: " + isExpand);

        if(groupPosition < groupNames.length){
            groupHolder.name_type.setText(groupNames[groupPosition]);
        }

        return convertView;
    }

    @Override
    public boolean hasStableIds() {
        return false;
    }

    //为了使子项响应点击事件，此处必须返回true!!!!!!!!!!!!!!!!!!!!!!!!!!!
    @Override
    public boolean isChildSelectable(int arg0, int arg1) {
        // TODO Auto-generated method stub
        return true;
    }

    class GroupHolder{
        ImageView img_type,img_arrow;
        TextView name_type;
    }
    class ChildHolder{
        TextView child_content;
    }

}

ExpandableListViewActivity中的基本使用：

　　　　 expandableListView = (ExpandableListView) findViewById(R.id.expandableListView);

        expandAdapter = new ExpandAdapter(this);
        expandableListView.setAdapter(expandAdapter);

//注册监听事件：
    private void initExpandableListener(){
        expandableListView.setOnGroupClickListener(new OnGroupClickListener() {
            @Override
            public boolean onGroupClick(ExpandableListView expandableListView, View arg1, int groupPosition,
                    long arg3) {                    //组(一级列表)点击事件       默认return false;若设为true,表示点击列表不会展开
                // TODO Auto-generated method stub
                Log.i(TAG, "onGroupClick " + groupPosition);

                return false;
            }
        });
        expandableListView.setOnGroupCollapseListener(new OnGroupCollapseListener() {
            @Override
            public void onGroupCollapse(int groupPosition) {        //折叠
                // TODO Auto-generated method stub
                Log.i(TAG, "onGroupCollapse " + groupPosition);

            }
        });
        expandableListView.setOnGroupExpandListener(new OnGroupExpandListener() {
            @Override
            public void onGroupExpand(int groupPosition) {            //展开    若需要展开某项，其他项关闭，可在该处理方法中写入相应逻辑
                // TODO Auto-generated method stub
                Log.i(TAG, "onGroupExpand " + groupPosition);

            }
        });


        //Child
        expandableListView.setOnChildClickListener(new OnChildClickListener() {

            @Override
            public boolean onChildClick(ExpandableListView arg0, View arg1, int groupPosition,
                    int childPosition, long arg4) {
                // TODO Auto-generated method stub
                Log.i(TAG, "onChildClick " + groupPosition  + "  " + childPosition);

                return false;
            }
        });


        //添加一个按钮，用于测试expandGroup(int groupPos, boolean animate)中的animate不同值的显示效果.
        Button expandBtn = (Button) findViewById(R.id.expandBtn);
        expandBtn.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                expandableListView.expandGroup(3, false);            //展开时，是否执行滑动过程; 建议在测试时，选择展开后列表能够超出屏幕的，更容易看到两者不同
                //看源码，发现为true时执行了方法smoothScrollToPosition(position, boundPosition)
                //在默认情况下，点击group选项，系统也会执行上述smoothScrollToPosition方法.
               
            }
        });

    }

函数expandGroup(int groupPos, boolean animate)的执行效果：
　　　　　　　　　　　　　　

　　　　　　　默认界面　　　　　　　　　　　　　　　　　　animate=false　　　　　　　　　　　　　　　　animate=true

3、注意事项：

a.写布局时，为了去掉系统自带的展开图标(上下箭头)，需设置ExpandableListView的android:groupIndicator="@null"

b.可展开列表的适配器一般自定义，并继承自BaseExpandableListAdapter。当然，对于一些简单的数据或布局，可直接使用SimpleExpandableListAdapter或SimpleCursorTreeAdapter。

c.可以让Activity继承ExpandableListActivity,这样在Activity即可重写相关点击事件的方法.因为ExpandableListActivity实现了这些方法的接口。

d.若让子项响应点击事件，必须在ExpandAdapter中设置isChildSelectable()方法返回true。

4、补充：

　　上述demo中的子项布局很简单，因为是简单的测试，所以只在布局中定义了一个TextView，图片使用了android:drawableLeft，在ExpandAdapter中可以看到还保留有在代码中设置图片的代码(注释的部分line)，以下就总结以下用法：

//子项布局child_view.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="10dp"
    android:paddingBottom="10dp"
     >

    <TextView
        android:id="@+id/child_content"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_marginStart="5dp"
        android:drawableLeft="@drawable/ic_launcher"
        android:ellipsize="end"
        android:gravity="center_vertical"
        android:text="child name"
        android:textSize="20sp"
        android:singleLine="true"
        android:maxLength="30"
         />   

</LinearLayout>

总结：android中，若图标+文字确定的，则可使用TextView一个控件来实现，利用drawableLeft/drawableTop...等。但，若图标不确定，需要在代码中动态设置，则建议分开写，ImageView + TextView 。

　　 因，在代码中设置图标很麻烦，需要以下三步：
　　　　（1） leftDrawable(获取Drawable对象)
        　  （2） leftDrawable.setBounds(0, 0, leftDrawable.getMinimumWidth(), leftDrawable.getMinimumHeight());
       　   （3） childHolder.child_content.setCompoundDrawables(leftDrawable, null, null, null);