带CheckBox的ListView

最新推荐文章于 2020-12-18 17:32:59 发布

拳四郎

最新推荐文章于 2020-12-18 17:32:59 发布

阅读量2.7k

点赞数

分类专栏： Android实战

本文链接：https://blog.csdn.net/silangquan/article/details/8814782

版权

Android实战专栏收录该内容

45 篇文章 1 订阅

订阅专栏

ListView嵌套CheckBox在应用中很常见，比如es文件管理器中多选文件。

下面就自己来实现一下。看最终效果。

首先来看两个布局文件：

主布局文件：

<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"
    tools:context=".ListActivity" >


    <ListView
        android:id="@+id/main_list"    
        android:layout_width="fill_parent"     
        android:layout_height="wrap_content"
        android:background="#ffffff"  
        />

</RelativeLayout>

很简单，就一个listiew。

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" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/item_iv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical" />

        <TextView
            android:id="@+id/item_tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/item_iv"
            android:layout_weight="1"
            android:layout_margin="20dip"
            android:textSize="18dip" 
            android:textColor="#000000"/>

        <CheckBox
            android:id="@+id/item_cb"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_marginRight="30dip"
            android:clickable="false"
            android:focusable="false"
            android:focusableInTouchMode="false" />
    </RelativeLayout>

</LinearLayout>

每项都有一个图片，一个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 ArrayList<String> mList;
	// 用来控制CheckBox的选中状况
	private static HashMap<Integer,Boolean> isSelected;
	// 上下文
	private Context mContext;
	// 用来导入布局
	private LayoutInflater inflater = null;

	private List<Map<String, Object>> mData;    

	// 构造器
	public MyListAdapter(ArrayList<String> list, Context context) {
		this.mContext = context;
		this.mList = list;
		inflater = LayoutInflater.from(context);
		// 初始化数据
		initDate();
	}

	// 初始化isSelected的数据
	private void initDate(){
		//这儿定义isSelected这个map是记录每个listitem的状态，初始状态全部为false。       
		isSelected = new HashMap<Integer, Boolean>();    
        for (int i = 0; i < mList.size(); i++) {    
            isSelected.put(i, false); 
        }        
	}

	@Override
	public int getCount() {
		return mList.size();
		//return mData.size();  
	}

	@Override
	public Object getItem(int position) {
		return mList.get(position);
	}

	@Override
	public long getItemId(int position) {
		return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		ViewHolder holder = null;
		if (convertView == null) {
			// 获得ViewHolder对象
			holder = new ViewHolder();
			// 导入布局并赋值给convertview
			convertView = inflater.inflate(R.layout.list_item, null);
			holder.iv = (ImageView)convertView.findViewById(R.id.item_iv);
			holder.tv = (TextView)convertView.findViewById(R.id.item_tv);
			holder.cb = (CheckBox)convertView.findViewById(R.id.item_cb);
			// 为view设置标签
			convertView.setTag(holder);
		} else {
			// 取出holder
			holder = (ViewHolder) convertView.getTag();
		}


		// 设置list中TextView的显示
		holder.iv.setImageDrawable(mContext.getResources().getDrawable(R.drawable.smile));
		holder.tv.setText(mList.get(position));
		// 根据isSelected来设置checkbox的选中状况
		holder.cb.setChecked(getIsSelected().get(position));
		//holder.cb.setChecked(false);
		return convertView;
	}

	public static HashMap<Integer,Boolean> getIsSelected() {
		return isSelected;
	}

	public static void setIsSelected(HashMap<Integer,Boolean> isSelected) {
		MyListAdapter.isSelected = isSelected;
	}
	
	public final class ViewHolder{  
		public ImageView iv;  
		public TextView tv;   
		public CheckBox cb;  
	}
}

主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 ArrayList<String> list;
	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<String>();
		// 为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 ArrayList<String> mList;
	// 用来控制CheckBox的选中状况
	private static HashMap<Integer,Boolean> isSelected;
	// 上下文
	private Context mContext;
	// 用来导入布局
	private LayoutInflater inflater = null;

	private List<Map<String, Object>> mData;
	private boolean isMultiChoose;

	// 构造器
	public MyListAdapter(ArrayList<String> list, Context context) {
		this.mContext = context;
		this.mList = list;
		inflater = LayoutInflater.from(context);
		isMultiChoose=false;
		// 初始化数据
		initDate();
	}

	// 初始化isSelected的数据
	private void initDate(){
		//这儿定义isSelected这个map是记录每个listitem的状态，初始状态全部为false。       
		isSelected = new HashMap<Integer, Boolean>();    
        for (int i = 0; i < mList.size(); i++) {    
            isSelected.put(i, false); 
        }        
	}

	@Override
	public int getCount() {
		return mList.size();
		//return mData.size();  
	}

	@Override
	public Object getItem(int position) {
		return mList.get(position);
	}

	@Override
	public long getItemId(int position) {
		return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		ViewHolder holder = null;
		if (convertView == null) {
			// 获得ViewHolder对象
			holder = new ViewHolder();
			// 导入布局并赋值给convertview
			convertView = inflater.inflate(R.layout.list_item, null);
			holder.iv = (ImageView)convertView.findViewById(R.id.item_iv);
			holder.tv = (TextView)convertView.findViewById(R.id.item_tv);
			holder.cb = (CheckBox)convertView.findViewById(R.id.item_cb);
			if(isMultiChoose)
			{
				System.out.println("isMultiChoose");
				holder.cb.setVisibility(View.VISIBLE);
			}
			else
			{
				System.out.println("isNotMultiChoose");
				holder.cb.setVisibility(View.GONE);
			}
			// 为view设置标签
			convertView.setTag(holder);
		} else {
			// 取出holder
			holder = (ViewHolder) convertView.getTag();
		}


		// 设置list中TextView的显示
		holder.iv.setImageDrawable(mContext.getResources().getDrawable(R.drawable.smile));
		holder.tv.setText(mList.get(position));
		// 根据isSelected来设置checkbox的选中状况
		holder.cb.setChecked(getIsSelected().get(position));
		return convertView;
	}

	public static HashMap<Integer,Boolean> getIsSelected() {
		return isSelected;
	}

	public static void setIsSelected(HashMap<Integer,Boolean> isSelected) {
		MyListAdapter.isSelected = isSelected;
	}
	
	public void setIsMultiChoose(Boolean b){
		isMultiChoose=b;
	}
	public final class ViewHolder{  
		public ImageView iv;  
		public TextView tv;   
		public CheckBox cb;  
	}
}

修改后的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 ArrayList<String> list;
	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<String>();
		// 为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

拳四郎

关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
2
评论
带CheckBox的ListView

ListView嵌套CheckBox在应用中很常见，比如es文件管理器中多选文件。下面就自己来实现一下。看最终效果。首先来看两个布局文件：主布局文件：<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.
复制链接

扫一扫