Android Development 9: Android Lists

person Myat Min Soefolder_openAndroid Developmentaccess_time May 22, 2016

Android Lists

List မစခင် အရင်ဆုံး Activity အသစ်ဆောက်လိုက်ရအောင်။ New > Activity > Empty Activity ကိုရွေးပြီး ListActivity လို့နာမည်ပေးလိုက်ပါ။

List ဆိုတာကတော့ Android မှာအသုံးများပါတယ်။ List တစ်ခုမှာ row တွေအများကြီးပါဝင်ပါတယ်။ ဒါပေမဲ့ row တိုင်းကို list ထဲမှာမရှိပါဘူး။ user scrolling လုပ်တဲ့အချိန်မှ row တွေကို ဆောက်ပြီး အရင် row တွေကို ဖျက်ပစ်တဲ့ Recycle စနစ်နဲ့ လုပ်တာပါ။ ListView တစ်ခုမှာ သူ့အထဲမှာပါမဲ့ Object Array ရယ်, Object တွေကို Row တစ်ခုခြင်းစီကို ထည့်ပေးမဲ့ Adapter ဆိုတာ ပါဝင်ပါတယ်။ layout ထဲက activity_list.xml ကိုဖွင့်ပြီး အောက်ကအတိုင်းရေးလိုက်ပါ။

<ListView
    xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/myList"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

List မလုပ်ခင်မှာ List ထဲကို ထည့်ဖို့ Student Object တစ်ဆောက်ရအောင်။ ကျောင်းသားတွေရဲ့ နာမည်နဲ့ id ကို list မှာတန်းစီပြီးပြမှာဖြစ်ပြီး နှိပ်လိုက်တဲ့အခါ အတန်းနဲ့ မေဂျာပါပါဝင်တဲ့ အသေးစိတ်အချက်အလက် (Detail View) ကိုပြမှာပဲဖြစ်ပါတယ်။ new > Java Class ဆိုပြီး Student လို့နာမည်ပေးလိုက်ပါ။ Student Class ထဲမှာအောက်ကအတိုင်းရေးလိုက်ပါ။
public class Student {
 private String name, id, year, major;
 public void setName(String name) {
  this.name = name;
 }
 public void setId(String id) {
  this.id = id;
 }
 public void setYear(String year) {
  this.year = year;
 }
 public void setMajor(String major) {
  this.major = major;
 }
 public String getName() {
  return name;
 }
 public String getId() {
  return id;
 }
 public String getYear() {
  return year;
 }
 public String getMajor() {
  return major;
 }
}

ဒီနေရာမှာတော့ အသေးစိတ်ရှင်းမပြတော့ပါဘူး။ ဒါ Model Object တစ်ခုပဲဖြစ်ပါတယ်။ String variable ၄ ခုဖြစ်တဲ့ name, id, year, major ကို accessor method တွေအသုံးပြုပြီး getter, setter တွေထည့်ထားပါတယ်။ Android Studio မှာ getter setter ထည့်ဖို့အတွက် Windows ဆိုရင် alt + insert နဲ့ Mac ဆို control + enter နဲ့ထည့်နိုင်ပါတယ်။ ဒါဆို Student Class ဆောက်လို့ပြီးပါပြီ။

ListActivity Class ကိုဖွင့်ပါ။ အောက်ကအတိုင်းရေးလိုက်ပါ။

public class ListActivity extends AppCompatActivity {
 ArrayList < Student > students = new ArrayList < > ();
 @Override protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_list);
  setUpStudents();
  ListView lv = (ListView) findViewById(R.id.myList);
 }
 private void setUpStudents() {
  String[] names = {
   "Mg Mg",
   "Kyaw Kyaw",
   "Aung Aung",
   "Hla Hla",
   "Mya Mya",
   "Aye Aye",
   "Htoo Htoo",
   "Myat Min",
   "Aung Kyaw",
   "Mg Aung"
  };
  String[] years = {
   "First",
   "Second",
   "First",
   "Third",
   "Forth",
   "Final",
   "Final",
   "Third",
   "First",
   "Forth"
  };
  String[] major = {
   "ICT",
   "AME",
   "EC",
   "PRE",
   "PRE",
   "PRE",
   "ICT",
   "EC",
   "AME",
   "AME"
  };
  for (int i = 0; i < 10; i++) {
   Student student = new Student();
   student.setId(i + "");
   student.setName(names[i]);
   student.setYear(years[i]);
   student.setMajor(major[i]);
   students.add(student);
  }
 }
}

Student Object တွေပါတဲ့ ArrayList တစ်ခုဆောက်ပါတယ်။ setUpStudents() ထဲမှာ ArrayList ထဲကို Student Object ၁၀ ခုကို မတူအောင်ဆောက်ပြီး ထည့်လိုက်ပါတယ်။ setUpStudents() method ကို onCreate မှာခေါ်ပါတယ်။ ListView lv ဆိုတဲ့အထဲကို myList ကိုထည့်လိုက်ပါတယ်။

List Item တစ်ခုစီအတွက် Layout ဆောက်ရပါမယ်။ res > layout ထဲမှာ student_list_item ဆိုတဲ့ 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"
    android:padding="10dp">

    <TextView
        android:id="@+id/studentName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="(Name Placeholder)"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/studentId"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="(ID Placeholder)"
        android:textSize="18sp" />

</LinearLayout>

Adapter ဆောက်ဖို့လိုပါသေးတယ်။ Android မှာ default ပါတဲ့ Adapter တွေရှိပေမဲ့ သိပ်အသုံးမဝင်ပါဘူး။ ဒါကြောင့် တစ်ခါတည်း custom adapter ဘယ်လိုဆောက်လဲဆိုတာ ပြသမှာဖြစ်ပါတယ်။ Adapter ရဲ့အဓိကလုပ်ဆောင်ချက်ကတော့ list item တစ်ခုခြင်းစီကို screen ပေါ်မှာဆွဲပေးတဲ့အလုပ်ပဲဖြစ်ပါတယ်။ new > Java Class ဆိုပြီး StudentAdapter လို့နာမည်ပေးလိုက်ပါ။ အောက်ကအတိုင်းရေးလိုက်ပါ။
public class StudentAdapter extends ArrayAdapter < Student > {
 Context c;int resourceId;List < Student > students;public StudentAdapter(Context context, int resource, List < Student > objects) {
  super(context, resource, objects);
  c = context;
  resourceId = resource;
  students = objects;
 }
 static class ViewHolder {
  private TextView name, id;
 }
 public View getView(final int position, View convertView, ViewGroup parent) {
  ViewHolder holder = null;
  if (convertView == null) {
   holder = new ViewHolder();
   LayoutInflater inflater = (LayoutInflater) c.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
   convertView = inflater.inflate(resourceId, parent, false);
   holder.name = (TextView) convertView.findViewById(R.id.studentName);
   holder.id = (TextView) convertView.findViewById(R.id.studentId);
   convertView.setTag(holder);
  } else {
   holder = (ViewHolder) convertView.getTag();
  }
  Student student = students.get(position);
  holder.name.setText(student.getName());
  holder.id.setText(student.getId());
  return convertView;
 }
}

ပထမဆုံး StudentAdapter မှာ ArrayAdapter ကို extends လုပ်ပါတယ်။ Context ကိုသိမ်းဖို့အတွက် c, list_item layout resource ကိုသိမ်းဖို့အတွက် resourceId နဲ့ student list ကိုသိမ်းဖို့အတွက် students ဆိုပြီး Variable/Object သုံးခုဆောက်လိုက်ပါတယ်။ Constructor တစ်ခုဖြစ်တဲ့ StudentAdapter ထဲမှာ context, resource, objects တွေကို အရင်ဆောက်ခဲ့တဲ့ c, resourceId, students ထဲမှာသိမ်းလိုက်ပါတယ်။ ViewHolder class ထဲမှာတော့ student_list_item မှာအသုံးပြုခဲ့တဲ့ TextView name နဲ့ id ကိုဆောက်ခဲ့ပါတယ်။

getView ကတော့ row တစ်ခုစီအတွက် view တစ်ခုကို return ပြန်မှာဖြစ်ပြီး row တစ်ခုစီမှာပါတဲ့ name, id ကိုသူ့သက်ဆိုင်ရာ object ကို ArrayList ထဲကထုတ်ပြီး setText() method ကိုအသုံးပြုကာ ထည့်လိုက်ပါတယ်။

ListActivity ကိုပြန်ဖွင့်ပါ။ onCreate() method ထဲမှာ အောက်က နှစ်ကြောင်းကိုထည့်လိုက်ပါ။

StudentAdapter adapter = new StudentAdapter(this, R.layout.student_list_item, students);

lv.setAdapter(adapter);

StudentAdapter တစ်ခုဆောက်ပြီး context, list item တစ်ခုစီအတွက်ဆောက်ထားတဲ့ layout နဲ့ ArrayList ကိုထည့်လိုက်ပါတယ်။ setAdaper() method ကိုအသုံးပြုပြီး List မှာ အပေါ်ကဆောက်ထားတဲ့ StudentAdapter ကို ထည့်လိုက်ပါတယ်။ နောက်ဆုံး MainActivity ရဲ့ go() method ကိုအောက်ကအတိုင်းပြောင်းပြီး run ကြည့်လိုက်ပါ။

public void go(View v) {
 Intent i = new Intent(this, ListActivity.class);
 startActivity(i);
}

ဒီအတိုင်းပေါ်လာပါလိမ့်မယ်

9_01

ListView ကိုနှိပ်လိုက်ရင် ဘယ် item ကိုနှိပ်လိုက်လဲဆိုတာ သိဖို့လိုပါတယ်။ ဒါမှ item ပေါ်မူတည်ပြီးဆုံးဖြတ်လို့ရမှာပါ။ listview ဘယ် item နှိပ်လိုက်လဲဆိုတဲ့ listener ကို setOnItemClickListener သုံးပါတယ်။ သူ့ parameter ကတော့ AdapterView.OnItemClickListener ပဲဖြစ်ပါတယ်။ onCreate method အောက်ဆုံးမှာ အောက်ကအတိုင်းရေးလိုက်ပါ။

lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
 @Override public void onItemClick(AdapterView < ? > parent, View view, int position, long id) {
  Log.d("Click position", position + "");
 }
});

run ကြည့်ပါ list item တစ်ခုခြင်းစီကိုနှိပ်ကြည့်ပါ။ Android Studio Logcat ထဲမှာ နှိပ်လိုက်တဲ့ item ရဲ့ position ကို debug log ပြပါလိမ့်မယ်။ ပထမဆုံး element ရဲ့ position က 0 ကစပါတယ်။

ListView ကိုနှိပ်တဲ့အခါ နောက် Activity ပွင့်လာပြီး  Student Object ထဲက data တွေအကုန်လုံးကို information အဖြစ်ပြသမှာဖြစ်ပါတယ်။ ဒါကြောင့် Empty Activity အသစ်ဆောက်ပြီး Detail Activity လို့နာမည်ပေးလိုက်ပါ။ layout > activity_detail.xml ကိုဖွင့်ပြီး TextView သုံးခုကိုအောက်ကအတိုင်းဆောက်လိုက်ပါ။

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/year"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/major"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

ListActivity.java ကိုပြန်ဖွင့်ပြီး onItemClick ကိုအောက်ကအတိုင်းပြောင်းလိုက်ပါ။

lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
 @Override public void onItemClick(AdapterView < ? > parent, View view, int position, long id) {
  Intent intent = new Intent(getApplicationContext(), DetailActivity.class);
  intent.putExtra("nameKey", students.get(position).getName());
  intent.putExtra("yearKey", students.get(position).getYear());
  intent.putExtra("majorKey", students.get(position).getMajor());
  startActivity(intent);
 }
});

run ပြီး list item တစ်ခုစီကိုနှိပ်ကြည့်ပါ။ Activity တစ်ခုပွင့်လာရပါမယ်။ Activity အသစ်မှာ ဘာမှ ဖြစ်မှာမဟုတ်သေးပါဘူး။ TextView ၃ ခုလုံးကိုအလွတ်ထားခဲ့တဲ့အပြင် code မှာလဲ ဘာမှမလုပ်ရသေးလို့ပါ။ အပေါ်က code တွေကိုအရင်ရှင်းပြပါမယ်။ intent အသစ်တစ်ခုဆောက်ပါတယ်။ intent ထဲကို putExtra() method သုံးပြီး key value ထည့်ပါတယ်။ putExtra ထဲမှာ data type တွေအကုန်ထည့်လို့ရတဲ့အပြင် String, array, Serializable object တွေနဲ့ Parcelable object တွေပါထည့်လို့ရပါတယ်။ startActivity method ကိုအသုံးပြုပြီး DetailActivity ကိုဖွင့်လိုက်ပါတယ်။

onCreate() method ထဲမှာ TextView name, major, year ကိုပြန်ဆောက်ပြီး findViewById() နဲ့ activity_detail.xml ထဲက TextView တွေနဲ့ ချိတ်ပေးလိုက်ပါ။ အောက်ကအတိုင်းပေါ့။

TextView name = (TextView) findViewById(R.id.name);
TextView year = (TextView) findViewById(R.id.year);
TextView major = (TextView) findViewById(R.id.major);

Intent ကနေ putExtra() အသုံးပြုပြီးထည့်ခဲ့တဲ့ Data တွေကို ပြန်ယူပါမယ်။ onCreate() ထဲမှာပဲ အောက်ကအတိုင်းဆက်ရေးလိုက်ပါ။
String stName = getIntent().getStringExtra("nameKey");
String stYear = getIntent().getStringExtra("yearKey");
String stMajor = getIntent().getStringExtra("majorKey");
[java]
ရလာတဲ့ value တွေကို setText နဲ့ထည့်ပေးလိုက်လို့ရပါပြီ။ အောက်ကအတိုင်းပါ။
[java]
name.setText(stName);
year.setText(stYear);
major.setText(stMajor);

အပြည့်အစုံကတော့ အောက်ကအတိုင်းပါ။
@Override
protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_detail);
 TextView name = (TextView) findViewById(R.id.name);
 TextView year = (TextView) findViewById(R.id.year);
 TextView major = (TextView) findViewById(R.id.major);
 String stName = getIntent().getStringExtra("nameKey");
 String stYear = getIntent().getStringExtra("yearKey");
 String stMajor = getIntent().getStringExtra("majorKey");
 name.setText(stName);
 year.setText(stYear);
 major.setText(stMajor);
}

Run ကြည့်ပါ List တစ်ခုခြင်းစီကို နှိပ်ကြည့်ပါ။ နာမည်၊ အတန်း၊ မေဂျာ ပါတဲ့ TextView သုံးခုကိုတွေ့ပါမယ်။ getIntent().getStringExtra() ဆိုပြီး အရင်ပို့ခဲ့တဲ့ key ကို String parameter အဖြစ်ပြန်ထည့်ပြီး data ပြန်ယူတာပါ။ Activity တစ်ခုခုနဲ့တစ်ခု Data ပို့မယ်ဆိုရင် အပေါ်ကနည်းအတိုင်းပို့လို့ရပါတယ်။

Comment

  1. Kyaw Soe Aung

    Android ListView အကြောင်းသိချင်နေတာအခုမှပဲရှင်းသွားတော့တယ်

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>