前言:
最近一个多月在认真的学习Android和做项目,文章内容表达的不好或者理解错了,希望大家评论指出。 :-)
本文是总结几个比较常用且使用的技巧,和一个大家都会遇到的问题。
文章中大部分语句摘抄自一下两篇大神写的文章:(如果对ExpandableListView一无所知,建议按照顺序去阅读,遇到问题再看本文)
1、Android中ExpandableListView的使用
网址:http://blog.csdn.net/gyflyx/article/details/6461242
2、[Android UI设计]ExpandableListView详解
网址:http://www.tuicool.com/articles/JjaMnqf
ExpandableListView是Android中可以实现下拉ListView的一个控件,是ListView的子类。
直接上图,就是这么一功能~
(点击就会展开,再点击就缩回去)
Android自带的布局不是这样的,这个是自定义了Group和Child的布局。
ExpandableListView的使用步骤:
1、在xml中定义一个ExpandableListView
2、在类中定义两个List集合,用于存放Group/Child中的内容,并初始化内容
3、定义ExpandableListView的Adapter,继承BaseExpanableListAdapter
例如:public class MyExpandableAdapter extends BaseExpandableListAdapter
4、最后给定义好的ExpandableView添加上Adapter
这里就贴出两个子布局的代码和MyExpandableAdapter的代码~
expandlist_group.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="70dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="#d1d1d1"
android:layout_marginTop="15dp">
<TextView
android:id="@+id/tv_group_name"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="30dp"
android:text="小猫"
android:textColor="#ffffff"
android:textSize="20sp"
android:gravity="center_vertical"/>
<ImageView
android:id="@+id/iv_arrow"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="20dp"
android:background="@drawable/right_arrow"/>
</RelativeLayout>
</LinearLayout>
expandlist_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="45dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="45dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#b3b3b3">
<TextView
android:id="@+id/tv_child_name"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="30dp"
android:text="声音1"
android:textColor="#ffffff"
android:textSize="20sp"
android:gravity="center_vertical"/>
<ImageView
android:id="@+id/iv_sound"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="20dp"
android:background="@drawable/sound"/>
<ImageView
android:id="@+id/iv_divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#ecf0f1"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_alignParentTop="true"/>
</RelativeLayout>
</LinearLayout>
MyExpandableAdapter.java
public class MyExpandableAdapter extends BaseExpandableListAdapter {
private List<String> groupArray;
private List<List<String>> childArray;
private Context mContext;
public MyExpandableAdapter(Context context, List<String> groupArray, List<List<String>> childArray){
mContext = context;
this.groupArray = groupArray;
this.childArray = childArray;
}
@Override
public int getGroupCount() {
return groupArray.size();
}
@Override
public int getChildrenCount(int groupPosition) {
return childArray.get(groupPosition).size();
}
@Override
public Object getGroup(int groupPosition) {
return groupArray.get(groupPosition);
}
@Override
public Object getChild(int groupPosition, int childPosition) {
return childArray.get(groupPosition).get(childPosition);
}
@Override
public long getGroupId(int groupPosition) {
return groupPosition;
}
@Override
public long getChildId(int groupPosition, int childPosition) {
return childPosition;
}
@Override
public boolean hasStableIds() {
return true;
}
@Override
public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
View view = convertView;
GroupHolder holder = null;
if(view == null){
holder = new GroupHolder();
view = LayoutInflater.from(mContext).inflate(R.layout.expandlist_group, null);
holder.groupName = (TextView)view.findViewById(R.id.tv_group_name);
holder.arrow = (ImageView)view.findViewById(R.id.iv_arrow);
view.setTag(holder);
}else{
holder = (GroupHolder)view.getTag();
}
//判断是否已经打开列表
if(isExpanded){
holder.arrow.setBackgroundResource(R.drawable.dowm_arrow);
}else{
holder.arrow.setBackgroundResource(R.drawable.right_arrow);
}
holder.groupName.setText(groupArray.get(groupPosition));
return view;
}
@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
View view = convertView;
ChildHolder holder = null;
if(view == null){
holder = new ChildHolder();
view = LayoutInflater.from(mContext).inflate(R.layout.expandlist_item, null);
holder.childName = (TextView)view.findViewById(R.id.tv_child_name);
holder.sound = (ImageView)view.findViewById(R.id.iv_sound);
holder.divider = (ImageView)view.findViewById(R.id.iv_divider);
view.setTag(holder);
}else{
holder = (ChildHolder)view.getTag();
}
if(childPosition == 0){
holder.divider.setVisibility(View.GONE);
}
holder.sound.setBackgroundResource(R.drawable.sound);
holder.childName.setText(childArray.get(groupPosition).get(childPosition));
return view;
}
@Override
public boolean isChildSelectable(int groupPosition, int childPosition) {
return true;
}
class GroupHolder{
public TextView groupName;
public ImageView arrow;
}
class ChildHolder{
public TextView childName;
public ImageView sound;
public ImageView divider;
}
}
有一下几点需要注意的:
1.设置指示器
有人也许会发现效果图中没有默认箭头(指示器),因为我隐藏了啊~
ExpandableListView expandableListView;
...省略获取id得到实例的代码
expandableListView.setGroupIndicator(null),这样就是设置没有指示器,就是默认的箭头。
如果刚刚的代码,没有设置隐藏指示器就是下图的效果:
(这样就不好看了!!)
2.自定义指示器
隐藏了就要自定义一个指示器了喔。
在ExpandableAdapter中的getGroupView中参数有一个参数是isExpanded,代表当前Group是否已经打开。
关键代码:
//判断是否已经打开列表
if(isExpanded){
holder.arrow.setBackgroundResource(R.drawable.dowm_arrow);
}else{
holder.arrow.setBackgroundResource(R.drawable.right_arrow);
}
打开了就返回true,没有打开就返回false。
3.默认打开某一个Group
ExpandableListView expandableListView;
...省略获取id得到实例的代码
expandableListView.expandGroup(int)
4.设置每一个item的高度
这个问题困扰了我很久,上面的两个链接也没有明确的说明,于是就百度了半天,终于找出答案了。
但是不知道为什么,要嵌套布局才可以,就是外面一个布局设定高度,里面再设定一个布局也设定高度。然后实际上宽度和高度都是在第二个里设置才有效。
下面是expandlist_group.xml的部分代码:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="55dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="#d1d1d1"
android:layout_marginTop="15dp">
①第一个布局高度设置55dp,第二个布局高度也设置55dp
效果是这样的:
②第一个布局高度设置75dp,第二个布局高度也设置55dp
然而发现并没有什么用,所以推断第二个布局才是item的高度
这里就演示这么多了,动手实践才是真理,大家可以试一试删除其中一个布局,高度是否还能正常设置。(我试过是不能喔)
第一次写博客,希望对大家有帮助。睡觉~zzzzz