PENGENALAN LAYOUTING (LinearLayout, RelativeLayout, TableLayout, AbsoluteLayout) PADA ANDROID STUDIO

 Assalamualaikum Wr.Wb  salam sejahtera semuanya salam sejah tera semuanya, kali ini ini saya akan membahas PENGENALAN LAYOUTING (LinearLayout, RelativeLayout, TableLayout, AbsoluteLayout)  PADA ANDROID STUDIO

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 :

Berikut jenis-jenis layout yang dapat kita gunakan dalam android :

  1. LinearLayout : Viewgroup yang childnya diposisikan dan disejajarkan secara horizontal atau secara vertikal
  2. RelativeLayout : Viewgroup yang childnya diposisikan dan disejajarkan relatif terhadap tampilan komponen dalam lainnya.
  3. 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.
  4. AbsoluteLayout : ViewGroup yang childnya disusun ke dalam baris dan kolom
  5. FrameLayout : Viewgroup childnya bertumpuk.
  6. GridLayout : Viewgroup childnya ditempatkan dalam kotak persegi panjang yang bisa digulir.

Atribut umum yang terdapat pada 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

1. Penggunaan LinearLayout

     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.

A. Pertama jalankan aplikasi IDE Android Studio, caranya : 

  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek

B. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 


C. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini

D. Kemudian kita akan mencoba Kembali untuk membuat App seperti email menggunakan LinearLayout yang kedua

 Pertama jalankan aplikasi IDE Android Studio, caranya : 

  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek

E. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 


F. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini


2. Penggunaan RelativeLayout

    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.

A. Pertama jalankan aplikasi IDE Android Studio, caranya : 
  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek

B. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 



C. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini

D. Kemudian kita akan mencoba Kembali untuk membuat  RelativeLayout yang kedua

 Pertama jalankan aplikasi IDE Android Studio, caranya : 

  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek

E. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 


C. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini

3. Penggunaan 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.

A. Pertama jalankan aplikasi IDE Android Studio, caranya : 
  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek

B. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 


C. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini

D. Kemudian kita akan mencoba Kembali untuk membuat TableLayout yang kedua

 Pertama jalankan aplikasi IDE Android Studio, caranya : 

  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek'

E. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini





F. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini

4. Penggunaan AbsoluteLayout

    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.
A. Pertama jalankan aplikasi IDE Android Studio, caranya : 
  • Pilih Start → Android Studio 
  • Pilih → Start a new Android Studio Project 
  • Pilih → Empty Activity → Next

Mengonfigurasi projek

B. Kemudian Fhinis dan edit source code nya langsung dengan mengaktifkan menu Split atau Code di pojok kanan atas , dengan script dibawah ini 


C. Jalankan di emulator Maka akan tampil seperti gambar di bawah ini

sampai disini dulu tutorial dari saya, semoga bermanfaat :)

Komentar

Postingan Populer