Mengenal Linear Layout Android Pada Eclipse

Seperti apa sih tampilan Linear Layout? Hhmm... coba lihat Gambar 3.1 berikut. Jika Kamu seorang pemula, Kamu boleh sedikit tidak mempedulikan script. Semakin banyak Kamu berlatih coding, semakin paham juga maksud programnya.

Gambar 3.1

Yuk langsung kita mulai!:)

1. Jalankan Enclipse, File > New > Android Project.

Gambar 3.2

2. Isikan kotak dialog new seperti berikut

Project name	LinearLayoutSederhana
Build Target	Android 2.2
Application name	LinearLayout
Package name	Com.linear
Create Activity	LinearLayoutSederhana
Min SDK version	8

3. Pilih LinearLayoutSederhana /res /layout/main.xml, lihat Gambar 3.3

Gambar 3.3 

4. Ketikkan kode berikut ini. Meskipun panjang, script ini memiliki kemiripan. Sementara cukup tulis satu pola saja, lakukan copy-paste-edit.

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout  
xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="fill_parent"
 android:layout_height="fill_parent"> 
   <LinearLayout 
      android:orientation="horizontal" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:id="@+id/LinearLayout1" 
       android:layout_weight="1"> 
       <TextView 
           android:text="Merah" 
           android:gravity="center_horizontal"
     android:background="#aa0000" 
           android:layout_height="fill_parent" 
           android:layout_weight="1"     
           android:layout_width="wrap_content"/> 
       <TextView 
           android:text="Hijau" 
           android:gravity="center_horizontal" 
           android:background="#00aa00" 
           android:layout_width="wrap_content" 
           android:layout_height="fill_parent" 
           android:layout_weight="1"/> 
       <TextView 
           android:text="Biru" 
           android:gravity="center_horizontal"
           android:background="#0000aa" 
           android:layout_width="wrap_content" 
           android:layout_height="fill_parent" 
           android:layout_weight="1"/> 
       <TextView 
           android:text="Kuning" 
           android:gravity="center_horizontal" 
           android:background="#aaaa00" 
           android:layout_width="wrap_content" 
           android:layout_height="fill_parent" 
           android:layout_weight="1"/> </LinearLayout>
   <LinearLayout 
     android:orientation="vertical" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:id="@+id/LinearLayout2" 
     android:layout_weight="1"> 
     <TextView 
         android:text="Baris pertama" 
         android:textSize="15pt" 
         android:layout_width="fill_parent" 
         android:layout_height="wrap_content" 
         android:layout_weight="1"/> 
     <TextView 
         android:text="Baris kedua" 
         android:textSize="15pt" 
         android:layout_width="fill_parent" 
         android:layout_height="wrap_content" 
         android:layout_weight="1"/>
   <TextView 
         android:text="Baris ketiga" 
         android:textSize="15pt" 
         android:layout_width="fill_parent" 
         android:layout_height="wrap_content" 
         android:layout_weight="1"/> 
     <TextView 
         android:text="Baris ke empat" 
         android:textSize="15pt" 
         android:layout_width="fill_parent" 
         android:layout_height="wrap_content" 
         android:layout_weight="1"/> 
   </LinearLayout> 
 </LinearLayout> 

Layout main.xml jika dilihat hierarkinya dari outline tampak seperti Gambar 3.4

Gambar 3.4. Susunan layout main.xml

5. Pastikan pada activity LinearLayoutSederhana.java seperti dibawah ini.

package com.linear;  
import android.app.Activity; 
import android.os.Bundle; 
public class LinearLayoutSederhana extends Activity { 
     /** Called when the activity is first created. */ 
    @Override 
     public void onCreate(Bundle savedInstanceState) { 
         super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
     } 
 } 

6. Lakukan Run dengan shortcut CTRL+F11 atau klik kanan package > run as > android Project.
7. Lihat hasilnya seperti Gambar 3.1

Penjelasan Pogram

Sebuah aplikasi android dibuat dari kombinasi XML dan JAVA. Biasanya, xml digunakan untuk mengatur layout aplikasi sedangkan java berperan sebagai pusat pengendalinya. Pembahasan dibagian ini focus dulu ke xml.

Perhatikan main.xml baris 2, layout diawali oleh widget LinearLayout. Widget ini berperan sebagai parent yang orientation nya diset vertical (baris 4), artinya berapapun jumlah widget yang ada didalamnya akan tersusun secara vertical dari atas ke bawah. Sekarang perhatikan gambar 3.4, Parent LinearLayout memiliki 2 buah child yaitu LinearLayout1 dan LinearLayout2, nantinya masing-masing child juga mempunyai child sendiri. Karena parent LinearLayout orientationnya vertical, maka otomatis child LinearLayout1 dan LinearLayout2 tersusun secara vertical atas dan bawah.
Sekarang kita perhatikan LinearLayout1 memiliki 4 buah  child  textview berisi content “Merah”,”Hijau”,”Biru”,”Kuning”.

Orientasi LinerarLayout1 diset horizontal (baris 9), sehingga efeknya 4 textview susunannya berjajar dari kiri ke kanan. Masing-masing textview lebarnya diset wrap_content (baris 20) agar bisa menyesuaikan dengan panjang content didalamnya, sedangkan tingginya diset fill_parent sehingga efeknya tinggi masing-masing textview menghabiskan ruang LinearLayout1.

Atribut gravity pada textview (baris ) mengakibatkan tulisan merah,hijau,biru dan kuning posisinya ada ditengah secara horizontal. Hal serupa juga terjadi pada LinearLayout2, hanya saja settingnya sedikit berbeda.

Nah, sekarang dibagian activity LinearLayoutSederhana, kita belum menulis kode apa-apa alias masih default. Baris 11 pada activity ini berperan memanggil layout main.xml yang baru saja kita setup.

Sumber: omayib.com