[Android]使用 BaseAdapter客製化 ListView

上一篇：[Android] Action Bar Tabs 和 ListView 簡易示範

範例下載：GitHub

　　上一篇已經有提到如何簡單使用 ListView的功能，今天我們就來使用 BaseAdapter客製化 ListView (把每一個 ListView都用 Layout顯示)。


一、為了程式的可維護性及 Android的 MVC架構，使 Controller及 Model分開，我們將新增一個套件( package)，並且在裡面建立 ListView Adpater及 項目要用的物件。

　　對著 src按右鍵，並且選擇新建-->套件 我們在這邊取名為"com.example.utils"，接著在此套件中新建兩個類別( class)，分別取名為 NewItem及 ListViewAdpater，完成後如下圖：

　　

然後先撰寫 NewItem物件的內容：

package com.example.utils;

public class NewItem {
 
 private String Memo;
 private String Time;
 
 public NewItem(String memo,String time) {
  this.Memo=memo;
  this.Time = time;
 }
 
 public String getMemo(){
  return Memo;
 }
 
 public String getTime(){
  return Time;
 }
 
 
}

二、創立顯示 Item的 Layout

這邊命名為fragment0_listitem.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="vertical" >

    <!-- first row that Country and publish date -->

    <TextView
        android:id="@+id/Time"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="right|center_vertical"
        android:maxLines="1"
        android:text="2014-03-10"
        android:textColor="#0f55bd"
        android:textSize="15dp" />

    <TextView
        android:id="@+id/Memo"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:maxLines="2"
        android:text="item 1"
        android:textColor="#000000"
        android:textSize="20dp" />

</LinearLayout>

三、實作 ListViewAdpater(繼承  BaseAdapter)的內容。　
　
　　這邊簡單介紹一下 BaseAdapter(網路上有人翻作基礎連接器）。上一章有說到 Adpater是用來給像是 Spinner、ListView、GridView塞入資料用的，而這三個其實都有各自的 Adapter，但  BaseAdapter對這三個是可以通用的，這是為什麼呢？由 API可知， 這是因為 BaseAdapter實作了 ListAdapter和 SpinnerAdapter，而 GridView 的 Adpater本身也實作了 ListAdapter，因此 BaseAdapter對它們來說是三者通用的。

ListViewAdpater.java內容如下：

package com.example.utils;

import com.example.actionbartabstest.R;
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

public class ListViewAdpater extends BaseAdapter {
 Context context;
 List items;

 public ListViewAdpater(Context context, List items) {
  this.context = context;
  this.items = items;
 }

 //hold views for costomized listview
 private class ViewHolder {
  TextView txtMemo;
  TextView txtTime;
 }

 @Override
 //How many items are in the data set represented by this Adapter.
 public int getCount() {
  return items.size();
 }

 @Override
 //Get the data item associated with the specified position in the data set.
 public Object getItem(int position) {
  return items.get(position);
 }

 @Override
 //Get the row id associated with the specified position in the list.
 public long getItemId(int position) {
  return position;
 }

 @Override
 //Get a View that displays the data at the specified position in the data set.
 public View getView(int position, View convertView, ViewGroup parent) {
  ViewHolder holder;
  LayoutInflater mInflater = (LayoutInflater) context
    .getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
  if (convertView == null) {
   convertView = mInflater.inflate(R.layout.fragment0_listitem, null);
   holder = new ViewHolder();
   holder.txtMemo = (TextView) convertView.findViewById(R.id.Memo);
   holder.txtTime = (TextView) convertView.findViewById(R.id.Time);
   
   convertView.setTag(holder);
  } else {
   holder = (ViewHolder) convertView.getTag();
  }

  NewItem items = (NewItem) getItem(position);
  
  holder.txtMemo.setText(items.getMemo());
  holder.txtTime.setText(items.getTime());
  
  return convertView;
 }

}

其函數作用內容可以參考API：BaseAdapter、Adapter



四、將其加入 我們先前準備的 MainActivity中。

　　在前一篇我們已經產生了一個 Fragment來塞入 ListView，在這邊我們要來取代原本的內容。請將 Fragment0的 onCreateView改寫如下：

public View onCreateView(LayoutInflater inflater, ViewGroup container,
    Bundle savedInstanceState) {
        List rowitem= new ArrayList();   
        View rootView = inflater.inflate(R.layout.fragment0, container, false);
   
        rowitem.add(new NewItem("item 1","2014/06/26"));
        ListViewAdpater adpater= new ListViewAdpater(getActivity(),rowitem);
        listView.setAdapter(adpater);
   
        return rootView;
}
}

五、Demo

~今天就講解到這裡~