Memahami Jenis-jenis Fragment Khusus - ListFragment

Memahami Jenis-jenis Fragment Khusus

Dalam contoh latihan tentang fragment sebelumnya kita sudah mempelajari tentang fragment. Dengan menggunakan fragment kita bisa meng-kustom UI dari app Android kita dengan secara dinamis mengatur fragment supaya pas dengan ukuran layar kita.

Seperti yang sudah kita bahas dalam topik tentang fragment pada salah satu latihan sebelumnya, fragment adalah ‘mini-activity’ yang memiliki siklus hidupnya sendiri. Untuk membuat fragment, kita perlu suatu class yang melakukan ‘extends’ class ‘Fragment’. Selain class ‘Fragment’, kita juga bisa melakukan ‘extends’ dari beberapa subclass yang lain dari class ‘Fragment’ untuk membuat fragment yang lebih khas. Beberapa latihan berikut akan membahasa tentang tiga subclass dari Fragment, yaitu ‘ListFragment’, ‘DialogFragment’, dan ‘PreferenceFragment’.

Menggunakan ListFragment

ListFragment adalah suatu fragment yang berisi ‘ListVew’, yang menampilkan daftar item dari suatu sumber data misalnya dari suatu array atau cursor (database). ListFragment akan sangat bermanfaat, karena kita mungkin akan sering memiliki satu fragment yang berisi daftar item (misalnya daftar RSS posting), dan fragment yang lain menampilkan tentang posting yang dipilih. Untuk membuat suatu list fragment kita perlu melakukan ‘extends’ class ‘ListFragment’.

Berikut adalah contoh latihan bagaimana membuat list fragment.

1. Kita buat project baru dan kita beri nama “ContohListFragment”.

2. Kita modifikasi file layout ‘activity_main.xml’ seperti berikut:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context="id.co.blogspot.diansano.contohlistfragment.MainActivity">

<fragment
android:id="@+id/fragment1"
android:name="id.co.blogspot.diansano.contohlistfragment.Fragment1"
android:layout_width="0dp"
android:layout_height="200dp"
android:layout_weight="0.5" />
<fragment
android:id="@+id/fragment2"
android:name="id.co.blogspot.diansano.contohlistfragment.Fragment1"
android:layout_width="0dp"
android:layout_height="300dp"
android:layout_weight="0.5" />

</LinearLayout>
3. Kita buat baru file layout XML di dalam folder “res/layout” yang kita beri nama ‘fragment1.xml’ dan kita modifikasi dengan kode seperti berikut:
<?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">

<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@id/android:list"
android:layout_weight="1"
android:drawSelectorOnTop="false" />

</LinearLayout>
4. Kita buat baru file java di dala package project kita yang kita beri nama ‘Fragment1.java’ dan kita tambahkan kode seperti berikut:
package id.co.blogspot.diansano.contohlistfragment;

import android.app.ListFragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class Fragment1 extends ListFragment {
String[] pahlawan = {
"Diponegoro", "Soekarno",
"Cut Nyak Dien",
"Cut Meutia", "Sultan HB IX",
"Boedi Oetomo", "R.A. Kartini", "Patimura",
"Sultan Hasanudin", "I Gusti Ngurah Rai",
"Jendral Ahmad Yani", "Yos Sudarso",
"Juanda", "Adi Sutjipto", "Moh. Hatta",
"Pangeran Antasari"};

@Override
public View onCreateView(LayoutInflater inflater,
ViewGroup container, Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment1, container, false);
}

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setListAdapter(new ArrayAdapter(getActivity(),
android.R.layout.simple_list_item_1, pahlawan));
}

public void onListItemClick(ListView parent, View v, int position, long id)
{
Toast.makeText(getActivity(), "Anda klik " + pahlawan[position],
Toast.LENGTH_SHORT).show();
}
}
5. Jalankan di emulator Android Studio seperti berikut di bawah ini dan klik item-item yang di tampilkan dalam ListView. 

Penjelasan:

Pertama kita membuat file layout XML untuk fragment dengan menambahkan elemen ‘ListView’ ke file ini seperti berikut:
<?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">

<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@id/android:list"
android:layout_weight="1"
android:drawSelectorOnTop="false" />

</LinearLayout>
Untuk membuat list fragment, file java class untuk fragment tersebut harus melakukan ‘extends’ class ‘ListFragment’:
public class Fragment1 extends ListFragment {
}
Kita kemudian mendeklarasikan array untuk mengisi daftar nama-nama pahlawan di dalam activity kita seperti berikut:
String[] pahlawan = {
"Diponegoro", "Soekarno",
"Cut Nyak Dien",
"Cut Meutia", "Sultan HB IX",
"Boedi Oetomo", "R.A. Kartini", "Patimura",
"Sultan Hasanudin", "I Gusti Ngurah Rai",
"Jendral Ahmad Yani", "Yos Sudarso",
"Juanda", "Adi Sutjipto", "Moh. Hatta",
"Pangeran Antasari"};
Di dalam method ‘onCreate()’ kita menggunakan method ‘setListAdapter()’ untuk mengisi ‘ListView’ dengan isi array. Object ‘ArrayAdapter’ akan mengatur array strings yang akan ditampilkan oleh ‘ListView’. Di dalam contoh latihan ini, kita men-set ‘ListView’ untuk menampilkannya dalam format ‘simple_list_item_1’ seperti berikut:
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setListAdapter(new ArrayAdapter(getActivity(),
android.R.layout.simple_list_item_1, pahlawan));
}

Method ‘onListItemClick()’ dipicu saat suatu item yang ada dalam ‘ListView’ di-klik:
public void onListItemClick(ListView parent, View v, int position, long id)
{
Toast.makeText(getActivity(), "Anda klik " + pahlawan[position],
Toast.LENGTH_SHORT).show();
}
Terakhir, kita manambahkan dua fragment ke activity. Harap diperhatikan tinggi ukuran masing-masing fragment:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context="id.co.blogspot.diansano.contohlistfragment.MainActivity">

<fragment
android:id="@+id/fragment1"
android:name="id.co.blogspot.diansano.contohlistfragment.Fragment1"
android:layout_width="0dp"
android:layout_height="200dp"
android:layout_weight="0.5" />
<fragment
android:id="@+id/fragment2"
android:name="id.co.blogspot.diansano.contohlistfragment.Fragment1"
android:layout_width="0dp"
android:layout_height="300dp"
android:layout_weight="0.5" />

</LinearLayout>

No comments: