2013年8月24日星期六

【Android】ListView与Button的共存问题解决




这两天在捣鼓ListView widget,为了在ListView中加入Button这类的有 “点击” 事件的widget,请教了不少高手,感谢LandMark对我的认真讲解,下面把解决过程描述一下。
 
ListView 和 其它能触发点击事件的widget无法一起正常工作的原因是加入其它widget后,ListView的itemclick事件将无法触发,被其它widget的click事件屏蔽。
 
  • 首先,说明一下,ListView中每一行包括以下三项:
 
   一个ImageView, 一个TextView,一个ImageButton,依次排开。
 
以下是layout的内容,分为两部分:
  • res/layout/main.xml
Xml代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent" android:layout_height="fill_parent"  
  4.     android:padding="10dip" android:orientation="vertical">  
  5.   
  6.     <ListView android:id="@id/android:list" android:layout_width="fill_parent"  
  7.         android:layout_height="fill_parent" />  
  8. </LinearLayout>  

因为继承了ListActivity,所以ListView 的id设置为"@id/android:list"是必须的
  • res/layout/lvitem.xml
注意:
< RelativeLayout>中
android:descendantFocusability= "blocksDescendants"
< ImageButton>中
android:focusable = "false"
这两项的设置很关键,如果不设置,将导致ListView的ItemClick事件将无法触发,该事件被ImageButton的click事件屏蔽了。

Xml代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout  
  3.   xmlns:android="http://schemas.android.com/apk/res/android"  
  4.   android:layout_width="fill_parent"  
  5.   android:layout_height="wrap_content"  
  6.   android:padding="5dip"  
  7.   android:descendantFocusability="blocksDescendants" >  
  8.     
  9.   <ImageView  
  10.       android:id="@+id/ItemImage"  
  11.     android:layout_width="wrap_content"  
  12.     android:layout_height="wrap_content"  
  13.     android:padding="5dip"  
  14.   />  
  15.     
  16.     
  17.   <!--  
  18.       把按钮背景设置为透明:     android:background="#00000000"  
  19.       把按钮背景设置为半透明:     android:background="#e0000000"  
  20.       -->  
  21.   <ImageButton  
  22.      android:id="@+id/ItemCloseWin"  
  23.        
  24.      android:layout_alignParentRight="true"  
  25.      android:layout_alignTop="@+id/ItemWinName"  
  26.       android:layout_alignBottom="@+id/ItemWinName"  
  27.       android:layout_width="wrap_content"  
  28.       android:layout_height="wrap_content"  
  29.         
  30.       android:background="#e0000000"  
  31.       android:gravity="left|center_vertical"  
  32.       android:focusable="false"  
  33.       android:src="@android:drawable/ic_menu_close_clear_cancel"  
  34.   />  
  35.     
  36.   <TextView  
  37.       android:id="@+id/ItemWinName"  
  38.         
  39.       android:layout_toRightOf="@+id/ItemImage"  
  40.       android:layout_toLeftOf="@+id/ItemCloseWin"  
  41.       android:layout_alignTop="@+id/ItemImage"  
  42.       android:layout_alignBottom="@+id/ItemImage"  
  43.       android:layout_width="wrap_content"  
  44.       android:layout_height="wrap_content"  
  45.         
  46.       android:gravity="left|center_vertical"  
  47.       android:textSize="20dip"  
  48.       android:text="title"  
  49.   />  
  50.       
  51.      
  52. </RelativeLayout>  


  • 接下来,我们看看继承ListActivity的实现
lvWithButtonExt中,为了能处理ImageButton的click事件,我继承了BaseAdapter类,并重新实现了getView()接口,在其中加入了Button的clicklistener,详见 lvButtonAdapter类的实现。

Java代码  收藏代码
  1. public class lvWithButtonExt extends ListActivity {  
  2.     @Override  
  3.     protected void onCreate(Bundle savedInstanceState) {  
  4.         super.onCreate(savedInstanceState);  
  5.         setContentView(R.layout.main);  
  6.   
  7.         // 关联Layout中的ListView  
  8.         ListView vncListView = (ListView)findViewById(android.R.id.list);  
  9.           
  10.         // 生成动态数组,加入数据   
  11.         ArrayList<HashMap<String, Object>> remoteWindowItem = new ArrayList<HashMap<String, Object>>();  
  12.         for(int i=0;i<10;i++)  
  13.         {  
  14.             HashMap<String, Object> map = new HashMap<String, Object>();  
  15.             map.put("ItemImage", R.drawable.firefox);//图像资源的ID   
  16.             map.put("ItemWinName""Window ID "+i);  
  17.             map.put("ItemCloseWin", android.R.drawable.ic_menu_close_clear_cancel);  
  18.             remoteWindowItem.add(map);  
  19.         }  
  20.           
  21.       // 生成适配器的Item和动态数组对应的元素   
  22.         lvButtonAdapter listItemAdapter = new lvButtonAdapter(  
  23.             this,  
  24.             remoteWindowItem,//数据源   
  25.             R.layout.lvitem,//ListItem的XML实现  
  26.   
  27.             //动态数组与ImageItem对应的子项   
  28.             new String[] {"ItemImage","ItemWinName""ItemCloseWin"},  
  29.             //ImageItem的XML文件里面的一个ImageView,两个TextView ID   
  30.             new int[] {R.id.ItemImage,R.id.ItemWinName,R.id.ItemCloseWin}  
  31.         );  
  32.           
  33.         vncListView.setAdapter(listItemAdapter);  
  34.     }  
  35.   
  36.     @Override  
  37.     protected void onListItemClick(ListView l, View v, int position, long id) {  
  38.         // TODO Auto-generated method stub  
  39.         super.onListItemClick(l, v, position, id);  
  40.         l.getItemAtPosition(position);  
  41.     }  
  42. }  


  • 接下来,我们看看lvButtonAdapter 的实现
为了响应按钮的点击事件,首先要记录按钮的位置,然后为按钮设置clicklistener。
在重新实现的getView()接口中,我使用了lvButtonListener监听类,在构造函数中,记录行号,以便在OnClick接口中能准确的定位按钮所在的位置,进而对相应的行进行处理。

Java代码  收藏代码
  1. public class lvButtonAdapter extends BaseAdapter {  
  2.     private class buttonViewHolder {  
  3.         ImageView appIcon;  
  4.         TextView appName;  
  5.         ImageButton buttonClose;  
  6.     }  
  7.       
  8.     private ArrayList<HashMap<String, Object>> mAppList;  
  9.     private LayoutInflater mInflater;  
  10.     private Context mContext;  
  11.     private String[] keyString;  
  12.     private int[] valueViewID;  
  13.     private buttonViewHolder holder;  
  14.       
  15.     public lvButtonAdapter(Context c, ArrayList<HashMap<String, Object>> appList, int resource,  
  16.             String[] from, int[] to) {  
  17.         mAppList = appList;  
  18.         mContext = c;  
  19.         mInflater = (LayoutInflater)mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
  20.         keyString = new String[from.length];  
  21.         valueViewID = new int[to.length];  
  22.         System.arraycopy(from, 0, keyString, 0, from.length);  
  23.         System.arraycopy(to, 0, valueViewID, 0, to.length);  
  24.     }  
  25.       
  26.     @Override  
  27.     public int getCount() {  
  28.         return mAppList.size();  
  29.     }  
  30.   
  31.     @Override  
  32.     public Object getItem(int position) {  
  33.         return mAppList.get(position);  
  34.     }  
  35.   
  36.     @Override  
  37.     public long getItemId(int position) {  
  38.         return position;  
  39.     }  
  40.   
  41.     public void removeItem(int position){  
  42.         mAppList.remove(position);  
  43.         this.notifyDataSetChanged();  
  44.     }  
  45.       
  46.     @Override  
  47.     public View getView(int position, View convertView, ViewGroup parent) {  
  48.         if (convertView != null) {  
  49.             holder = (buttonViewHolder) convertView.getTag();  
  50.         } else {  
  51.             convertView = mInflater.inflate(R.layout.lvitem, null);  
  52.             holder = new buttonViewHolder();  
  53.             holder.appIcon = (ImageView)convertView.findViewById(valueViewID[0]);  
  54.             holder.appName = (TextView)convertView.findViewById(valueViewID[1]);  
  55.             holder.buttonClose = (ImageButton)convertView.findViewById(valueViewID[2]);  
  56.             convertView.setTag(holder);  
  57.         }  
  58.           
  59.         HashMap<String, Object> appInfo = mAppList.get(position);  
  60.         if (appInfo != null) {  
  61.             String aname = (String) appInfo.get(keyString[1]);  
  62.             int mid = (Integer)appInfo.get(keyString[0]);  
  63.             int bid = (Integer)appInfo.get(keyString[2]);  
  64.             holder.appName.setText(aname);  
  65.             holder.appIcon.setImageDrawable(holder.appIcon.getResources().getDrawable(mid));  
  66.             holder.buttonClose.setImageDrawable(holder.buttonClose.getResources().getDrawable(bid));  
  67.             holder.buttonClose.setOnClickListener(new lvButtonListener(position));  
  68.         }          
  69.         return convertView;  
  70.     }  
  71.   
  72.     class lvButtonListener implements OnClickListener {  
  73.         private int position;  
  74.   
  75.         lvButtonListener(int pos) {  
  76.             position = pos;  
  77.         }  
  78.           
  79.         @Override  
  80.         public void onClick(View v) {  
  81.             int vid=v.getId();  
  82.             if (vid == holder.buttonClose.getId())  
  83.                 removeItem(position);  
  84.         }  
  85.     }  
  86. }  


以下是运行效果图:
点击右边的按钮该行将被删除