正文
android 模仿大众点评团购卷列表多余3条时折叠,点击时显示剩余全部的功能
小程序：扫一扫查出行【扫一扫了解最新限行尾号】
复制小程序
要实现这样一个效果：加载一组数据，当这组数据的条数超过2条时，则这显示两条，其余的隐藏，当点击“展开全部时”在显示余下的部分。效果如下图所示：
展开前的效果：
展开后的效果
：
实现思路：控制数据而不是控制界面。什么意思呢？当页面加载时，首先判断加载的数据是否大于2，如果小于等于2则直接显示，如果大于2则将前两条数据存入集合，并给adapter赋值，界面上就只会显示两条了，当点击展开全部时，将所有的数据填充到adapter中，并刷新adapter即可。
下面是实现的主要代码：
FlexibleListActivity.java
package cn.yw.lib.flexible;import java.util.ArrayList;
import java.util.List;import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ListView;
import android.widget.TextView;
import cn.yw.lib.R;public class FlexibleListActivity extends Activity implements OnClickListener {
private ListView listView;
private TextView tv;
private FlexibleAdapter adapter = null;
private List<String> datas = new ArrayList<String>();
private List<String> newDatas = new ArrayList<String>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.flexiblelistview_layout);
intViews();
}
private void initDatas(){
datas.add("小西点餐厅");
datas.add("喜事蛋糕");
datas.add("烤香肠");
datas.add("火锅");
datas.add("小笼包");
}
/**
* 第一次加载数据时，如果数据超出3条则只显示前3条。
* 点击下面的按钮显示全部。
*/
private void firstLoad(){
newDatas.addAll(datas.subList(0, 2));
// newDatas.subList(start, end)
}
private void intViews() {
initDatas();//初始化数据
firstLoad();//显示第一次要加载的数据
listView = (ListView) findViewById(R.id.flexible_listview);
adapter = new FlexibleAdapter();
adapter.setList(newDatas);
listView.setAdapter(adapter);
tv = (TextView) findViewById(R.id.flexible_tv);
tv.setOnClickListener(this);
} @Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.flexible_tv:
adapter.setList(datas);//显示所有数据
adapter.notifyDataSetChanged();
tv.setVisibility(View.GONE);
break;
}
}
/**
* ListView适配器
* @author tony
*
*/
class FlexibleAdapter extends BaseAdapter {
private List<String> datas = new ArrayList<String>(); public void setList(List<String> datas) {
this.datas = datas;
} @Override
public int getCount() {
return datas.size();
} @Override
public Object getItem(int arg0) {
return datas.get(arg0);
} @Override
public long getItemId(int arg0) {
return arg0;
} @Override
public View getView(int position, View convertView, ViewGroup arg2) {
ViewHolder holder = null;
if (convertView == null) {
convertView = LayoutInflater.from(FlexibleListActivity.this)
.inflate(R.layout.flexiblelistview_item, null);
holder = new ViewHolder();
holder.tv = (TextView) convertView
.findViewById(R.id.flexible_item_tv);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
holder.tv.setText(datas.get(position));
return convertView;
} class ViewHolder {
TextView tv;
}
}
}
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="vertical" > <LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" > <ListView
android:id="@+id/flexible_listview"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</ListView> <TextView
android:id="@+id/flexible_tv"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:text="展开显示全部" />
</LinearLayout></LinearLayout>
item文件
<?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="vertical" >
<TextView
android:id="@+id/flexible_item_tv"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:drawableLeft="@drawable/ic_launcher"
android:layout_marginLeft="5dip"
android:drawablePadding="10dip"
/></LinearLayout>
代码的实现效果：
