Android自定义列表(ListView)

本文讲实现一个自定义列表的Android程序，程序将实现一个使用自定义的适配器（Adapter）绑定数据，通过contextView.setTag绑定数据有按钮的ListView。

系统显示列表（ListView）时，首先会实例化一个适配器，本文将实例化一个自定义的适配器。实现自定义适配器，必须手动映射数据，这时就需要重写getView()方法，系统在绘制列表的每一行的时候将调用此方法。

ListView在开始绘制的时候，系统自动调用getCount()函数，根据函数返回值得到ListView的长度，然后根据这个长度，调用getView()逐一画出每一行。

具体使用方法可以参考下面代码，只需记住Android自定义ListView三步骤：

第一步：准备主布局文件、组件布局文件等

第二步：获取并整理数据

第三部：绑定数据，这里我们是通过自己编写Adapter类来完成的

Demo程序：

1.首先新建一个list.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout  xmlns:android= "http://schemas.android.com/apk/res/android" 
     android:layout_width= "fill_parent"  android:layout_height= "fill_parent" 
     android:orientation= "vertical"  android:background= "#F1E4F1" > 
     <LinearLayout  android:layout_width= "wrap_content" 
         android:layout_height= "wrap_content"  android:orientation= "horizontal" > 
         <ImageView  android:id= "@+id/image"  android:layout_width= "40px" 
             android:layout_height= "40px"  android:layout_margin= "5px"  /> 
         <TextView  android:id= "@+id/title"  android:layout_width= "wrap_content" 
             android:layout_height= "wrap_content"  android:textSize= "26px" 
             android:layout_marginLeft= "20px"  android:layout_marginTop= "10px" 
             android:textColor= "#666872"  /> 
         <Button  android:id= "@+id/view_btn"  android:layout_width= "wrap_content" 
             android:layout_height= "wrap_content"  android:text= "详细" 
             android:layout_marginLeft= "90px"  /> 
     </LinearLayout> 
     <TextView  android:id= "@+id/info"  android:layout_width= "wrap_content" 
         android:layout_height= "wrap_content"  android:textColor= "#666872" 
         android:textSize= "13px"  /> 
</LinearLayout>

 

2.新建一个适配器类，MyAdapter.java

public class MyAdapter extends  BaseAdapter  { 
     private  ArrayList < HashMap < String ,  Object >>  data; 
     private  LayoutInflater  layoutInflater; 
     private  Context  context;

    public MyAdapter(Context context, ArrayList<HashMap<String, Object>> data) { 
        this.context = context; 
        this.data = data; 
        this.layoutInflater = LayoutInflater.from(context); 
    }

    public int getCount() { 
        return data.size(); 
    }

    /** 
     * 获取某一位置的数据 
     */ 
    public Object getItem(int position) { 
        return data.get(position); 
    }

    /** 
     * 获取唯一标识 
     */ 
    public long getItemId(int position) { 
        return position; 
    }

    /** 
     * android绘制每一列的时候，都会调用这个方法 
     */ 
    public View getView(int position, View convertView, ViewGroup parent) { 
        ZuJian zuJian = null; 
        if (convertView == null) { 
            zuJian = new ZuJian(); 
            // 获取组件布局 
            convertView = layoutInflater.inflate(R.layout.list, null); 
            zuJian.imageView = (ImageView) convertView.findViewById(R.id.image); 
            zuJian.titleView = (TextView) convertView.findViewById(R.id.title); 
            zuJian.infoView = (TextView) convertView.findViewById(R.id.info); 
            zuJian.button = (Button) convertView.findViewById(R.id.view_btn); 
            // 这里要注意，是使用的tag来存储数据的。 
            convertView.setTag(zuJian); 
        } else { 
            zuJian = (ZuJian) convertView.getTag(); 
        } 
        // 绑定数据、以及事件触发 
        zuJian.imageView.setBackgroundResource((Integer) data.get(position) 
                .get("image")); 
        zuJian.titleView.setText((String) data.get(position).get("title")); 
        zuJian.infoView.setText((String) data.get(position).get("info")); 
        zuJian.button.setOnClickListener(new OnClickListener() { 
            public void onClick(View v) { 
                //按钮触发事件，自己添加 
            } 
        }); 
        return convertView; 
    } 
}

关于上面LayoutInflater的使用：在实际开发种LayoutInflater这个类还是非常有用的。它的作用类似于 findViewById()，不同点是LayoutInflater是用来找layout下xml布局文件，并且会实例化！。

getView()的三个参数：position表示将显示的是第几行，covertView是从布局文件中inflate来的布局。我们用LayoutInflater的方法将定义好的list.xml文件提取成View实例用来显示。然后将xml文件中的各个组件实例化，这样便可以将数据对应到各个组件上了。但是按钮为了响应点击事件，需要为它添加点击监听器，这样就能捕获点击事件。

3.新建一个组件类，为显示在ListView上的组件

public final class ZuJian  { 
     public  ImageView  imageView; 
     public  TextView  titleView; 
     public  TextView  infoView; 
     public  Button  button; 
}

 

4.最后新建一个类GoodsListActivity.java,继承自ListActivity

public class GoodsListActivity extends  ListActivity  { 
    
     @Override 
    public void onCreate( Bundle  savedInstanceState)  { 
         // 数据格式必须严格 
         ArrayList < HashMap < String ,  Object >>  data  =  getData(); 
         MyAdapter  adapter  =  new  MyAdapter( this ,  data); 
         setListAdapter( adapter); 
     }

    private ArrayList<HashMap<String, Object>> getData() { 
        ArrayList<HashMap<String, Object>> arrayList = new ArrayList<HashMap<String,Object>>(); 
        //根据需求添加一些数据, 
        for (int i = 0; i <10; i++) { 
            HashMap<String, Object> tempHashMap = new HashMap<String, Object>(); 
            tempHashMap.put("info", content[6]); 
            tempHashMap.put("image", R.drawable.icon); 
            tempHashMap.put("title", "餐饮美食"); 
            arrayList.add(tempHashMap); 
        } 
        return arrayList; 
    } 
}

至此一个Android自定义列表的程序就完成了，上面这个自定义ListView的例子运行效果如下：

实际运行过程中会发现自定义ListView的每一行没有焦点了，这是因为Button占有了列表的焦点，只要在布局文件中将Button设置为无焦点就OK了。