Laman

About Layout in Android

0   komentar

Pada kali ini saya akan menulis mengenai dasar dari developing Android. Mengapa saya menulis demikian? Hal ini disebabkan banyaknya request dari teman on facebook.
Ok ... Disini saya akan membahas mengenai Layout yang berada di Android .
Didalam Android sendiri terdapat  enam lay out yang berbeda diantaranya :
  • Linear Layout
  • Relatif Layout
  • Table Layout
  • Grid View (Postingan Berikutnya)
  • Tab layout (Postingan Berikutnya)
  • List View (Postingan Berikutnya)

Pada pembahasan kali ini, Saya akan menjelaskan hingga Table Layout dan untuk Grid View hingga List View akan saya posting berikutnya.
Berikut ini merupakan penjelasan dari setiap layout :
  1.        Linear Layout

Linear Layout merupakan sebuah layout diamana elemen akan ditampilkan secara Linear. Didalam Linear Layout terdapat pengaturan yang disebuat orientasi. Orientasi di dalam Linear layout sendiri terdapat dua orientasi Horizontal atau Vertical.
Contoh :
<LinearLayout android:orientation="vertical"> .... </LinearLayout>
<LinearLayout android:orientation="horizontal"> .... </LinearLayout>
Dan berikut ini Contoh  dari Linear Layout

  1. 2.       Relatif Layout

Dalam relatif layout, setiap elemen mengatur sendiri terhadap elemen lain atau elemen induk. Ok langsung kita lihat sebuah contoh kasus :
Sebuah tombol cancel terletak di sebelah kanan dari tombol  login. Berikut ini codingannya :
<Button android:id="@+id/btnLogin" ..></Button>

<Button android:layout_toRightOf="@id/btnLogin"
            android:layout_alignTop="@id/btnLogin" ..></Button>  
Dan berikut ini Contoh dari Relatif Layout


  1. 3.       Table Layout

Table layout di Android bekerja dengan cara yang sama seperti layout tabel HTML . Anda dapat membagi layout ke dalam baris dan kolom. Agar dapat mudah dipahami perhatkan code dan gambar berikut :
<TableLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:shrinkColumns="*"  android:stretchColumns="*" android:background="#ffffff">
    <!-- Row 1 with single column -->
    <TableRow 
        android:layout_height="wrap_content" 
        android:layout_width="fill_parent" 
        android:gravity="center_horizontal"> 
        <TextView 
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:textSize="18dp" android:text="Row 1"  android:layout_span="3"
            android:padding="18dip" android:background="#b0b0b0"
            android:textColor="#000"/> 
    </TableRow> 
     
    <!-- Row 2 with 3 columns -->
    <TableRow 
        android:id="@+id/tableRow1" 
        android:layout_height="wrap_content" 
        android:layout_width="match_parent"> 
        <TextView 
            android:id="@+id/TextView04" android:text="Row 2 column 1"
            android:layout_weight="1" android:background="#dcdcdc"
            android:textColor="#000000"
            android:padding="20dip" android:gravity="center"/> 
        <TextView 
            android:id="@+id/TextView04" android:text="Row 2 column 2"
            android:layout_weight="1" android:background="#d3d3d3"
            android:textColor="#000000"
            android:padding="20dip" android:gravity="center"/>
        <TextView 
            android:id="@+id/TextView04" android:text="Row 2 column 3"
            android:layout_weight="1" android:background="#cac9c9"
            android:textColor="#000000"
            android:padding="20dip" android:gravity="center"/>
    </TableRow>
</TableLayout>
Dan berikut ini Contoh dari Table Layout
Sampai ketemu di postingan berikutnya....