Android开发:实现带图片和checkbox的listview

移动开发 Android
笔者的最近在做一个一个Android项目,在项目中要用到一个listview,要求是可以显示图片,后面还有有复选框。本文将详细介绍“如何实现带图片和checkbox的listview”。

项目要用到一个listview,要求是可以显示图片,后面还有有复选框。

先新建一个MyAdapter类,继承自BaseAdapter。在MyAdapter中实现对数据的绑定,我这儿由于是测试的,所以把数据写死了。

Java代码 

  1. package com.zwq.umeng;    
  2.     
  3. import java.util.ArrayList;    
  4. import java.util.HashMap;    
  5. import java.util.List;    
  6. import java.util.Map;    
  7.     
  8. import android.content.Context;    
  9. import android.view.LayoutInflater;    
  10. import android.view.View;    
  11. import android.view.ViewGroup;    
  12. import android.widget.BaseAdapter;    
  13. import android.widget.CheckBox;    
  14. import android.widget.ImageView;    
  15. import android.widget.TextView;    
  16.     
  17. public class MyAdapter extends BaseAdapter {    
  18.     private LayoutInflater mInflater;    
  19.     private List<Map<String, Object>> mData;    
  20.     public static Map<Integer, Boolean> isSelected;    
  21.     
  22.     public MyAdapter(Context context) {    
  23.         mInflater = LayoutInflater.from(context);    
  24.         init();    
  25.     }    
  26.     
  27.     //初始化    
  28.     private void init() {    
  29.         mData=new ArrayList<Map<String, Object>>();    
  30.         for (int i = 0; i < 5; i++) {    
  31.             Map<String, Object> map = new HashMap<String, Object>();    
  32.             map.put("img", R.drawable.icon);    
  33.             map.put("title""第" + (i + 1) + "行的标题");    
  34.             mData.add(map);    
  35.         }    
  36.         //这儿定义isSelected这个map是记录每个listitem的状态,初始状态全部为false。    
  37.         isSelected = new HashMap<Integer, Boolean>();    
  38.         for (int i = 0; i < mData.size(); i++) {    
  39.             isSelected.put(i, false);    
  40.         }    
  41.     }    
  42.     
  43.     @Override    
  44.     public int getCount() {    
  45.         return mData.size();    
  46.     }    
  47.     
  48.     @Override    
  49.     public Object getItem(int position) {    
  50.         return null;    
  51.     }    
  52.     
  53.     @Override    
  54.     public long getItemId(int position) {    
  55.         return 0;    
  56.     }    
  57.     
  58.     @Override    
  59.     public View getView(int position, View convertView, ViewGroup parent) {    
  60.         ViewHolder holder = null;    
  61.         //convertView为null的时候初始化convertView。    
  62.         if (convertView == null) {    
  63.             holder = new ViewHolder();    
  64.             convertView = mInflater.inflate(R.layout.vlist, null);    
  65.             holder.img = (ImageView) convertView.findViewById(R.id.img);    
  66.             holder.title = (TextView) convertView.findViewById(R.id.title);    
  67.             holder.cBox = (CheckBox) convertView.findViewById(R.id.cb);    
  68.             convertView.setTag(holder);    
  69.         } else {    
  70.             holder = (ViewHolder) convertView.getTag();    
  71.         }    
  72.         holder.img.setBackgroundResource((Integer) mData.get(position).get(    
  73.                 "img"));    
  74.         holder.title.setText(mData.get(position).get("title").toString());    
  75.         holder.cBox.setChecked(isSelected.get(position));    
  76.         return convertView;    
  77.     }    
  78.     
  79.     public final class ViewHolder {    
  80.         public ImageView img;    
  81.         public TextView title;    
  82.         public CheckBox cBox;    
  83.     }    
  84. }    

上面类中要注意getView()方法中对数据的处理。

接下要新建一个list.xml文件,这个就是布局image、textview、checkbox。

Java代码 

  1. <?xml version="1.0" encoding="utf-8"?>    
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
  3.     android:orientation="horizontal"    
  4.     android:layout_width="fill_parent"    
  5.     android:layout_height="fill_parent"    
  6.     >    
  7.     <ImageView    
  8.         android:id="@+id/img"    
  9.         android:layout_width="wrap_content"    
  10.         android:layout_height="wrap_content"    
  11.         android:layout_gravity="center_vertical"/>    
  12.     <TextView     
  13.         android:id="@+id/title"    
  14.         android:textSize="18dip"    
  15.         android:layout_weight="1"    
  16.         android:layout_width="wrap_content"    
  17.         android:layout_height="wrap_content"/>    
  18.     <CheckBox    
  19.         android:id="@+id/cb"    
  20.         android:layout_width="wrap_content"    
  21.         android:layout_height="wrap_content"    
  22.         android:focusable="false"    
  23.         android:focusableInTouchMode="false"    
  24.         android:clickable="false"           
  25.         android:checkMark="?android:attr/listChoiceIndicatorMultiple"/>    
  26. </LinearLayout>    
  27.  

android:layout_weight="1"这一句可以使中间的textview权重增大,从而后面的checkbok可以居右显示。

  1. android:focusable="false"   
  2.         android:focusableInTouchMode="false"   
  3.         android:clickable="false"   

这三句很重要,如果不加就会出现错误。

由于checkbox的点击事件优先级比listview的高,所以要在checkbox中添加android:focusable="false",使得checkbox初始的时候没有获取焦点。

接下来在main.xml中添加Listview组件

Java代码

  1. <ListView    
  2.         android:id="@+id/lv"    
  3.         android:layout_width="fill_parent"     
  4.         android:layout_height="wrap_content"/>    

接下来就是在activity中调用:

Java代码

  1. list=(ListView)findViewById(R.id.lv);    
  2.         MyAdapter adapter=new MyAdapter(this);    
  3.         list.setAdapter(adapter);    
  4.         list.setItemsCanFocus(false);    
  5.         list.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);    
  6.     
  7.         list.setOnItemClickListener(new OnItemClickListener(){    
  8.             @Override    
  9.             public void onItemClick(AdapterView<?> parent, View view,    
  10.                     int position, long id) {    
  11.                 ViewHolder vHollder = (ViewHolder) view.getTag();    
  12. //在每次获取点击的item时将对于的checkbox状态改变,同时修改map的值。    
  13.                 vHollder.cBox.toggle();    
  14.                 MyAdapter.isSelected.put(position, vHollder.cBox.isChecked());    
  15.             }    
  16.         });  

***看一下效果图:

效果图

要获取哪些项目被选择了,可以这样测试:

Java代码

  1. OnClickListener bPop = new OnClickListener() {    
  2.         @Override    
  3.         public void onClick(View v) {    
  4.             for(int i=0;i<list.getCount();i++){    
  5.                 if(MyAdapter.isSelected.get(i)){    
  6.                     ViewHolder vHollder = (ViewHolder) list.getChildAt(i).getTag();    
  7. Log.i(TAG, "--onClick --"+vHollder.title.getText());    
  8.                 }    
  9.             }    
  10.         }    
  11.     };   

总结

1、数据可以在Activity中获取,在初始化Adapter的时候当做参数传递过去,这样就可以是list编程动态的。

2、对MyAdapter中getview的理解不够,尤其是convertView.setTag(holder),如果您对getview有什么新的使用心得可以发Email:zhousn@51cto.com,51CTO将与您一起分享!

【编辑推荐】

  1. Android 抱怨它还是拥抱它?
  2. Android触屏textview及listview对比验证
  3. Android ListView复杂使用方式简单理解
责任编辑:佚名 来源: iteye
相关推荐

2011-04-11 13:43:35

popupwindowlistviewAndroid

2011-06-03 10:48:23

Android ListView

2017-11-08 14:34:20

图片fresco程序员

2015-10-22 10:59:13

ListViewItem刷新

2013-04-02 13:04:07

ListView平滑滚

2011-05-27 15:02:15

Android ListView

2011-05-20 13:31:54

Repeatercheckbox

2009-09-08 14:04:29

CheckBox分级选

2011-05-05 13:30:17

GridViewListView布局

2013-03-27 09:17:17

Android开发AndroidList

2011-09-02 10:03:40

jQuery滚动图片

2014-12-30 11:51:35

ListViewItem View

2010-09-06 09:43:46

TCPUDPAndroid

2023-04-04 08:14:17

CSSloading 动画

2014-09-17 11:20:38

AndroidListView技巧

2013-06-27 11:16:27

Android异步加载

2014-12-17 09:46:30

AndroidListView最佳实践

2009-09-08 13:52:54

CheckBox选中

2009-09-08 09:31:54

c# CheckBox

2011-07-08 15:08:16

iPhone 图片
点赞
收藏

51CTO技术栈公众号