自定义带图片的ListView的实现

第一步,我们先定义一个xml的布局文件,该布局文件的样式就是你希望能够在listview中显示的item的样式.也就是咱们界面中文字 图片的显示.

list.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/relativeLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true" />

    <TextView
        android:id="@+id/title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignTop="@id/image"
        android:layout_toRightOf="@id/image"
        android:textAppearance="?android:attr/textAppearanceLarge" />

 

<TextView
        android:id="@+id/info"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/title"
        android:layout_below="@+id/title" />

</RelativeLayout>

这里使用了一RelativeLayout,这样较方便的就能够将控件的位置定义好.

接下来我们看一下Activity的实现.这里,肥鱼使用了一个ListActivity.

ListViewActivity.java

public class ListViewActivity extends ListActivity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        SimpleAdapter adapter = new SimpleAdapter(this, getData(),
                R.layout.list, new String[] { "title", "info", "image" },
                new int[] { R.id.title, R.id.info, R.id.image });
        setListAdapter(adapter);
    }

    // 该方法取得数据
    private List<Map<String, Object>> getData() {
        List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();

        Map<String, Object> map;

        map = new HashMap<String, Object>();
        map.put("title", "测试标题一");
        map.put("info", "这是一个测试标题(一)");
        map.put("image", R.drawable.ic_launcher);
        list.add(map);

        map = new HashMap<String, Object>();
        map.put("title", "测试标题二");
        map.put("info", "这是一个测试标题(二)");
        map.put("image", R.drawable.ic_launcher);
        list.add(map);

        map = new HashMap<String, Object>();
        map.put("title", "测试标题三");

   map.put("info", "这是一个测试标题(三)");
        map.put("image", R.drawable.ic_launcher);
        list.add(map);

        return list;
    }
}

启动模拟器,看一下运行效果.