Android UI設計–ListView內嵌CheckBox的多選和刪除

有時候項目中的ListView內需要內建一個CheckBox，供使用者選擇，多選，刪除等等

先看源碼

DataItem.java

package com.example.checkboxdemo;public class DataItem {private String title;private boolean flag;public String getTitle() {return title;}public void setTitle(String title) {this.title = title;}public boolean getFlag() {return flag;}public void setFlag(boolean flag) {this.flag = flag;}}

MyAdapter.java

package com.example.checkboxdemo;import java.util.ArrayList;import java.util.HashMap;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.TextView;import com.example.checkboxdemo.MainActivity.ViewHolder;public class MyAdapter extends BaseAdapter {public ArrayList<DataItem> mVideoList;private Context context;private LayoutInflater mInflater = null;public MyAdapter(Context context, ArrayList<DataItem> list){this.context = context;this.mVideoList = list;mInflater = LayoutInflater.from(context);}@Overridepublic int getCount() {return mVideoList.size();}@Overridepublic Object getItem(int position) {return mVideoList.get(position);}@Overridepublic long getItemId(int position) {return position;}@Overridepublic View getView(int position, View convertView, ViewGroup parent) {ViewHolder mHolder = null;if(null == convertView){mHolder = new ViewHolder();convertView = mInflater.inflate(R.layout.test_item, null);mHolder.mTitle = (TextView)convertView.findViewById(R.id.item_tv);mHolder.mCheck = (CheckBox)convertView.findViewById(R.id.item_cb);convertView.setTag(mHolder);}else{mHolder = (ViewHolder)convertView.getTag();}mHolder.mTitle.setText(mVideoList.get(position).getTitle());mHolder.mCheck.setChecked(mVideoList.get(position).getFlag());return convertView;}}

MainActivity.java

package com.example.checkboxdemo;import java.util.ArrayList;import java.util.HashMap;import android.app.Activity;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.AdapterView;import android.widget.AdapterView.OnItemClickListener;import android.widget.Button;import android.widget.CheckBox;import android.widget.ListView;import android.widget.TextView;import android.widget.Toast;public class MainActivity extends Activity {private ListView mVideoView;private MyAdapter mAdapter;private ArrayList<DataItem> mVideoList;private Button mCheckAllBtn;private Button mUnCheckAllBtn;private Button mCancelBtn;private Button mDeleteItemBtn;String str[] = {"item0","item1","item2","item3","item4","item5","item6","item7","item8","item9","item10","item11","item12"};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initViews();initListeners();}private void initViews(){mVideoView = (ListView)findViewById(R.id.lv);mCheckAllBtn = (Button)findViewById(R.id.checkAll);mUnCheckAllBtn = (Button)findViewById(R.id.uncheckAll);mCancelBtn = (Button)findViewById(R.id.cancelCheck);mDeleteItemBtn = (Button)findViewById(R.id.deleteItem);mVideoList = new ArrayList<DataItem>();initData();}private void initData(){for(int i = 0; i < str.length; i++){DataItem item = new DataItem();item.setTitle(str[i]);item.setFlag(false);mVideoList.add(item);}mAdapter = new MyAdapter(this, mVideoList);mVideoView.setAdapter(mAdapter);}private void initListeners(){mCheckAllBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {for(int i = 0; i < mVideoList.size(); i++){mVideoList.get(i).setFlag(true);}mAdapter.notifyDataSetChanged();}});mUnCheckAllBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {for(int i = 0; i < mVideoList.size(); i++){mVideoList.get(i).setFlag(false);}mAdapter.notifyDataSetChanged();}});mCancelBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {for(int i = 0; i < mVideoList.size(); i++){if(mVideoList.get(i).getFlag()){mVideoList.get(i).setFlag(false);}else{mVideoList.get(i).setFlag(true);}}mAdapter.notifyDataSetChanged();}});mDeleteItemBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {/** * 這裡不能直接操作mVideoList，需要緩衝到一個列表中一起清除，否則會出現錯誤 */ArrayList<DataItem> deleteList = new ArrayList<DataItem>();for(int i = 0; i < mVideoList.size(); i++){if(mVideoList.get(i).getFlag()){deleteList.add(mVideoList.get(i));}}mVideoList.removeAll(deleteList);deleteList.clear();mAdapter.notifyDataSetChanged();}});mVideoView.setOnItemClickListener(new OnItemClickListener() {@Overridepublic void onItemClick(AdapterView<?> parent, View view, int position,long id) {ViewHolder holder = (ViewHolder)view.getTag();//改變CheckBox狀態holder.mCheck.toggle();mAdapter.mVideoList.get(position).setFlag(holder.mCheck.isChecked());}});}static class ViewHolder{public TextView mTitle;public CheckBox mCheck;}}

這裡需要注意下面的item的CheckBox定義，如果不加上紅色的三行代碼，會導致onItemClickListener失效

test_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="wrap_content"    android:gravity="center_vertical"    android:orientation="horizontal" >        <TextView         android:id="@+id/item_tv"        android:layout_width="0dip"        android:layout_height="wrap_content"        android:layout_marginLeft="20dp"        android:layout_weight="1"        android:gravity="center_vertical"        />    <CheckBox         android:id="@+id/item_cb"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:clickable="false"        android:focusable="false"        android:focusableInTouchMode="false"        android:gravity="center_vertical"        /></LinearLayout>

說的不多，全在代碼裡，有圖有真相