如果能自訂自己喜歡的ListView樣式,如下圖一樣,那一定是很不錯的感覺:
要達到上圖的效果,基本上只要做三件事,便大功完成:
1、建立自己的adapter(MyCustomListViewAdapter.java)來連接(2)的xml;
2、建立自己喜歡的單欄樣版(rowlayout.xml):
3、在主程式上(Cq_MyListViewExampleActivity),將 main.xml 裡的 listview1 連接上自己製作的 adapter.
全部需要準備的檔如下:
(一)建立自已的adapter:
MyCustomListViewAdapter.java:
package com.cq.listview.example;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class MyCustomListViewAdapter extends ArrayAdapter<String>{
private final Context context;
private final CharSequence[] values1; //建立兩個參數陣列來接收主程式傳進來的兩個陣列
private final CharSequence [] values2;
//建構子
public MyCustomListViewAdapter(Context context, String [] strValues1, String [] strValues2) {
super(context, android.R.layout.simple_list_item_1, values1);
// TODO Auto-generated constructor stub
this.context = context;
this.values1 = strValues1;
this.values2 = strValues2;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
//取得.xml layout檔的資源,用來放入自設的欄位樣式( rowview)
LayoutInflater inflater =
(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View rowview = inflater.inflate(R.layout.exampleLayout, parent, false);
TextView textview =
(TextView)rowview.findViewById(R.id.textview01); //連接上自設的樣式元素
ImageView subtopicImageView =
(ImageView)rowview.findViewById(R.id.imageview01);
String s1 = values1[position].toString(); //依次傳入值
String s2 = strValues2[position].toString();
//交錯圖檔
//交錯圖檔
if ((position + 2)%2 == 0){
imageview01.setImageResource(R.drawable.basketball);
}else if ((position + 2)%2 == 1){
imageview01.setImageResource(R.drawable.americanfootball);
}
//將傳入的值顯示在textview上
textview.setText(s1 + " " + s2);
return rowview; //傳出單一整個欄位的設置
}
}
*********************************************(二)、建立自己喜歡的單欄樣版:
照自己喜歡的方式,準備自定的樣式layout給自定的 listview 用 (如下: rowlayout.xml)。
請準備兩個圖檔(.png),例如basketball.png, tennisball.png
rowlayout.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageView
android:id="@+id/imageview01"
android:layout_width="30px"
android:layout_height="30px"
android:layout_marginLeft="4px"
android:layout_marginRight="10px"
android:layout_marginTop="4px"
android:src="@drawable/americanfootball" >
</ImageView>
<TextView
android:id="@+id/textview01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@+id/label"
android:textColor="@color/orange"
android:textSize="20px" >
</TextView>
</LinearLayout>
*********************************************************************
(三)、在主程式上,將 main.xml 裡的 listview 連接上自己製作的 adapter.
MainActivity.java (Cq_MyListViewExampleActivity)有兩個自定的String 陣列
(String [] firstStringArray, String [] secondStringArray)的參數,
將用來傳入以下的自設ListView Adapter:
package com.cq.listview.example;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ListView;
public class Cq_MyListViewExampleActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
//建立兩個字串陣列
String [] firstStringArray = {"蘋果", "香吉士", "奇異果", "西洋梨", "西瓜", "哈密瓜",
"葡萄", "杏子", "琵琶", "甘蔗"};
String [] secondStringArray = {"apples", "oranges", "kiwi", "pears", "watermelon",
"cantaloupe", "grapes", "apricots", "loquats", "sugar cane" };
//設ListView參數用以連結.xml的listview
ListView listview = (ListView)findViewById(R.id.listView1);
//自設的接口
MyCustomListViewAdapter adapter = new MyCustomListViewAdapter(this,
firstStringArray, secondStringArray);
//將接口連接到ListView的參數
listview.setAdapter(adapter);
}
}
***********************************************************************
附上 main.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" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="ListView Example 3" />
<ListView
android:id="@+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>