Meskipun Android menawarkan berbagai widget untuk menyediakan elemen interaktif kecil yang dapat digunakan kembali,
Anda mungkin juga perlu menggunakan kembali komponen lebih besar yang memerlukan tata letak khusus. Untuk menggunakan kembali
tata letak lengkap secara efisien, 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 status progres
kustom dengan teks deskripsi. Artinya, Anda dapat mengekstrak setiap elemen aplikasi yang
umum di beberapa tata letak, mengelolanya secara terpisah, dan menyertakannya dalam setiap tata letak. Meskipun
Anda bisa membuat masing-masing komponen UI dengan menulis View
kustom, Anda dapat lebih mudah melakukannya 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. Misalnya, berikut adalah tata letak yang mendefinisikan baris 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 dengan yang ingin ditampilkan di setiap
tata letak tempat Anda berencana menambahkan tata letak ini.
Menggunakan tag <include>
Di dalam tata letak tempat Anda ingin menambahkan komponen yang dapat digunakan kembali, tambahkan
tag <include>
. Misalnya, berikut adalah tata letak yang menyertakan baris 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—atribut android:layout_*
apa pun—dari tampilan root tata letak yang disertakan dengan menentukannya di
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>
,
ganti juga android:layout_height
dan android:layout_width
agar
atribut tata letak lain diterapkan.
Menggunakan tag <merge>
Tag <merge>
membantu menghilangkan kelompok tampilan yang berlebihan di hierarki tampilan
saat menyertakan satu tata letak dalam tampilan lain. Salah satu kasus penggunaan <merge>
adalah saat Anda
mengimplementasikan tampilan kustom dengan memperluas ViewGroup
.
Misalnya, jika tata letak utama Anda adalah LinearLayout
vertikal
dengan dua
tampilan berturut-turut dapat digunakan kembali dalam beberapa tata letak, tata letak yang dapat digunakan kembali tempat Anda menempatkan
dua tampilan akan memerlukan tampilan root-nya sendiri. Namun, menggunakan LinearLayout
lain sebagai root
untuk tata letak yang dapat digunakan kembali akan menghasilkan LinearLayout
vertikal di dalam LinearLayout
vertikal. LinearLayout
bertingkat tidak berfungsi sebenarnya dan memperlambat
performa UI Anda.
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 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>
Jika Anda menyertakan tata letak ini di tata letak lain—menggunakan tag
<include>
—sistem akan mengabaikan elemen <merge>
dan menempatkan dua tombol
langsung di tata letak, menggantikan tag <include>
.
Untuk mengetahui informasi selengkapnya tentang <include>
, lihat
Resource tata letak.