完全仿QQ好友列表，自定义ExpandableListView！

最近，需要做一个可展开的listview，不禁想起了ExpandableListView。但是，在写了一个简单的例子后，发现了问题：



ExpandableListView是又多个childList组成的。

当展开的childList过长，又需要打开其他的list时，用户只能先滚动到最上面关掉这个childList，才可能打开其他的childlist！



这样的用户体验很差。iPhone做的就很不错，QQ的好友列表顶端 也有类似的导航，显示当前gruop的标签，并且点击就可以关闭当前组，十分方便！

http://androiddada.iteye.com/



好了，今天就模仿做了这个，直接上图：







下面是页面的布局（其他无用的布局我已经去掉了）：





Xml代码



<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="vertical" >





<FrameLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent" >



<com.customWidget.QExListView

android:choiceMode="singleChoice"

android:id="@+id/home_expandableListView"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_below="@id/head_line"

android:cacheColorHint="#00000000"

android:childDivider="@drawable/list_divider_line"

android:divider="@drawable/list_divider_line"

android:dividerHeight="1dip"

android:fadingEdge="none"

android:groupIndicator="@null" />

</FrameLayout>



</LinearLayout>

这里要说明的是：他的父控件一定要为FrameLayout。因为需要添加在ExpandableListView上层的小导航条！



下面是自定义组件QExListView 代码：





Java代码



public class QExListView extends ExpandableListView implements OnScrollListener {







@Override

public void setAdapter(ExpandableListAdapter adapter) {

// TODO Auto-generated method stub

super.setAdapter(adapter);

}





private LinearLayout _groupLayout;

public int _groupIndex = -1;



/**

* @param context

*/

public QExListView(Context context) {

super(context);

super.setOnScrollListener(this);

}



/**

* @param context

* @param attrs

*/

public QExListView(Context context, AttributeSet attrs) {

super(context, attrs);

super.setOnScrollListener(this);

}



/**

* @param context

* @param attrs

* @param defStyle

*/

public QExListView(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);

super.setOnScrollListener(this);

}



@Override

public void onScroll(AbsListView view, int firstVisibleItem,

int visibleItemCount, int totalItemCount) {



if (_exAdapter == null)

_exAdapter = this.getExpandableListAdapter();



int ptp = view.pointToPosition(0, 0);

if (ptp != AdapterView.INVALID_POSITION) {

QExListView qExlist = (QExListView) view;

long pos = qExlist.getExpandableListPosition(ptp);

int groupPos = ExpandableListView.getPackedPositionGroup(pos);

int childPos = ExpandableListView.getPackedPositionChild(pos);





if (childPos < 0) {

groupPos = -1;

}

if (groupPos < _groupIndex) {



_groupIndex = groupPos;



if (_groupLayout != null){

_groupLayout.removeAllViews();

_groupLayout.setVisibility(GONE);//这里设置Gone 为了不让它遮挡后面header

}

} else if (groupPos > _groupIndex) {

final FrameLayout fl = (FrameLayout) getParent();

_groupIndex = groupPos;

if (_groupLayout != null)

fl.removeView(_groupLayout);



_groupLayout = (LinearLayout) getExpandableListAdapter()

.getGroupView(groupPos, true, null, null);

_groupLayout.setOnClickListener(new OnClickListener() {



@Override

public void onClick(View v) {

collapseGroup(_groupIndex);

Home_Act._viewHandler.post(new Runnable() {

@Override

public void run() {

// TODO Auto-generated method stub

fl.removeView(_groupLayout);

fl.addView(_groupLayout, new LayoutParams(

LayoutParams.FILL_PARENT, 50));

}

});

}

});





fl.addView(_groupLayout,fl.getChildCount(), new LayoutParams(

LayoutParams.FILL_PARENT, 50));



}

}

}





@Override

public void onScrollStateChanged(AbsListView view, int scrollState) {

}



}



所用的adapter与ExpandableListView一样，这里就不赘述了。