Android入門第七篇之ListView

講的是如何製作一個具有兩行文字的 自定義控制元件 ，作為ListView的Item的使用方法。這篇接下來也是圍繞ListView和Item，更加深入地介紹它們的用法。

       首先，先來看看本文程式碼執行的結果，本文的Item比上一篇中的Item多出左邊的圖示：

 

      main.xml的原始碼，跟上一篇的一樣，這裡就不作解釋了，直接貼出item.xml的程式碼，就是它實現ImageItem的UI：

<?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout   
         android:layout_width="fill_parent"   
         xmlns:android="http://schemas.android.com/apk/res/android"   
         android:layout_height="wrap_content"   
         android:paddingBottom="4dip"   
         android:paddingLeft="12dip">  
         <ImageView   
               android:layout_width="wrap_content"   
               android:id="@+id/itemImage" android:layout_height="fill_parent">   
         </ImageView>  
         <TextView   
               android:text="TextView01"   
               android:layout_height="wrap_content"   
               android:layout_width="fill_parent"   
               android:id="@+id/itemTitle" android:layout_toRightOf="@+id/itemImage" android:textSize="20dip">  
         </TextView>  
         <TextView   
               android:text="TextView02"   
               android:layout_height="wrap_content"   
               android:layout_width="fill_parent"   
               android:id="@+id/itemText" android:layout_toRightOf="@+id/itemImage" android:layout_below="@+id/itemTitle">  
         </TextView>  
</RelativeLayout> 

解釋一下 item.xml的程式碼：這裡使用了RelativeLayout佈局，控制元件的關鍵的屬性是：

itemTitle的屬性 android:layout_toRightOf="@+id/itemImage" ，itemTitle在itemImage的右邊；

itemText的屬性 android:layout_toRightOf="@+id/itemImage"，ItemText在itemImage的右邊， android:layout_below="@+id/itemTitle"， itemText 在 itemTitle的下面。

       最後，貼出JAVA的原始碼，其中重點是LayoutInflate的用法。LayoutInflate的使用方法如下： 

• LayoutInflater的作用是，把一個View的物件與XML佈局檔案關聯並例項化。
• View的物件例項化之後，可以通過findViewById()查詢佈局檔案中的指定Id的元件。

 

package com.testListView;


import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;


public class testListView extends Activity {
ListView listView;
String[] titles={"標題1","標題2","標題3","標題4"};
String[] texts={"文字內容A","文字內容B","文字內容C","文字內容D"};
int[] resIds={R.drawable.icon,R.drawable.icon,R.drawable.icon,R.drawable.icon};

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
this.setTitle("BaseAdapter for ListView");
listView=(ListView)this.findViewById(R.id.listView1);
listView.setAdapter(new ListViewAdapter(titles,texts,resIds));
}


public class ListViewAdapter extends BaseAdapter {
View[] itemViews;


public ListViewAdapter(String[] itemTitles, String[] itemTexts,
int[] itemImageRes) {
itemViews = new View[itemTitles.length];


for (int i = 0; i < itemViews.length; i++) {
itemViews[i] = makeItemView(itemTitles[i], itemTexts[i],
itemImageRes[i]);
}
}


public int getCount() {
return itemViews.length;
}


public View getItem(int position) {
return itemViews[position];
}


public long getItemId(int position) {
return position;
}


private View makeItemView(String strTitle, String strText, int resId) {
LayoutInflater inflater = (LayoutInflater) testListView.this
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);


// 使用View的物件itemView與R.layout.item關聯
View itemView = inflater.inflate(R.layout.item, null);


// 通過findViewById()方法例項R.layout.item內各元件
TextView title = (TextView) itemView.findViewById(R.id.itemTitle);
title.setText(strTitle);
TextView text = (TextView) itemView.findViewById(R.id.itemText);
text.setText(strText);
ImageView image = (ImageView) itemView.findViewById(R.id.itemImage);
image.setImageResource(resId);

return itemView;
}


public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null)
return itemViews[position];
return convertView;
}
}


}