Layout Android : Linear Layout, Relative Layout dan Table Layout

Dalam posting ini saya akan membahas tentang pandangan yang berbeda layout dalam aplikasi mobile android. Keenam layout yang berbeda.

1. Linear Layout

2. Relative Layout

3. Table Layout

4. Grid View

5. Tab Layout

6. List View

Android memungkinkan Anda untuk membuat tampilan layout menggunakan file XML sederhana (kami juga dapat membuat tata letak menggunakan kode java). Semua layout harus ditempatkan dalam / res / layout folder.

Oke, sekarang mari kita mulai dengan pandangan layout.

1. Linear Layout

Dalam Linear Layout, seperti namanya, semua elemen akan ditampilkan secara linear (di bawah ini adalah contoh dari Linear Layout), baik horizontal maupun vertikal dan perilaku ini diatur dalam android: orientasi yang merupakan atribut dari node Linear Layout.

Contoh Vertical layout snippet :

 .... 

Contoh dari Horizontal layout snippet :

 .... 

Sekarang kita sudah tahu dua jenis linear layout, berikut adalah langkah-langkah yang perlu Anda ikuti untuk membuat nya

1. Buat proyek baru file -> New -> Project Android

2. Dalam Package Explorer klik kanan pada res / layout folder dan buat Android XML file baru dan beri nama sesuai keinginan. Saya penamaan itu sebagai "linear_layout.xml"

res / tata letak -> Klik Kanan -> New -> Android XML file

3. Sekarang buka baru dibuat file xml (dalam kasus saya "linear_layout.xml") dan ketik kode berikut.

4. Untuk mengatur pandangan ini baru dibuat sebagai tampilan awal dari aplikasi Anda, Buka file MainActivity.java Anda. Anda akan melihat baris berikut dalam OnCreate fungsi setContentView (R.layout.main). Mengubah R.layout.main ke R.layout.yourlinearviewname. Yang saya gunakan disini : R.layout.linear_layout

package com.example.androidlayouts;
import android.app.Activity;
import android.os.Bundle;
 
public class AndroidLayoutsActivity extends Activity {
 
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.linear_layout);
    }
}

5. Untuk menjalankan aplikasi, klik kanan pada proyek -> Run As -> 1. Aplikasi Android. Anda harus melihat tata letak linear yang baru dibuat Anda di emulator.

2. Relative Layout

Dalam Relative Layout setiap elemen mengatur sendiri relatif terhadap elemen lain atau elemen induk.

Sebagai contoh, mari kita mempertimbangkan tata letak didefinisikan di bawah. tombol "Batal" ditempatkan secara relatif, di sebelah kanannya  tombol "Login" secara paralel. Berikut adalah potongan kode nya 

Contoh kode potongan

Berikut adalah langkah-langkah untuk membuat tata Relative Layout

1. Buat proyek baru file -> New -> Project Android

2. Dalam Package Explorer klik kanan pada res / layout folder dan membuat Android XML file baru dan beri nama sesuai keinginan. Saya namakan file itu sebagai "relative_layout.xml"

res / Layout -> Klik Kanan -> New -> Android XML file

3. Sekarang buka file xml yang baru dibuat (dalam kasus saya "relative_layout.xml") dan ketik kode berikut.

4. Sama seperti sebelumnya, buka file MainActivity.java Anda dan atur layout yang telah dibuat tadi di MainActivitydengan menggunakan R.layout.relative_layout.

 setContentView(R.layout.relative_layout);

 5. Untuk menjalankan aplikasi, klik kanan pada proyek -> Run As -> 1. Aplikasi Android. Anda bisa melihat relative layout Anda di emulator.

3. Table Layout

Tabel layout di Android bekerja dengan cara yang sama layout tabel HTML bekerja. Anda dapat membagi tata letak Anda ke dalam baris dan kolom. Yang sangat mudah dipahami. Gambar di bawah harus memberikan ide.

1. Buat proyek baru file -> New -> Project Android

2. Dalam Package Explorer klik kanan pada res / layout folder dan membuat Android XML file baru dan beri nama sesuai keinginan. Saya penamaan itu sebagai "table_layout.xml"

res / layout -> Klik Kanan -> New -> Android XML file

3. Sekarang buka file xml tersebut (dalam kasus saya "table_layout.xml") dan ketik kode berikut.

Sama seperti sebelumnya, buka file MainActivity.java Anda dan atur layout yang telah dibuat tadi di MainActivitydengan menggunakan R.layout.table_layout.

setContentView(R.layout.table_layout);

 5. Untuk menjalankan aplikasi, klik kanan pada proyek -> Run As -> 1. Aplikasi Android. Anda bisa melihat relative layout Anda di emulator.

Saya baru saja membahas tentang Linear Layout, Relative Layout dan Table Layout di posting ini. Sisanya Grid View, Tab Layout dan List View akan dibahas dalam artikel berikutnya. Nantikan!

Download Code