Menggunakan kembali tata letak dengan <include>

Meskipun Android menawarkan berbagai widget untuk menyediakan elemen interaktif kecil yang dapat digunakan kembali, Anda mungkin juga perlu menggunakan kembali komponen yang lebih besar yang memerlukan tata letak khusus. Untuk menggunakan kembali secara efisien menyelesaikan tata letak, gunakan tag <include> dan <merge> untuk menyematkan satu tata letak di dalam tata letak lainnya.

Hal ini memungkinkan Anda membuat tata letak yang kompleks—seperti panel tombol ya atau tidak atau progres kustom bilah dengan teks deskripsi. Artinya, Anda dapat mengekstrak elemen apa pun dari aplikasi Anda yang umum digunakan di beberapa tata letak, kelola secara terpisah, dan sertakan di setiap tata letak. Meskipun Anda dapat membuat komponen UI individual dengan menulis View, Anda dapat melakukannya lebih mudah dengan menggunakan kembali file tata letak.

Membuat tata letak yang dapat digunakan kembali

Mulailah dengan membuat file XML baru dan menentukan tata letak yang ingin Anda gunakan kembali. Sebagai contoh, berikut adalah tata letak yang mendefinisikan bilah judul untuk disertakan dalam setiap aktivitas (titlebar.xml):

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/titlebar_bg"
    tools:showIn="@layout/activity_main" >

    <ImageView android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@drawable/gafricalogo" />
</FrameLayout>

View root harus persis seperti yang Anda inginkan di setiap tata letak tempat Anda berencana untuk menambahkan tata letak ini.

Catatan: Atribut tools:showIn dalam file XML sebelumnya adalah atribut khusus yang hanya digunakan pada waktu desain di Android Studio dan dihapus selama kompilasi. Ini menentukan tata letak yang menyertakan file ini, sehingga Anda dapat melihat pratinjau dan mengedit file ini seperti yang muncul saat disematkan di tata letak induk.

Menggunakan tag <include>

Di dalam tata letak tempat Anda ingin menambahkan komponen yang dapat digunakan kembali, tambahkan Tag <include>. Misalnya, inilah tata letak yang menyertakan bilah judul dari contoh sebelumnya:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/app_bg"
    android:gravity="center_horizontal">

    <include layout="@layout/titlebar"/>

    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="@string/hello"
              android:padding="10dp" />
    ...
</LinearLayout>

Anda juga dapat mengganti semua parameter tata letak, yaitu android:layout_* — dari tampilan root tata letak yang disertakan dengan menentukannya dalam tag <include>. Hal ini ditunjukkan dalam contoh berikut:

<include android:id="@+id/news_title"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         layout="@layout/title"/>

Namun, jika Anda ingin mengganti atribut tata letak menggunakan tag <include>, juga mengganti android:layout_height dan android:layout_width untuk membuat atribut tata letak lainnya akan diterapkan.

Menggunakan tag <merge>

Tag <merge> membantu menghilangkan kelompok tampilan yang berlebihan di hierarki tampilan saat menyertakan satu tata letak dalam tampilan lain. Satu kasus penggunaan <merge> adalah saat Anda menerapkan tampilan kustom dengan memperluas ViewGroup.

Misalnya, jika tata letak utama Anda adalah vertikal LinearLayout, dengan dua tampilan berurutan bisa digunakan kembali dalam beberapa tata letak, lalu tata letak yang bisa digunakan kembali tempat Anda dua tampilan memerlukan tampilan root-nya sendiri. Namun, menggunakan LinearLayout lain sebagai root untuk tata letak yang dapat digunakan kembali menghasilkan LinearLayout vertikal di dalam vertical LinearLayout. LinearLayout bertingkat tidak terlalu berguna dan melambat menurunkan performa UI.

Sebagai gantinya, Anda dapat memperluas LinearLayout untuk membuat tampilan kustom dan menggunakan XML tata letak untuk mendeskripsikan tampilan turunannya. Tag teratas dalam XML adalah <merge>, bukan LinearLayout, seperti yang ditunjukkan dalam contoh berikut:

<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/add"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/delete"/>

</merge>

Saat Anda menyertakan tata letak ini dalam tata letak lain, menggunakan <include> — sistem mengabaikan elemen <merge> dan menempatkan dua tombol langsung dalam tata letak, sebagai pengganti tag <include>.

Untuk informasi selengkapnya tentang <include>, lihat Resource tata letak.