(4.3.2.1)Android ListView点击展开收起效果(一)
2016-04-26 15:08
513 查看
【声明】此文出自指尖飞落的博客:http://blog.csdn.net/huntersnail
公司的项目是社区购物商城(o2o),大量的需要用到ListView的各种效果,ListView展开收起、头部(Head)和子部(Item)这种结构的ListView,特别是第二种用得最多。写过很多次了,在这里写记录一下自己的笔记,也希望能帮助到有需要的Coder。
一、首先上几种效果:
① ListView点击展开收起
② 头部(Head)和子部(Item)的ListView
③ Android 的系统组件ExpandableListView
相比较,三种ListView的效果都比较相似,第一种实现起来最简单,第二种比较复杂一点,第三种系统提供的拿过来直接用就可以,原始的样式非常Low,可以自己修改一下。
二、主要介绍:ListView点击展开收起的效果(第一种)
这篇博文主要介绍的是第一种ListView点击展开收起的效果,其他几种会在接下来的的博文中介绍。我们知道在BaseAdapter中有一个getCount()的方法,这个方法大家都不陌生,就是数据的数量值,这种简单的ListView点击展开收起的效果就是利用这个方法来做文章的。下面我们来看代码:
1、Activity
[java] view
plain copy
import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.ListView;
/**
* 主页
*
* @author Endoon 2016-1-26 16:57:34
*/
public class MainActivity extends Activity {
private MyAdapter myAdapter;
private ListView listView;
private List<String> list;
private View footView;
private ImageView ivDown;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) findViewById(R.id.listview);
// 获得页脚布局
footView = getLayoutInflater().inflate(R.layout.view_foot, null);
ivDown = (ImageView) footView.findViewById(R.id.iv_down);
initData();
initEvent();
}
/**
* 初始化数据
*/
private void initData() {
// 初始化模拟数据
simulateData();
// 添加页脚视图
listView.addFooterView(footView);
ivDown.setImageDrawable(getResources()
.getDrawable(R.drawable.icon_down));
// 适配
myAdapter = new MyAdapter(MainActivity.this, list);
listView.setAdapter(myAdapter);
}
/**
* 初始化点击事件
*/
private void initEvent() {
ivDown.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
// 判断getCount()数据的数量,如果等于3点击后就设置getCount()为全部数量,设置修改标识,刷新。
// 否则,相反。
if (myAdapter.getCount() == 3) {
myAdapter.addItemNum(list.size());
ivDown.setImageDrawable(getResources().getDrawable(
R.drawable.icon_up));
myAdapter.notifyDataSetChanged();
} else {
myAdapter.addItemNum(3);
ivDown.setImageDrawable(getResources().getDrawable(
R.drawable.icon_down));
myAdapter.notifyDataSetChanged();
}
}
});
}
/**
* 模拟数据
*
* @return
*/
private List<String> simulateData() {
list = new ArrayList<String>();
for (int i = 0; i < 10; i++) {
String circleStr = "蓝色威尼斯城" + (i + 1) + "座";
list.add(circleStr);
}
return list;
}
}
注意:这里的3是自定义的,可以根据自己实际项目需求修改。
2、Adapter
[java] view
plain copy
import java.util.List;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
public class MyAdapter extends BaseAdapter {
private List<String> list;
private LayoutInflater inflater;
private int itemCount = 3;
public MyAdapter(Context context, List<String> list) {
this.list = list;
inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
// 这里是关键
// 如果数据数量大于3,只显示3条数据。这里数量自己定义。
// 否则,显示全部数量。
if (list.size() > 3)
{
return itemCount;
}else
{
return list.size();
}
}
@Override
public Object getItem(int position) {
return list.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder = null;
if (convertView == null) {
viewHolder = new ViewHolder();
convertView = inflater.inflate(R.layout.item_simple_listview, null);
viewHolder.tvCircleName = (TextView) convertView.findViewById(R.id.tv_circie_name);
convertView.setTag(viewHolder);
}else
{
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.tvCircleName.setText(list.get(position));
return convertView;
}
class ViewHolder
{
TextView tvCircleName;
}
/**
* 点击后设置Item的数量
* @param number
*/
public void addItemNum(int number)
{
itemCount = number;
}
}
通过,公共方法addItemNum来修改getCount()的显示,这里起了主要作用!
三、总结
由于项目比较急,所以就用了这种很简单的方法实现,基本上满足了需求。在这里只做了三件事:
① 添加页脚视图。
② 点击页脚视图时,进行判断显示。
③ 修改Adapter的getCount()的值。
代码很简单,总共不过200行,相信大家都能看懂。Over!!!
四、Demo效果图
点击下载源码
☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆转载请注明出处☞指尖飞落的博客☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆
公司的项目是社区购物商城(o2o),大量的需要用到ListView的各种效果,ListView展开收起、头部(Head)和子部(Item)这种结构的ListView,特别是第二种用得最多。写过很多次了,在这里写记录一下自己的笔记,也希望能帮助到有需要的Coder。
一、首先上几种效果:
① ListView点击展开收起
② 头部(Head)和子部(Item)的ListView
③ Android 的系统组件ExpandableListView
相比较,三种ListView的效果都比较相似,第一种实现起来最简单,第二种比较复杂一点,第三种系统提供的拿过来直接用就可以,原始的样式非常Low,可以自己修改一下。
二、主要介绍:ListView点击展开收起的效果(第一种)
这篇博文主要介绍的是第一种ListView点击展开收起的效果,其他几种会在接下来的的博文中介绍。我们知道在BaseAdapter中有一个getCount()的方法,这个方法大家都不陌生,就是数据的数量值,这种简单的ListView点击展开收起的效果就是利用这个方法来做文章的。下面我们来看代码:
1、Activity
[java] view
plain copy
import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.ListView;
/**
* 主页
*
* @author Endoon 2016-1-26 16:57:34
*/
public class MainActivity extends Activity {
private MyAdapter myAdapter;
private ListView listView;
private List<String> list;
private View footView;
private ImageView ivDown;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) findViewById(R.id.listview);
// 获得页脚布局
footView = getLayoutInflater().inflate(R.layout.view_foot, null);
ivDown = (ImageView) footView.findViewById(R.id.iv_down);
initData();
initEvent();
}
/**
* 初始化数据
*/
private void initData() {
// 初始化模拟数据
simulateData();
// 添加页脚视图
listView.addFooterView(footView);
ivDown.setImageDrawable(getResources()
.getDrawable(R.drawable.icon_down));
// 适配
myAdapter = new MyAdapter(MainActivity.this, list);
listView.setAdapter(myAdapter);
}
/**
* 初始化点击事件
*/
private void initEvent() {
ivDown.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
// 判断getCount()数据的数量,如果等于3点击后就设置getCount()为全部数量,设置修改标识,刷新。
// 否则,相反。
if (myAdapter.getCount() == 3) {
myAdapter.addItemNum(list.size());
ivDown.setImageDrawable(getResources().getDrawable(
R.drawable.icon_up));
myAdapter.notifyDataSetChanged();
} else {
myAdapter.addItemNum(3);
ivDown.setImageDrawable(getResources().getDrawable(
R.drawable.icon_down));
myAdapter.notifyDataSetChanged();
}
}
});
}
/**
* 模拟数据
*
* @return
*/
private List<String> simulateData() {
list = new ArrayList<String>();
for (int i = 0; i < 10; i++) {
String circleStr = "蓝色威尼斯城" + (i + 1) + "座";
list.add(circleStr);
}
return list;
}
}
注意:这里的3是自定义的,可以根据自己实际项目需求修改。
2、Adapter
[java] view
plain copy
import java.util.List;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
public class MyAdapter extends BaseAdapter {
private List<String> list;
private LayoutInflater inflater;
private int itemCount = 3;
public MyAdapter(Context context, List<String> list) {
this.list = list;
inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
// 这里是关键
// 如果数据数量大于3,只显示3条数据。这里数量自己定义。
// 否则,显示全部数量。
if (list.size() > 3)
{
return itemCount;
}else
{
return list.size();
}
}
@Override
public Object getItem(int position) {
return list.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder = null;
if (convertView == null) {
viewHolder = new ViewHolder();
convertView = inflater.inflate(R.layout.item_simple_listview, null);
viewHolder.tvCircleName = (TextView) convertView.findViewById(R.id.tv_circie_name);
convertView.setTag(viewHolder);
}else
{
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.tvCircleName.setText(list.get(position));
return convertView;
}
class ViewHolder
{
TextView tvCircleName;
}
/**
* 点击后设置Item的数量
* @param number
*/
public void addItemNum(int number)
{
itemCount = number;
}
}
通过,公共方法addItemNum来修改getCount()的显示,这里起了主要作用!
三、总结
由于项目比较急,所以就用了这种很简单的方法实现,基本上满足了需求。在这里只做了三件事:
① 添加页脚视图。
② 点击页脚视图时,进行判断显示。
③ 修改Adapter的getCount()的值。
代码很简单,总共不过200行,相信大家都能看懂。Over!!!
四、Demo效果图
点击下载源码
☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆转载请注明出处☞指尖飞落的博客☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆
相关文章推荐
- 最全面的 Android 编码规范指南
- 给 Android 开发者的 RxJava 详解
- android 自定义view
- android屏幕适配全攻略
- Android 屏幕适配
- android的消息处理机制(图+源码分析)——Looper,Handler,Message
- android的消息处理机制(图+源码分析)——Looper,Handler,Message
- android的消息处理机制(图+源码分析)——Looper,Handler,Message
- android的消息处理机制(图+源码分析)——Looper,Handler,Message
- android的消息处理机制(图+源码分析)——Looper,Handler,Message
- Android 常用的颜色
- 五、抽象工厂模式
- 云之讯 导入视频sdk到android studio中报错
- Android App中自定义View视图的实例教程
- 在导入design包以后,Android Studio R的问题
- [置顶] Android开发值利用Intent进行put传值,setclass启动activity,并用get进行取值
- Android应用如何做到多尺寸,多语言适配,为什么尺寸对了,表现却不对
- Android开发常用开源框架推荐
- android 点击edittext外面,隐藏输入法
- Ecplise安装git及其使用