LAPORAN PRAKTIKUM 5 “LAYOUT MANAGER PADA APLIKASI ANDROID”

PEMROGRAMAN MOBILE

LAPORAN PRAKTIKUM 5

“LAYOUT MANAGER PADA APLIKASI ANDROID”

Disusun Oleh:

Benedikta Bella Adityana 12.12.0080

SI 12 B

Blog: bdcprograming.blogspot.com

http://bdcprograming.blogspot.com/

STMIK AMIKOM PURWOKERTO

TAHUN 2013/2014

BAB I

TABLE LAYOUT

1. Kode program activity_main.xml untuk membuat aplikasi Table Layout sederhana, yaitu:<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" >
      
       <TableRow >
          <Button
             android:id="@+id/bckbutton"
             android:text="KEMBALI"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
              />  
       </TableRow>
       <TableRow >
           <TextView
               android:text="First Name :"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_column="1"
               />
           <EditText
               android:width="100px"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               />
       </TableRow>
       <TableRow>
           <TextView
               android:text="Last Name :"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_column="1"
               />
           <EditText
               android:width="100px"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               />
       </TableRow>
       <TableRow >
           <Button
               android:id="@+id/btnpanjang"
               android:text="AKU BUTTON PANJANG ^^"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_span="4"
               />
          
       </TableRow>
   
   
   </TableLayout>
    
2. Tampilan dari layout aplikasi setelah kita menuliskan kode program diatas adalah seperti gambar di bawah ini: 
   
3. Setelah itu, jalankan aplikasi Table Layout ini menggunakan emulator. Di bawah ini adalah tampilan aplikasi ketika dijalankan.
   
    

BAB II

TABLE LAYOUT & RELATIVE LAYOUT

1. Pada aplikasi android kali ini, saya menggabungkan TableLayout dan RelativeLayout. Langkah pertama yaitu, buat project aplikasi baru dengan pilih menu File – New – Android Application Project, seperti yang ditunjukan gambar di bawah ini: 
   
2. Kemudian, beri nama project android nya. Contoh aplikasi kali ini saya beri nama LayoutManager’Benedicta. Setelah memberi nama project dan mengubah nama package, kemudian klik Next. 
   
3. Secara default akan muncul wizard di bawah ini. Klik Next. 
   
4. Pada tampilan di bawah ini, pilih icon yang akan mewakili Aplikasi Android yang dibuat. Setelah itu, klik Next. 
   
5.  Jika muncul tampilan seperti di bawah ini, klik Next. 
   
6.  Setelah itu, untuk memulai project yang baru, klik Finish pada tampilan di bawah ini: 
   
7. Tujuan aplikasi  android yang di buat kali ini yaitu untuk menampilkan layout aplikasi seperti yang ditunjukan gambar di bawah ini. Setiap kotak ‘view’ yang muncul pada layout tidak kita masukan dengan drag and drop melainkan menuliskan kode programnya pada activity_main.xml 
   
8.  Kode program yang kita tuliskan pada activity_main.xml yaitu:                            <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:tools="http://schemas.android.com/tools"
       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" >
   
   
   <TableRow>
          <RelativeLayout> 
   
   
             
           <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:width="135dp"
               android:height="150dp"
               android:layout_toRightOf="@id/view2" />
           <Button
               android:id="@+id/view3"
               android:text="view3"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_below="@id/view2"
               android:height="75dp"
               android:width="135dp"/>
          
                  </RelativeLayout>
       </TableRow>
      
      <TableRow >
           <RelativeLayout >
               <Button
                   android:id="@+id/view4"
                   android:text="view4"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:height="80dp"
                   android:width="270dp"/>
              
           </RelativeLayout>
      </TableRow>
     
      <TableRow >
           <RelativeLayout >
               <Button
                   android:id="@+id/view5"
                   android:text="view5"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:width="135dp"
                   android:height="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:layout_alignParentRight="true"
                   android:layout_below="@+id/view6"
                   android:height="75dp"
                   android:text="view7"
                   android:width="135dp" />
   
   
           </RelativeLayout>
       </TableRow>
   
   
   </TableLayout>
9. Setelah kita selesai menuliskan kode program di atas, jalankan aplikasi menggunakan emulator. Setelah emulator berhasil diluncurkan, pada menu utama pilih icon menu aplikasi LayoutManager’Benedicta seperti gambar di bawah ini. 
   
10. Maka, tampilan aplikasi LayoutManager ketika dijalankan adalah seperti gambar berikut ini. 
    

 

sekian. terimakasih :)