MEMBUAT TAMPILAN SCREEN LAYOUT MANAGER (ANDROID)

Layout Manager
Untuk meletakan komponen (view) pada layar, android menggunakan layout manager.

"Sebuah tata letak Android adalah kelas yang menangani mengatur sebagaimana anak fiturnya muncul di layar. Apa pun yang merupakan View dapat menjadi anak layout "
Jenis layout manager:

Ø Table Layout,

Ø Absolute Layout,

Ø Relative Layout,

Ø Linear Layout,

Ø Frame Layout.

Langkah langkahnya adalah:
Pertama buka eclipse terlebih dahulu, lihat pada gambar berikut

Setelah membuka eclipse kemudian langkah selanjutnya adalah membuat project baru dengan cara klik Menu File -> New -> klik Android Application Project

Pada Menu Android Application Project akan muncul tampilan berikut lalu kita isi Nama aplikasi,nama projek dan nama package sesuai yang kita inginkan ,setelah terisi kemudian klik next, lebih jelasnya lihat gambar dibawah ini

Klik next lagi untuk melanjutkan menu berikutnya, Pada menu Configure Launcher Icon kemudian kita atur tampilan sesuai keinginan kita ,lalu klik next, lihat gambar di bawah ini

Setelah itu pilih saja Blank Activity lalu klik Next

Kemudian kita beri nama pada kolom Activity Name dan Layout Name setelah itu klik Finish

Setelah Membuat Project baru kita isikan coding xmlnya, berikut codingnya

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/TableLayout1"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin"

tools:context=".MainActivity">

<Button

android:id="@+id/view2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view2"

android:height="75dp"

android:width="135dp"/>

<Button

android:id="@+id/view1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view1"

android:height="150dp"

android:width="150dp"

android:layout_toRightOf="@id/view2"/>

<Button

android:id="@+id/view3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view3"

android:height="75dp"

android:width="135dp"

android:layout_below="@id/view2"/>

</RelativeLayout>

</TableRow>

<Button

android:id="@+id/view4"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view4"

android:height="80dp"

android:width="285dp"/>

</RelativeLayout>

</TableRow>

<Button

android:id="@+id/view5"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view5"

android:height="150dp"

android:width="150dp"/>

<Button

android:id="@+id/view6"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view6"

android:height="75dp"

android:width="135dp"

android:layout_toRightOf="@id/view5"/>

<Button

android:id="@+id/view7"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="view7"

android:height="75dp"

android:width="135dp"

android:layout_alignParentRight="true"

android:layout_below="@id/view6"/>

</RelativeLayout>

</TableRow>

</TableLayout>

Isikan coding Tersebut pada activity_main sebelah Graphical Layout atau dengan cara buka res lalu klik folder layout klik ganda activity_mainnya, lihat gambar berikut

Setelah Mengisi Codingnya kemudian secara otomatis pada Graphical Layoutnya akan muncul sendiri, seperti gambar di bawah ini

Lalu kita jalankan aplikasinya klik Run Configurations, lihat gambar di bawah ini

Lalu kita atur Projectnya dengan klik browse kemudian pilih nama project yang tadi kita buat, pada menu Launch Action pilih Launch kemudian masukan nama package yang tadi kita buat, lalu klik Run

Setelah menjalankan aplikasinya kemudian kita tunggu sampai muncul aplikasi android seperti gambar dibawah ini, kemudian klik aplikasi yang tadi kita buat, Lihat gambar

Dan inilah output yang tadi kita buat

Ketika di klik salah satu button maka akan berwarna

Demikian penjelasan dari saya, semoga bermanfaat !!