ListView製作

ListView是目前APP常用到的畫面之一，所以先來介紹這個。

1.先創一個新專案。

2.將ListView加入，並作調整

 (好像壓到上面的文字了，加個分隔線好了)

   
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.zyo.listviewsample.MainActivity" >

    <!-- 文字欄位 -->
    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello_world" />
    
    <!-- 分隔線  (1dp) 背景黑色 -->
    <LinearLayout
        android:id="@+id/layout1"
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_below="@+id/textView1"
        android:background="#000000"
        android:orientation="vertical" >
    </LinearLayout>
 
    <!-- ListView below(貼齊XXX之下) -->
    <ListView
        android:id="@+id/listView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/layout1" >
    </ListView>    

</RelativeLayout>

3. 好了，那麼來設定畫面內容了。
    Android的ListView有個特色，要呈現內容，必須裝入一個叫做Adapter的Class。
    而目前就我知道的Adapter繼承，有兩種，一種是ArrayAdapter，另一種是BaseAapter，
    建議是用BaseAdapter，因為在做ViewHother時，ArrayAdapter會有很多狀況...，或許是
    我還不大會用吧。

4.創建一個新的package跟class專門放adapter
 

  這邊記得選擇BaseAdapter

最後呈現如下

5.創建Adapter的Object，拿來裝每一條的資料

6.最後是每一條的畫面內容，創建一個Layout當作每一條的畫面。

Layout內容  (記得命名TextView的ID)

   
<?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">

    <TextView
        android:id="@+id/list_row_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Name:" />

    <TextView
        android:id="@+id/list_row_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:text="Title:" />

    <TextView
        android:id="@+id/list_row_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:text="Date:" />

</LinearLayout>

7.好了，畫面跟物件都準備好了，接下來下Java了。先點開MainActivity，輸入以下內容。

   
package com.zyo.listviewsample;

import java.util.ArrayList;
import com.zyo.adapters.listAdapter;
import com.zyo.adapters.listItem;
import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ListView;

public class MainActivity extends Activity {
 
 /**ListView*/
 private ListView mlistView;
 /**ListView的Adapter組件*/
 private listAdapter mlistAdapter;
 /**儲存ListView每一條的資料陣列*/
 private ArrayList<listItem> mlistAry;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        //設定ListView
        mlistView = (ListView) findViewById(R.id.listView1);
        
        //創一下資料
        mlistAry = new ArrayList<listItem>();
        for(int i = 0 ; i <30;i++){
         listItem item = new listItem();
         item.NAME = "User_"+i;
         item.TITLE = "Massage_"+i;
         item.DATE = "2014/11/"+(i+1);
         mlistAry.add(item);
        }
        
        //把資料帶入Adapter
        mlistAdapter = new listAdapter(this,mlistAry);
        //把Adapter丟到ListView內
        mlistView.setAdapter(mlistAdapter);
    }

}

8.這時應該會有幾個錯誤，是因為我們的Item跟Adapter內容還未對應到。

9.先新增Item屬性，有Title、name、date。

 
package com.zyo.adapters;
public class listItem {
 public String NAME,TITLE,DATE;
}

10.再修正listAdapter

 
package com.zyo.adapters;

import java.util.ArrayList;
import com.zyo.listviewsample.R;
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 listAdapter extends BaseAdapter {
 
 private ArrayList mlistAry;
 private Context mcontext;
 /**
  * 創建時，帶參數
  * @param context
  * @param list
  */
 public listAdapter(Context context,ArrayList list){
  mlistAry = list;
  mcontext = context;
 }

 @Override
 public int getCount() {  
  /*這邊要注意，設定你要呈現的筆數*/
  return mlistAry.size();
 }

 @Override
 public Object getItem(int position) {
  /*回傳ITEM*/
  return mlistAry.get(position);
 }

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

 @Override
 public View getView(int position, View convertView, ViewGroup parent) {
  /*設定畫面來源*/
  convertView = LayoutInflater.from(mcontext).inflate(R.layout.list_row, null);
  TextView nametxt =(TextView) convertView.findViewById(R.id.list_row_name);
  TextView titletxt =(TextView) convertView.findViewById(R.id.list_row_title);
  TextView datetxt =(TextView) convertView.findViewById(R.id.list_row_date);
  
  /*附值*/
  listItem item = mlistAry.get(position);
  nametxt.setText(item.NAME);
  titletxt.setText(item.TITLE);
  datetxt.setText(item.DATE);
  return convertView;
 }

}

11.現在應該就沒有錯誤了，那就來看看成果吧，發布到手機上。