MODUL 6
PENGENALAN
(LinearLayout,RelativeLayout,AbsoluteLayout)
PADA ANDROID
Teori Singkat
Tata letak Android adalah kelas yang menangani pengaturan cara anaknya muncul di layar.
Apa pun yang merupakan View (atau mewarisi dari View) bisa menjadi turunan dari sebuah
layout. Semua tata letak mewarisi dari ViewGroup (yang diwarisi dari View) sehingga Anda
bisa menumpuk tata letak. Anda juga dapat membuat tata letak kustom Anda sendiri
dengan membuat kelas yang diturunkan dari ViewGroup. Gambar di bawah
mengilustrasikan hierarki pewarisan antar tampilan di Android
Pengenalan Layout
Blok penyusun dasar untuk antarmuka pengguna adalah objek View yang dibuat
dari kelas View dan menempati area persegi panjang di layar dan bertanggung jawab
untuk menggambar dan menangani event. View adalah kelas dasar untuk widget, yang
digunakan untuk membuat komponen UI interaktif seperti tombol, bidang teks, dll.
ViewGroup adalah subkelas View dan menyediakan wadah tak terlihat yang
menampung Tampilan lain atau ViewGroup lain dan menentukan properti tata letaknya.
Pada tingkat ketiga kami memiliki tata letak berbeda yang merupakan subkelas dari
kelas ViewGroup dan tata letak tipikal mendefinisikan struktur visual untuk antarmuka
pengguna Android dan dapat dibuat baik pada waktu proses menggunakan View
ViewGroup dapat juga disebut dengan layout karena ViewGroup mengelola tampilan child
dengan cara khusus dan umumnya digunakan sebagai root view. Berikut jenis-jenis layout
yang dapat kita gunakan dalam android :
A. LinearLayout : Viewgroup yang childnya diposisikan dan disejajarkan secara horizontal
atau secara vertikal
B. RelativeLayout: Viewgroup yang childnya diposisikan dan disejajarkan relatif terhadap
tampilan komponen dalam lainnya.
C. ConstrainLayout : Viewgroup yang childnya menggunakan titik jangkar, tepi, dan
panduan untuk mengontrol posisi tampilan relatif terhadap komponen lain di layout.
ConstrainLayout didesain untuk mempermudah saat menyeret dan melepaskan
tampilan di editor layout.
D. AbsoluteLayout : ViewGroup yang childnya disusun ke dalam baris dan kolom
E. FrameLayout : Viewgroup childnya bertumpuk.
F. GridLayout : Viewgroup childnya ditempatkan dalam kotak persegi panjang yang bisa
digulir.
Atribut umum Viewgroup
➢ layout_height : untuk mengatur tinggi dari View
➢ layout_width : untuk mengatur lebar dari View
➢ layout_margin : untuk mengatur extra space di semua sisi luar View.
➢ layout_marginTop : mengatur extra space sisi atas layout.
➢ layout_marginBottom :mengatur extra space sisi bawah layout.
➢ layout_marginLeft : mengatur extra space sisi kiri layout.
➢ layout_marginRight : mengatur extra space sisi kanan layout.
➢ layout_gravity : menentukan posisi child View.
➢ layout_weight : menentukan seberapa banyak extra space dialokasikan.
➢ layout_x : menentukan koordinat x layout.
➢ layout_y : menentukan koordinat y layout.
➢ paddingLeft : mengisi padding kiri layout.
➢ paddingRight : mengisi padding kanan layout.
➢ paddingTop : mengisi padding atas layout.
➢ paddingBottom : mengisi padding bawah layout.
Menggunakan LinearLayout
Android LinearLayout adalah grup tampilan yang meratakan semua Child view baik
secara vertikal maupun horizontal. LinearLayout mengelompokkan child view-nya dengan
menampilkan dalam satu baris atau kolom (vertikal atau horizontal). Viewgroup biasa
digunakan untuk membuat form.
· Pertama Jalankan Aplikasi IDE Android ,Caranya:
a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_LinearLayout
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_LinearLayout\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
· Jalankan di emulator maka akan tampil seperti gambar di bawah ini:
Menggunakan LinearLayout2
Kita akan mencoba Kembali membuat App menggunakan LinearLayout yang kedua caranya:
Pertama Jalankan Aplikasi IDE Android ,Caranya:
a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_LinearLayout2
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_LinearLayout2\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
Jalankan di emulator maka akan tampil seperti gambar di bawah ini:
A. Menggunakan RelativeLayout
Android RelativeLayout memungkinkan Anda menentukan bagaimana child views
diposisikan secara relatif satu sama lain. Posisi setiap tampilan dapat ditentukan sebagai
relatif terhadap elemen saudara atau relatif terhadap parent.
Relative Layout adalah layout yang penataannya ini adalah penataan yang
menempatkan widget-widget didalamnya seperti layer, sehingga sebuah widget dapat
berada di atas/di bawah widget lainnya atau dengan kata lain Relative merupakan layout
yang penataannya lebih bebas (Relative) sehingga bisa di tata di mana saja. Dalam sebuah
Relative Layout, kita memposisikan view di dalamnya relatif terhadap view lain atau si
parent view-nya. Atribut yang bisa dipakai untuk memposisikan suatu View di dalam
RelativeLayout adalah:
✓ Posisi berdasarkan View lain yang satu level: layout_above, layout_below,
layout_toLeftOf, layout_toRightOf
✓ Posisi berdasarkan parent: android:layout_centerHorizontal,
android:layout_centerVertical
✓ Posisi penjajaran berdasarkan View lain yang satu level: layout_alignTop,
layout_alignBottom, layout_alignLeft, layout_alignRight, layout_alignBaseline
✓ Posisi penjajaran berdasarkan parent: layout_alignParentTop,
layout_alignParentBottom, layout_alignParentLeft, layout_alignParentRight.
Jadi intinya kita dapat secara bebas mengatur objek objek yang kita tempatkan
apabila kita menggunakan Relative Layout.
Contoh Program dibawah ini akan memandu Anda melalui langkah-langkah sederhana
untuk menunjukkan cara membuat aplikasi Android Anda sendiri
Pertama Jalankan Aplikasi IDE Android ,Caranya:a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_RelativeLayout
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_RelativeLayout\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
Jalankan di emulator maka akan tampil seperti gambar di bawah ini:
Kita akan mencoba Kembali membuat App menggunakan RelativeLayout yang kedua Caranya:
Pertama Jalankan Aplikasi IDE Android ,Caranya:
a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_RelativeLayout2
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_RelativeLayout2\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
Jalankan di emulator maka akan tampil seperti gambar di bawah ini:
Menggunakan TableLayout
Table Layout adalah Layout yang digunakan untuk membangun user interface
(tampilan antar muka ) aplikasi android dengan berdasarkan Baris dan Kolom. Layout ini
digunakan untuk keperluan tertentu saja karena kebanyakan pembangunan tampilan antar
muka lebih sering memanfaatkan Relative Layout dan Linear Layout.
TableLayout pada Android adalah subkelas ViewGroup yang digunakan untuk
menampilkan elemen View child dalam baris dan kolom untuk mengatur semua elemen
child menjadi baris dan kolom dan tidak menampilkan garis batas di antara baris, kolom
atau cells. Cara kerja TableLayout hampir mirip dengan tabel HTML dan berisi kolom
sebanyak baris dengan cells terbanyak.
Table Layout terdiri dari:
1) Row/ baris pada dasarnya digunakan untuk menyimpan satu jenis record, hanya satu
informasi yang dapat disimpan.
2) Kolom adalah sub bagian terbagi dari setiap baris dan satu baris dapat menampung
beberapa jenis kolom. Setiap kolom terdiri dari jenis informasi yang berbeda mengenai
baris tersebut.
Beberapa tag pada Table Layout :
1) TableLayout : Tag pembuka untuk menggunakan TableLayout
2) TableRow : Tag untuk membuat Baris
TableLayout Attributes
Caranya adalah :
Pertama Jalankan Aplikasi IDE Android ,Caranya:
a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_TableLayout
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_TableLayout\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
Jalankan di emulator maka akan tampil seperti gambar di bawah ini:
Kita Akan mencoba kembali membaut App Menggunakan TableLayout kedua Bagaimana Caranya:
Pertama Jalankan Aplikasi IDE Android ,Caranya:
a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_TableLayout2
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_TableLayout2\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
Jalankan Pada emulator Maka akan tampil gambar seperti di bawah ini:
Menggunakan AbsolutleLayout
Absolute Layout menggunakan angka/koordinat untuk mengatur si widget
tersebut. Atribut yang digunakan adalah layout_x dan layout_y. Android AbsoluteLayout
digunakan ketika komponen UI di layar diposisikan pada posisi mereka mutlak sehubungan
dengan asal di sudut kiri atas layout. Kita perlu menentukan x dan y koordinat posisi masing-
masing komponen pada layar. AbsoluteLayout sudaj tidak direkomendasikan karena
membuat UI tidak fleksibel, sebenarnya AbsoluteLayout sudah jarang digunakan.
Berikut ini adalah atribut yang paling penting yang digunakan dalam layout ini:
➢ android: id : ini adalah ID yang unik mengidentifikasi tata letak
➢ android: foreground : ini mendefinisikan ditarik untuk menarik atas konten dan nilai
yang mungkin dapat menjadi nilai warna, dalam bentuk “#rgb”, “#argb”, “#rrggbb”,
atau “#aarrggbb”
➢ android: foregroundGravity : Mendefinisikan gravitasi untuk diterapkan pada ditarik
latar depan. Default gravitasi untuk mengisi. Nilai yang mungkin adalah atas, bawah,
kiri, kanan, tengah, center_vertical, center_horizontal dll
➢ android: measureAllChildren : Menentukan apakah untuk mengukur semua anak atau
hanya orang-orang di negara terlihat atau tidak terlihat saat mengukur. Default ke false
Beberapa poin penting untuk dicatat:
FrameLayout bisa menjadi lebih berguna bila unsur-unsur tersembunyi dan
ditampilkan pemrograman Jika gravitasi tidak diatur maka teks akan muncul di
kiri atas layer
Kelas ini tidak berlaku lagi di tingkat API 3. Gunakan FrameLayout,
RelativeLayout atau custom layout lain sebagai gantinya.
Contoh Program dibawah ini akan memandu Anda melalui langkah-langkah
sederhana untuk menunjukkan cara membuat aplikasi Android Anda sendiri menggunakan
RelativeLayout. Ikuti langkah-langkah berikut:
Pertama Jalankan Aplikasi IDE Android ,Caranya:
a) Pilih Start Android Studio
b) Pilih Start a new Android Studio Project
c) Pilih Empty Activity – Next
Configure Your Project
Name :modul6_AbsoluteLayout
Package name: ubah menjadi nama blog kalian masing-masing,disini saya menggunakan url blog saya ariwibawa.my.id
Save Location:D\:2021\Semester6\TI-1\14518511 Ananda Ariwibawa\PAB\modul6_AbsoluteLayout\
Language:Java
Minimum API Level:API 14 – Klik Finish
· Maka Akan Tampil aplikasi IDE android,kemudian ketikan script pada file activity_main.xml seperti text dibawah ini:
Maka jalankan di emulator maka akan tampil Hasilnya seperti ini:
Posting Komentar