Last Updated on 8 years by Mas Herdi
Hi semuanya, setelah saya membahas tentang tutorial cara membuat RelativeLayout. Kali ini saya akan lanjut membahas tentang layout lainnya yang lebih gampang, yaitu LinearLayout. Perbedaan LinearLayout dengan RelativeLayout adalah kalau LinearLayout kalian tidak bisa menaruh posisi komponen di sembarang tempat, karena penempatan komponen pada LinearLayout sudah diatur dengan yang namanya orientation, yaitu semacam arah susunan dari LinearLayout tersebut.
Orientation ada dua macam, yaitu vertical dan horizontal. Orientation vertical berarti komponen2 pada LinearLayout akan disusun secara vertical (dari atas ke bawah), sedangkan orientation horizontal berarti komponen-komponen pada LinearLayout tersebut disusun secara horizontal, atau dari kiri ke kanan. Lebih lanjutnya, mari kita simak tutorial di bawah ini 🙂
Tutorial Membuat LinearLayout di Android menggunakan Android Studio
Pada tutorial ini kita akan membuat dua buah LinearLayout yang berisi tiga Button, di LinearLayout pertama kita akan set orientation ke vertical, sedangkan di LinearLayout kedua akan kita set orientationnya horizontal.
Pertama-tama, seperti biasa kalian buat project baru di Android Studio terlebih dahulu, Setelah itu buka file activity_main.xml, dan copy paste kan kode 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"> <TextView android:textAppearance="@style/Base.TextAppearance.AppCompat.Large" android:text="Linear Layout orientation Vertical" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="10dp" android:text="Button 1" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="10dp" android:text="Button 2" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="10dp" android:text="Button 3" /> </LinearLayout> <TextView android:textAppearance="@style/Base.TextAppearance.AppCompat.Large" android:text="Linear Layout orientation Horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:text="Button 1" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:text="Button 2" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:text="Button 3" /> </LinearLayout> </LinearLayout>
Pada kode XML di atas, kiranya sudah menjelaskan contoh orientation pada LinearLayout. Dan dalam Android kita bisa memasukkan LinearLayout di dalam LinearLayout, begitu juga RelativeLayout, atau pun RelativeLayout di dalam LinearLayout dan sebaliknya.
Jika sudah, kita bisa langsung demokan. Untuk tutorial file Activity nya tidak ada yang perlu diubah.
Demo
Jika aplikasi dijalankan, maka akan muncul tampilan seperti di atas. Bisa dilihat bagian atas adalah contoh LinearLayout dengan orientation vertical, dan bagian bawah adalah contoh LinearLayout dengan orientation horizontal.
That’s all ! Semoga membantu. 🙂 Jangan lupa untuk clone project nya sebagai Android Studio module di GitHub saya, dengan terlebih dahulu follow dan star project tersebut. Silahkan bertanya di bagian komentar jika ada yang kurang jelas.