เขียนแอพพลิเคชัน Android ฉบับเริ่มต้น การใช้ ListView

ListView Widget เป็นสิ่งที่หลาย แอพพลิเคชันในแพลตฟอร์มของ Android นั้นนิยมใช้กันในการแสดงแถวของข้อมูลให้ผู้ใช้งานได้เลือกตัดสินใจ

ในตัวอย่างนี้จะเป็นการสาธิตวิธีการพัฒนาแอพพลิเคชันบนระบบปฏิบัติการ Android หรือ แพลตฟอร์มของ Android จาก Google กับการใช้งาน ListView ซึ่งก่อนที่เราจะศึกษาบทเรียนนี้แม้จะเป็นแค่เริ่มต้นก็ตาม แนะนำให้ศึกษาบทความก่อนหน้านี้ก่อนครับ ประกอบไปด้วย

เปิด eClipse และ ADT ขึ้นมาครับ ทำการสร้าง Project ใหม่ในตัวอย่างผมตั้งชื่อว่า ListViewDemo
เลือก Empty Activity สำหรับคนที่พัฒนา Minimum Spec ที่เวอร์ชัน 4.2 อย่างผมครับ

เลือก Version 4.2

รอจนกว่า Project จะพร้อมใช้งาน เมื่อพร้อมแล้วให้ไปแก้ไข Layout ของเราที่ไฟล์ activity_main.xml ครับ โดยเราจะใช้ XML ของ ListView ดังนี้

<ListView
        android:id="@+id/listViewMovie"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true" >
</ListView>

ผมใช้ id ของ ListView ด้วยชื่อ id ว่า “listViewMovie” ครับ คราวนี้การทำงานของ ListView คือการเอาข้อมูลที่อยู่ในูปแบบตัวแปร Array มาซ้อนทับแยกในแต่ละแถว เหมือน ตาราง ครับ สิ่งที่ต้องรู้คือการเก็บข้อมูลแบบ Array ครับ

เปิดไฟล์ MainActivity.java ขึ้นมาครับ ทำการ Import ส่วนของ Header ดังนี้

import android.widget.ListView;

ประกาศตัวแปร ListView ที่บรรทัดนี้

public class MainActivity extends Activity {
ListView listView ;

สร้างตัวแปร Array ขึ้นมาครับ ผมจะทำลิสของภาพยนตร์ซีรีย์ที่ผมดูอยู่ตอนนี้ มาเก็บไว้ในตัวแปร Movies

String[] Movies = new String[] { 
   "An American Horror Story Season 1", 
   "An American Horror Story Season 1",
   "An American Horror Story Season 1",
   "Game of Thrones Season 1", 
   "Game of Thrones Season 2", 
   "Game of Thrones Season 3", 
   "Game of Thrones Season 4", 
   "True Detective Season 1" 
};

หลังจากนั้นเราจะ ใช้ ArrayAdapter มาช่วยในเรื่องแสดงผลกับ ListViewทำการ Import ส่วน Header ต่อไปนี้ครับ

import android.widget.ArrayAdapter;

แล้วก็ใช้คำสั่งในการ Binding ListView กับ ArrayAdapter ก็เป็นอันเสร็จ

final ListView listViewMovie = (ListView)findViewById(R.id.listViewMovie); 

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1, Movies);

listViewMovie.setAdapter(adapter);

ตรวจสอบ Source Code หน้า MainActivity.java ดูก่อนครับว่าเหมือนกันหรือเปล่า

package com.daydev.listviewdemo;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ListView;
import android.widget.ArrayAdapter;

public class MainActivity extends Activity {
	ListView listView ;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        String[] Movies = new String[] { 
        		"An American Horror Story Season 1", 
                "An American Horror Story Season 1",
                "An American Horror Story Season 1",
                "Game of Thrones Season 1", 
                "Game of Thrones Season 2", 
                "Game of Thrones Season 3", 
                "Game of Thrones Season 4", 
                "True Detective Season 1" 
               };
        
        final ListView listViewMovie = (ListView)findViewById(R.id.listViewMovie); 
        
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_list_item_1, Movies);
        
        listViewMovie.setAdapter(adapter);
    }
}

ลอง Run แอพพลิเคชันของเราผ่าน Emulator ครับ