Layouting TampilanPengenalan Layout Android

Akademi Komunitas Negeri LamonganOleh Yanuangga GHL

– LinearLayout – AbsoluteLayout – TableLayoutTableLayout – RelativeLayout – FrameLayout – ScrollView Layout

Jenis Layout

Kelas View merupakan dasar bagi komponen antarmuka pengguna.

View adalah kelas dasar untuk widget yang digunakan untuk membuat komponen UI interaktif (tombol teks bidang dll) (tombol, bidang teks, dll).

The ViewGroup subclass adalah kelas dasar untuk layouts, yang merupakan wadah untuk Tampilan lain (atau ViewGroups lainnya)

Class View

LinearLayout LinearLayout adalah ViewGroup yang akan

meletakkan elemen anak(child) secara vertikal maupun horizontal.

Contoh komponen dgn Layouting

Contoh komponen dgn Layouting #2TableLayoutSebuah TableLayout adalah ViewGroup yang akan meletakkan elemen view dari anak(child) dalam bentuk baris dan kolom.

RelativeLayoutRelativeLayout adalah sebuah ViewGroup yangRelativeLayout adalah sebuah ViewGroup yangmemungkinkan Anda untuk elemen anak layoutposisi relatif terhadap orang tua atausaudara elemen.

LinearLayout meluruskan semua anak di dalam satu

arah-vertikal maupun horizontal tergantung pada atribut pada android:orientation. Semua anak ditumpuk satu demi satu, sehingga - Vertikal list hanya akan memiliki satu anak per

baris tanpa memperdulikan seberapa lebar/luas anak tersebut

sedangkan - Horizontal list hanya akan tinggi satu baris

(ketinggian anak tertinggi, ditambah padding).

LinearLayouts

<LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical” > <TextView android:layout_width="105px" android:layout_height="wrap_content" android:text="@string/hello_world" /> <Button android:layout_width="100px" android:layout_height="wrap_content" android:text="Button" android:layout_gravity="right" android:layout_weight="0.2” /> <EditText android:layout_width="fill_parent" android:layout_height="wrap_content" android:textSize="18sp" android:layout_weight="0.8" /> </LinearLayout>

Contoh LinearLayout XML

Default orientasi LinearLayout diatur ke horisontal.

Jika Anda ingin mengubah orientasi ke vertikal, ubah atribut orientasi ke vertikal

Contoh LinearLayout XML

TableLayout adalah ViewGroup yang akan meletakkan view anak(child) dalam elemen baris dan kolom.

TableLayout

Ada dua kolom dan empat baris dalam TableLayout tersebut.

Contoh Program TableLayout XML

<TableLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_height="fill_parent"android:layout_width="fill_parent"android:background="#00eeff"><TableRow> <TextViewandroid:text="User Name:"android:width ="120px" /><EditTextandroid:id="@+id/txtUserName"android:width="200px" /></TableRow> 

<TableRow><TextView android:text="Password:" /><EditTextandroid:id="@+id/txtPassword"android:password="true" /></TableRow><TableRow><TextView /><CheckBox android:id="@+id/chkRememberPassword"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="Remember Password" />   </TableRow><TableRow><TextView /><Buttonandroid:id="@+id/buttonSignIn"android:text="Log In" /></TableRow></TableLayout>

AbsoluteLayout ini memungkinkan Anda menentukan lokasi yang tepat dari anak(child). Contoh UI berikut didefinisikan dalam activity_main.xml

AbsoluteLayout

<AbsoluteLayoutandroid:layout_width="fill_parent"android:layout_height="fill_parent"xmlns:android=http://schemas.android.com/apk/res/android ><Buttonandroid:layout_width="188px"android:layout_height="wrap_content"android:text="Button"android:layout x="126px"android:layout_y="361px” /><Buttonandroid:layout_width="113px"android:layout_height="wrap_content"android:text="Button"android:layout_x="12px"android:layout_y="361px” /></AbsoluteLayout>

dua tombol view diletakkan pada posisinya menggunakan android_layout_x dan android_layout_y attribut

RelativeLayout ini memungkinkan Anda menentukan bagaimana pandangan anak diposisikan relatif terhadap

masing othereach lainnya Sifat berikut mengelola posisi hormat widget lain widget: - android:layout_above menunjukkan bahwa widget harus ditempatkan

di atas widget direferensikan dalam properti - android:layout_below menunjukkan bahwa widget harus ditempatkan

di bawah widget direferensikan dalam properti - android:layout_toLeftOf menunjukkan bahwa widget harus

ditempatkan di sebelah kiri widget dirujuk dalam properti - android:layout_toRightOf menunjukkan bahwa widget harus

ditempatkan di sebelah kanan dari widget direferensikan dalam properti

RelativeLayout

android:layout_alignTop menunjukkan bahwa atas widget dari widget dirujuk dalam properti

• android: layout_alignBottom menunjukkan bahwa bagian bawah widget

harus sejajar dengan bagian bawah widget dirujuk dalam theshould disejajarkan dengan bagian bawah widget dirujuk dalam

harta

RelativeLayout