ListView嵌套CheckBox在应用中很常见,比如es文件管理器中多选文件。
下面就自己来实现一下。看最终效果。
首先来看两个布局文件:
主布局文件:
很简单,就一个listiew。
item布局文件:
每项都有一个图片,一个textiew和CheckBox。
再自己创建一个Adapter类,继承BaseAdapter。
package com.empty.adaptertest; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.CheckBox; import android.widget.ImageView; import android.widget.TextView; public class MyListAdapter extends BaseAdapter{ // 填充数据的list private ArrayListmList; // 用来控制CheckBox的选中状况 private static HashMap isSelected; // 上下文 private Context mContext; // 用来导入布局 private LayoutInflater inflater = null; private List
主Activity:
package com.empty.adaptertest; import java.util.ArrayList; import android.os.Bundle; import android.app.Activity; import android.app.AlertDialog; import android.app.AlertDialog.Builder; import android.app.ListActivity; import android.view.Menu; import android.view.View; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.ListView; import android.widget.Toast; import com.empty.adaptertest.*; import com.empty.adaptertest.MyListAdapter.ViewHolder; public class TestActivity extends Activity{ private ListView mListView; private MyListAdapter mAdapter; private ArrayListlist; private int checkNum; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_list); mListView=(ListView)findViewById(R.id.main_list); list = new ArrayList (); // 为Adapter准备数据 initDate(); // 实例化自定义的MyAdapter mAdapter = new MyListAdapter(list, this); mListView.setAdapter(mAdapter); mListView.setOnItemClickListener(new OnItemClickListenerImpl()); } private class OnItemClickListenerImpl implements OnItemClickListener { @Override public void onItemClick(AdapterView arg0, View arg1, int arg2, long arg3) { // TODO Auto-generated method stub // 取得ViewHolder对象,这样就省去了通过层层的findViewById去实例化我们需要的cb实例的步骤 ViewHolder holder = (ViewHolder) arg1.getTag(); // 改变CheckBox的状态 holder.cb.toggle(); // 将CheckBox的选中状况记录下来 mAdapter.getIsSelected().put(arg2, holder.cb.isChecked()); // 调整选定条目 if (holder.cb.isChecked() == true) { checkNum++; } else { checkNum--; } // 用TextView显示 Toast.makeText(getApplicationContext(), "You choose "+checkNum+"items.", Toast.LENGTH_SHORT).show(); } }; private void initDate() { for (int i = 0; i < 15; i++) { list.add("data" + " " + i); } } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.activity_list, menu); return true; } }
这样就完成了。动过initDate可以动态地控制listiew的大小,在OnItemClickListenerImpl,通过holder.cb.toggle();来选定CheckBox。
扩展
这种界面在很多情况下并不能提供一个很好的体验,因为listiew大部分的情况是用于呈现内容,单击是用于选择查看,而checkbox并不是一直需要显示,所以我们需要对其进行改进。
改进的效果:正常模式下checkbox不显示。单击item弹出对话框,长按item进入多选模式,checkbox出现,单击item则可选中checkbox。
同时在菜单中显示添加全选与反选。
实现思路就是在主Activity和MyListAdapter中添加一个boolean的状态变量,然后通过OnItemLongClickListener来设置点击的模式。代码如下:
修改后的MyListAdapter
package com.empty.adaptertest; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.CheckBox; import android.widget.ImageView; import android.widget.TextView; public class MyListAdapter extends BaseAdapter{ // 填充数据的list private ArrayListmList; // 用来控制CheckBox的选中状况 private static HashMap isSelected; // 上下文 private Context mContext; // 用来导入布局 private LayoutInflater inflater = null; private List
修改后的TestActivity
package com.empty.adaptertest; import java.util.ArrayList; import android.os.Bundle; import android.app.Activity; import android.app.AlertDialog; import android.app.AlertDialog.Builder; import android.app.ListActivity; import android.view.KeyEvent; import android.view.Menu; import android.view.MenuItem; import android.view.View; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.AdapterView.OnItemLongClickListener; import android.widget.ListView; import android.widget.Toast; import com.empty.adaptertest.*; import com.empty.adaptertest.MyListAdapter.ViewHolder; public class TestActivity extends Activity{ private ListView mListView; private MyListAdapter mAdapter; private ArrayListlist; private int checkNum; private boolean isMultiChoose; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_list); mListView=(ListView)findViewById(R.id.main_list); list = new ArrayList (); // 为Adapter准备数据 initDate(); // 实例化自定义的MyAdapter mAdapter = new MyListAdapter(list, this); mListView.setAdapter(mAdapter); mListView.setOnItemClickListener(new OnItemClickListenerImpl()); mListView.setOnItemLongClickListener(new OnItemLongClickListenerImpl()); isMultiChoose=false; } private class OnItemClickListenerImpl implements OnItemClickListener { @Override public void onItemClick(AdapterView arg0, View arg1, int arg2, long arg3) { // TODO Auto-generated method stub /**/ // 取得ViewHolder对象,这样就省去了通过层层的findViewById去实例化我们需要的cb实例的步骤 if(isMultiChoose) { ViewHolder holder = (ViewHolder) arg1.getTag(); // 改变CheckBox的状态 holder.cb.toggle(); // 将CheckBox的选中状况记录下来 mAdapter.getIsSelected().put(arg2, holder.cb.isChecked()); // 调整选定条目 if (holder.cb.isChecked() == true) { checkNum++; } else { checkNum--; } // 用TextView显示 Toast.makeText(getApplicationContext(), "You choose "+checkNum+"items.", Toast.LENGTH_SHORT).show(); } else { AlertDialog.Builder builder = new Builder(TestActivity.this); builder.setMessage("You Clicked Me!"); builder.setTitle("Warning"); builder.setPositiveButton("Ok",null); builder.show(); } } }; private class OnItemLongClickListenerImpl implements OnItemLongClickListener { @Override public boolean onItemLongClick(AdapterView arg0, View arg1, int arg2, long arg3) { // TODO Auto-generated method stub isMultiChoose=true; mAdapter.setIsMultiChoose(isMultiChoose); mListView.setAdapter(mAdapter); return false; } } private void initDate() { for (int i = 0; i < 15; i++) { list.add("data" + " " + i); } } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. //getMenuInflater().inflate(R.menu.activity_list, menu); menu.add(0,1,1,"Select All"); menu.add(0,2,2,"Select Invert"); menu.add(0,3,3,"Exit"); //getMenuInflater().inflate(R.menu.activity_gtd, menu); return true; } @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { // TODO Auto-generated method stub if(item.getItemId()==1) { isMultiChoose=true; mAdapter.setIsMultiChoose(isMultiChoose); mListView.setAdapter(mAdapter); for (int i = 0; i < list.size(); i++) { mAdapter.getIsSelected().put(i, true); } // 数量设为list的长度 checkNum = list.size(); // 刷新listview和TextView的显示 dataChanged(); } if(item.getItemId()==2) { for (int i = 0; i < list.size(); i++) { if (mAdapter.getIsSelected().get(i)) { mAdapter.getIsSelected().put(i, false); checkNum--; } else { mAdapter.getIsSelected().put(i, true); checkNum++; } } // 刷新listview和TextView的显示 dataChanged(); } if(item.getItemId()==3) finish(); return super.onMenuItemSelected(featureId, item); } @Override public boolean onKeyDown(int keyCode, KeyEvent event) { // TODO Auto-generated method stub if (keyCode == KeyEvent.KEYCODE_BACK && event.getRepeatCount() == 0) { // do something on back. if(isMultiChoose) { isMultiChoose=false; mAdapter.setIsMultiChoose(isMultiChoose); mListView.setAdapter(mAdapter); // 遍历list的长度,将已选的按钮设为未选 for (int i = 0; i < list.size(); i++) { if (mAdapter.getIsSelected().get(i)) { mAdapter.getIsSelected().put(i, false); checkNum--;// 数量减1 } } // 刷新listview和TextView的显示 dataChanged(); } return true; } return super.onKeyDown(keyCode, event); } // 刷新listview和TextView的显示 private void dataChanged() { // 通知listView刷新 mAdapter.notifyDataSetChanged(); } }
参考: android UI进阶之实现listview中checkbox的多选与记录-http://blog.csdn.net/notice520/article/details/7266896