仿QQ好友列表

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



ExpandableListView是又多个childList组成的。

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



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



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






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





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>

<?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
AbsListView.OnScrollListener {
private ExpandableListAdapter _exAdapter = null;
private LinearLayout _groupLayout;
private 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();
} 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);
// v = (LinearLayout) getExpandableListAdapter().getGroupView(_groupIndex, true, null, null);
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) {
}



}