Mengenal Android (4) : Membangun UI Dinamis dengan Fragments – Membuat Fragment

Oleh : Reza Ervani

بسم الله الرحمن الرحيم

Referensi :

• http://developer.android.com/training/basics/fragments/index.html
• http://developer.android.com/training/basics/fragments/creating.html

Untuk membuat suatu user interface dinamis dan multi-pane di Android, kita perlu untuk mengenkapsulasi komponen-komponen UI dan prilaku-prilaku aktivitas ke dalam modul-modul yang dapat kita swap ke dalam dan keluar aktifitas kita. Kita dapat membuat modul ini dengan class Fragment, yang mirip dengan nested activity yang dapat mendefinisikan layaoutnya sendiri dan mengatur lifecyclenya sendiri.

Saat sebuah fragment menspesifikasikan layoutnya sendiri, dia dapat dikonfigurasi dalam beragam kombinasi dengan fragmen-fragmen lain di dalam suatu aktivitas untuk memodifikasi konfigurasi layout kita di ukuran layar yang berbeda-beda (sebuah layar yang kecil dapat menampilkan satu fragment dalam satu waktu, tetapi sebuah layar besar dapat menampilkan dua atau lebih fragment dalam satu waktu).

Disini kita akan belajar bagaimana membuat suatu dynamic user experience dengan fragment dan mengoptimasi experience user pada aplikasi kita pada perangkat dengan ukuran layar yang berbeda-beda, sambil tetap mendukung perangkat yang menjalankan android versi lama seperti versi 1.6

Membuat Fragment

Kita dapat menganggap sebuah fragment sebagai bagian modular dari suatu activity, yang memiliki lifecycle-nya sendiri, menerima event input sendiri dan dapat kita tambahkan atau kita buang saat activity sedang berjalan (seperti sebuah “sub activity” yang dapat kita gunakan ulang pada aktivitas yang berbeda). Pelajaran ini menunjukkan bagaimana untuk melebarkan/extend class fragment menggunakan SupportLibrary sehingga aplikasi kita tetap kompatibel dengan perangkat yang menjalankan sistem yang lama seperti Android 1.6

Catatan : Jika kita memutuskan bahwa level API minimum untul aplikasi kita membutuhkan versi 11 atau yang lebih tinggi, kita tidak perlu menggunakan SupportLibrary dan dapat menggunakan saja framework built ini di class Fragment dan API yang terkait. Hanya untuk mengingatkan bahwa pelajaran ini berfokus pada penggunaan API dari Support Library, yang menggunakan suatu paket dengan signature spesifik dan seringkali memiliki nama API yang berbeda dibandingkan versi yang disertakan di platform.

Sebelum memulai pelajaran ini, kita mesti menset-up proyek Android kita untuk menggunakan Support Library. Jika kita belum pernah menggunakan Support Library sebelumnya, silahkan ikuti panduan di dokumentasi Setup Support Library. Walaupun, anda juga dapat menyertakan action bar di aktivitas kita dengan menggunakan pustaka v7appcompat, yang kompatibel dengan Android 2.1 (API Level 7) dan juga menyertakan API Fragment.

Membuat suatu Class Fragment

Untuk membuat suatu fragment, extend class Fragment, kemudian override metode key lifecycle untuk menyisipkan logika aplikasi kita, sama dengan cara yang kita lakukan pada class Activity.

Satu perbedaan saat membuat fragment adalah kita mesti menggunakan callback onCreateView() untuk mendefinisikan layout. Kenyataannya, ini satu-satunya callback yang kita butuhkan untuk membuat fragment kita bisa berjalan. Sebagai contoh, berikut sebuah fragment sederhana yang menspesifikasikan layoutnya sendiri

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.ViewGroup;

public class ArticleFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.article_view, container, false);
    }
}

Seperti halnya suatu activity, sebuah fragment seharusnya mengimplementasikan callback lifecycle yang lain yang memperkenankan kita untuk me-manage kondisinya seiring dengan penambahan atau penghilangannya dari activity dan seiring transisi activity antara keadaan-keadaan lifecycle. Sebagai contoh, saat metode activity onPause() dipanggil, setiap fragment pada activity juga menerima panggilan ke onPause()

Informasi lebih lengkap tentang metode lifecycle dan callback fragment tersedia di Panduan Developer Fragment.

Menambahkan suatu Fragment ke suatu Activity menggunakan XML

Saat fragment bersifat dapat digunakan kembali, komponen-komponen UI modular, setiap instance dari class Fragment mestilah dihubungkan dengan suatu parent FragmentActivity. Kita dapat melakukan pengasosiasian ini dengan mendefinsikan tiap fragment di dalam file XML layout activity kita.

Catatan : FragmentActivity adalah activity spesial yang disediakan di dalam Support Library untuk menangani fragment pada sistem yang lebih tua dari API level 11. Jika sistem terendah yang didukung oleh aplikasi anda adalah API Level 11 atau lebih tinggi, maka kita dapat menggunakan Activity regular.

Berikut contoh file layout yang menambahkan dua fragment ke dalam suatu activiety saat layar perangkat dianggap “besar” (dispesifikasikan oleh kualifier larget di dalam nama direktori)

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

    <fragment android:name="com.example.android.fragments.HeadlinesFragment"
              android:id="@+id/headlines_fragment"
              android:layout_weight="1"
              android:layout_width="0dp"
              android:layout_height="match_parent" />

    <fragment android:name="com.example.android.fragments.ArticleFragment"
              android:id="@+id/article_fragment"
              android:layout_weight="2"
              android:layout_width="0dp"
              android:layout_height="match_parent" />

</LinearLayout>

Tip: Lebih jauh tentang membuat layout yang berbeda untuk ukuran layar yang berbeda, dibahas dalam Bab Dukungan Terhadap Layar-layar Berbeda

Setelah melakukan hal diatas, kita terapkan layout tersebut pada activity kita sebagai berikut :

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;

public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_articles);
    }
}

Jika kita menggunakan pustaka v7 appcompat, activity kita sebaiknya adalah extend dari ActionBarActiviety, yang merupakan subclass dari FragmentActivity). Lebih jauh silahkan baca “Menambahkan Action Bar”)

Catatan : Saat kita menambahkan suatu fragment ke suatu layout activity dengan mendefinisikan fragment dalam file XML layout, kita tidak dapat memindahkan fragment saat runtime. Jika kita berencana melakukan swap masuk dan keluar pada fragment-fragment kita saat interaksi dengan pengguna, kita mesti menambahkan fragment ke activity saat activity pertama kali dimulai, sebagaimana akan ditunjukkan pada artikel berikutnya.