ExpandableListView从字面意思来说就是对listview的扩展。只要我们掌握listview的用法。ExpandableListView就很容易。listview只是展示一级列表,而ExpandableListView展示的是二级列表。就像qq联系人这块。就是个二级列表。哈哈。。接下来我们就学习使用ExpandableListView这个控件。
我们可以去看看官网对它的介绍
上面的第一段大概意思是说:这个view可以垂直展示两个列表不同于listview。父列表可以展示子列表。这个数据的来源可以来自ExpandableListAdapter这个适配器来关联这个view。。。。
哈哈哈。。。我这绝对是我自己概述的。我绝对没用翻译软件。 不一定理解对哈。。。。讲代码之前先看看效果再来写。。。
这效果是不是像qq联系人这样的效果。不啰嗦,直接放代码哈。。嘻嘻
ContentUtil.java代码如下:
public static int mImgs[] = new int[]{
R.mipmap.ic_launcher,
R.mipmap.ic_launcher,
R.mipmap.ic_launcher,
R.mipmap.ic_launcher,
R.mipmap.ic_launcher,
R.mipmap.ic_launcher
};
public static String names[] = new String[]{
"我的朋友",
"我的好友",
"我的家人",
"我的同学",
"我的兄弟",
"聊得来"
};
public static String counts[] = new String[]{
"12/23",
"12/22",
"14/22",
"1/3",
"4/5",
"4/7"
};
public static int child_img[][] = new int[][]{
{R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher},
{R.mipmap.ic_launcher, R.mipmap.ic_launcher},
{R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher},
{R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher},
{R.mipmap.ic_launcher},
{R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher}
};
public static String child_names[][]=new String[][]{
{"小菜","小宋","小镇","小红"},
{"张三","李四"},
{"王五","赵六","王二"},
{"小看","小龙","小林","小鸟"},
{"笑哭"},
{"小搜","小课","小店"}
};
public static String child_contents[][]=new String[][]{
{"我不是程序员","我不是程序员","我不是程序员","我不是程序员"},
{"我不是程序员","我不是程序员"},
{"我不是程序员","我不是程序员","我不是程序员"},
{"我不是程序员","我不是程序员","我不是程序员","我不是程序员"},
{"我不是程序员"},
{"我不是程序员","我不是程序员","我不是程序员"}
};
这些数据。我是把它写在一个类中了,这样对于我们初学来说方便理解。你也可以写在其它地方。 嘻嘻。。还有我的成员变量用static修饰了,这样做的原因只是可以用类名。来调用。不要static的话你就必须new一个对象出来调用它。。
acitivity_main.xml代码如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.edu.expandablelistviewsimple.MainActivity">
<ExpandableListView
android:groupIndicator="@null"
android:id="@+id/elv"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ExpandableListView>
</RelativeLayout>
很简单。就是一个ExpandableListView控件。
group_item.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:orientation="horizontal">
<ImageView
android:id="@+id/group_img"
android:src="@mipmap/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:gravity="center_horizontal"
android:layout_weight="1"
android:id="@+id/group_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="我的好友"
/>
<TextView
android:id="@+id/group_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1/23"
/>
</LinearLayout>
我们看效果图就知道,父列表就是左边有个图片,中间的文本,右边也是文本。所以我们父列表的item文件就这样定义。。也不难。哈哈。。
child_item.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:orientation="horizontal">
<ImageView
android:id="@+id/child_img"
android:src="@mipmap/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_marginTop="5dp"
android:gravity="center_horizontal"
android:id="@+id/child_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我的好友"
/>
<TextView
android:id="@+id/child_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1/23"
/>
</LinearLayout>
</LinearLayout>
子列表的item是不是也很简单。一个图片,两个文本。。。
其实这些布局文件都简单。。哈哈。。接下来就是我们怎样把数据绑定到ExpandableListView上中,就需要我们重写BaseExpandableListAdapter适配器。如果不懂可以看看我上次写的适配器的使用。仅需四步就可以教你使用适配器。哈哈
http://blog.csdn.net/song_shui_lin/article/details/52579246
MyAdapter.java代码如下:
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.ImageView;
import android.widget.TextView;
/**
* Created by Administrator on 2016/9/19.
*/
public class MyAdapter extends BaseExpandableListAdapter{
private Context context;
private LayoutInflater inflater;
public MyAdapter(Context context) {
this.context = context;
inflater = LayoutInflater.from(context);
}
@Override
public int getGroupCount() {
return ContentUtil.mImgs.length;
}
@Override
public int getChildrenCount(int groupPosition) {
return ContentUtil.child_img[groupPosition].length;
}
@Override
public Object getGroup(int groupPosition) {
return ContentUtil.mImgs[groupPosition];
}
@Override
public Object getChild(int groupPosition, int childPosition) {
return ContentUtil.child_img[groupPosition][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) {
GroupViewHodler holder = null;
View view = null;
if (convertView != null) {
view = convertView;
holder = (GroupViewHodler) view.getTag();
} else {
holder = new GroupViewHodler();
view = inflater.inflate(R.layout.group_item, null);
view.setTag(holder);
holder.group_img = (ImageView) view.findViewById(R.id.group_img);
holder.group_name = (TextView) view.findViewById(R.id.group_name);
holder.group_count = (TextView) view.findViewById(R.id.group_content);
}
holder.group_img.setImageResource(ContentUtil.mImgs[groupPosition]);
holder.group_name.setText(ContentUtil.names[groupPosition]);
holder.group_count.setText(ContentUtil.counts[groupPosition]);
return view;
}
@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
ChildViewHodler hodler = null;
View view = null;
if (convertView != null) {
view = convertView;
hodler = (ChildViewHodler) view.getTag();
} else {
hodler = new ChildViewHodler();
view = inflater.inflate(R.layout.child_item, null);
view.setTag(hodler);
hodler.child_img = (ImageView) view.findViewById(R.id.child_img);
hodler.child_name = (TextView) view.findViewById(R.id.child_name);
hodler.child_content = (TextView) view.findViewById(R.id.child_content);
}
hodler.child_img.setImageResource(ContentUtil.child_img[groupPosition][childPosition]);
hodler.child_name.setText(ContentUtil.child_names[groupPosition][childPosition]);
hodler.child_content.setText(ContentUtil.child_contents[groupPosition][childPosition]);
return view;
}
@Override
public boolean isChildSelectable(int groupPosition, int childPosition) {
return true;
}
}
class GroupViewHodler {
ImageView group_img;
TextView group_name, group_count;
}
class ChildViewHodler {
ImageView child_img;
TextView child_name, child_content;
}
上面的方法,我就是一个方法不太懂,其他的方法基本上可以做到看其名知其意。
1,hasStableIds()
然后我又去看官网api对它的解释:
还 是官网的解释准确。哈哈。。写完了适配器后,基本上我们的基本的差不多做完了。只剩下最后一步了。
MainActivity.java
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ExpandableListView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private ExpandableListView mElv;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initWidgets();
MyAdapter adapter=new MyAdapter(MainActivity.this);
mElv.setAdapter(adapter);
//为子列表添加点击事件
mElv.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
@Override
public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) {
Toast.makeText(MainActivity.this,ContentUtil.child_names[groupPosition][childPosition],Toast.LENGTH_SHORT).show();
return true;
}
});
}
//初始化控件
private void initWidgets() {
mElv= (ExpandableListView) findViewById(R.id.elv);
}
}
总结:
其实我跟大家一样,好水。写博客只是记录下自己平常学的点点滴滴。加油!!!还有不懂的看官网的解释是最好的。
源码下载:
https://github.com/songshuilin/AndroidForBlog/tree/master/expandablelistviewsimple