自定义类似RadioButton的单选、多选的ListView

很多时候我们在做选择框的时候会想到RadioButton，但是RadioButton只是一个Button，很难添加丰富的内容，比如添加图片，文件及说明等。这个时候我们可以通过自定义ListView来实现类似的效果。当然，这也就是在ListView控件中实现点击选择或取消的效果。

我们先在layout中放上2个button和一个listview，分别用来单选、多选和自定义的listview。

<LinearLayout 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"    android:orientation="vertical"    tools:context=".MainActivity" >    <Button        android:id="@+id/btn_select_one"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_margin="10dip"        android:text="单选"        android:textSize="16sp" />    <Button        android:id="@+id/btn_select_multi"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_margin="10dip"        android:text="多选"        android:textSize="16sp" />    <ListView        android:id="@+id/listview_main"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_marginLeft="10dip"        android:layout_marginRight="10dip"        android:layout_marginTop="5dip"        android:cacheColorHint="@android:color/transparent" /></LinearLayout>

ListView的单个item的布局我们放2个imageview和2个textview：

<?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"    android:padding="5dip" >    <ImageView        android:id="@+id/iv_icon"        android:layout_width="0dip"        android:layout_height="wrap_content"        android:layout_weight="2" />    <LinearLayout        android:layout_width="0dip"        android:layout_height="wrap_content"        android:layout_marginLeft="5dip"        android:layout_weight="5"        android:orientation="vertical" >        <TextView            android:id="@+id/tv_title"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:textColor="@android:color/black"            android:textSize="16sp" />        <TextView            android:id="@+id/tv_content"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:textColor="@android:color/black"            android:textSize="12sp" />    </LinearLayout><ImageView        android:id="@+id/iv_select"        android:layout_width="0dip"        android:layout_height="wrap_content"        android:layout_weight="1" /></LinearLayout>

布局写好了，我们在Java这边监听这几个控件，并且将listview的内容通过方法getListData()来获取，而listview的单选多选我们通过一个全局的boolean变量来控制,代码都很简单，也就没什么注释：

public class MainActivity extends Activity{private ListView mListView;private ListViewAdapter mListViewAdapter;//自定义的Adapterprivate Button btn_Select_One;private Button btn_Select_Multi;public static boolean isSelectOne = true;//用来控制是否单选、多选@Overrideprotected void onCreate(Bundle savedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mListView = (ListView)findViewById(R.id.listview_main);mListViewAdapter = new ListViewAdapter(MainActivity.this, getListData());mListView.setAdapter(mListViewAdapter);mListView.setOnItemClickListener(itemClickListener);btn_Select_One = (Button)findViewById(R.id.btn_select_one);btn_Select_One.setOnClickListener(clickListener);btn_Select_Multi = (Button)findViewById(R.id.btn_select_multi);btn_Select_Multi.setOnClickListener(clickListener);}private OnClickListener clickListener = new OnClickListener(){@Overridepublic void onClick(View v){// TODO Auto-generated method stubswitch (v.getId()){case R.id.btn_select_one:isSelectOne = true;Toast.makeText(MainActivity.this, "单选", Toast.LENGTH_SHORT).show();break;case R.id.btn_select_multi:isSelectOne = false;Toast.makeText(MainActivity.this, "多选", Toast.LENGTH_SHORT).show();break;}}};private OnItemClickListener itemClickListener = new OnItemClickListener(){@Overridepublic void onItemClick(AdapterView<?> arg0, View v, int position, long arg3){// TODO Auto-generated method stubmListViewAdapter.setSelectItem(position);}};private List<Map<String, Object>> getListData(){List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();Map<String, Object> item = new HashMap<String, Object>();item.put("icon", R.drawable.pay_alipay);item.put("title", "支付宝");item.put("content", "推荐支付宝用户使用");item.put("select", R.drawable.pay_select);list.add(item);item = new HashMap<String, Object>();item.put("icon", R.drawable.pay_alipay);item.put("title", "支付宝");item.put("content", "推荐支付宝用户使用");item.put("select", R.drawable.pay_select);list.add(item);item = new HashMap<String, Object>();item.put("icon", R.drawable.pay_alipay);item.put("title", "支付宝");item.put("content", "推荐支付宝用户使用");item.put("select", R.drawable.pay_select);list.add(item);item = new HashMap<String, Object>();item.put("icon", R.drawable.pay_alipay);item.put("title", "支付宝");item.put("content", "推荐支付宝用户使用");item.put("select", R.drawable.pay_select);list.add(item);item = new HashMap<String, Object>();item.put("icon", R.drawable.pay_alipay);item.put("title", "支付宝");item.put("content", "推荐支付宝用户使用");item.put("select", R.drawable.pay_select);list.add(item);return list;}}

实现单选、多选的地方在自定义的Adapter中，单选的话，我们定义一个整型变量selectItem，在点击listview的item的时候，将item的位置赋值给selectItem，然后再adapter的getview方法中判断position与selectItem是否相等，相等为已选择的，对其做处理，如改背景色，这里将选择的图片设为可见；

若是多选，则定义了一个HashMap来存储已经被点击的item位置和是否选择键值对，点击item时，若map中无此item或此item值为false，将其置为true，表示被选择，反之，置为false，表示取消选择。

/** * 自定义可单选、多选的ListView Adapter * @author Tony */@SuppressLint("UseSparseArrays")public class ListViewAdapter extends BaseAdapter{private List<Map<String, Object>> mList;private HashMap<Integer, Boolean> mMap = new HashMap<Integer, Boolean>();protected LayoutInflater mInflater;private int selectItem = -1;public ListViewAdapter(Context context, List<Map<String, Object>> list){// TODO Auto-generated constructor stubthis.mList = list;mInflater = LayoutInflater.from(context);}@Overridepublic int getCount(){// TODO Auto-generated method stubreturn mList.size();}@Overridepublic Object getItem(int location){// TODO Auto-generated method stubreturn mList.get(location);}@Overridepublic long getItemId(int position){// TODO Auto-generated method stubreturn position;}@Overridepublic View getView(int position, View convertView, ViewGroup parent){// TODO Auto-generated method stubViewHolder mViewHolder;if (convertView == null){convertView = mInflater.inflate(R.layout.list_item, null);mViewHolder = new ViewHolder();mViewHolder.iv_Icon = (ImageView) convertView.findViewById(R.id.iv_icon);mViewHolder.tv_Title = (TextView) convertView.findViewById(R.id.tv_title);mViewHolder.tv_Content = (TextView) convertView.findViewById(R.id.tv_content);mViewHolder.iv_Select = (ImageView) convertView.findViewById(R.id.iv_select);convertView.setTag(mViewHolder);} else{mViewHolder = (ViewHolder) convertView.getTag();}mViewHolder.iv_Icon.setImageResource(Integer.parseInt(mList.get(position).get("icon").toString()));mViewHolder.tv_Title.setText(mList.get(position).get("title").toString());mViewHolder.tv_Content.setText(mList.get(position).get("content").toString());mViewHolder.iv_Select.setImageResource(Integer.parseInt(mList.get(position).get("select").toString()));if (MainActivity.isSelectOne){if (selectItem == position){mViewHolder.iv_Select.setVisibility(View.VISIBLE);} else{mViewHolder.iv_Select.setVisibility(View.INVISIBLE);}} else{if (mMap.containsKey(position) && mMap.get(position)){mViewHolder.iv_Select.setVisibility(View.VISIBLE);} else{mViewHolder.iv_Select.setVisibility(View.INVISIBLE);}}return convertView;}/** * 将被点击的item的位置传值过来，如果是单选，则直接赋值为selectItem； * 若为多选，则判断map中是否已有此item，且其值为true，则代表已经被点击， * 若再点击，则变为false，反之（若无此item或其值为false），变为true。 * @param item */public void setSelectItem(int item){if (MainActivity.isSelectOne){this.selectItem = item;} else{if (mMap.containsKey(item) && mMap.get(item)){mMap.put(item, false);} else{mMap.put(item, true);}}notifyDataSetChanged();}public class ViewHolder{public ImageView iv_Icon;public TextView tv_Title;public TextView tv_Content;public ImageView iv_Select;}}

完整工程下载：点击打开链接