1 / 14

Layouting Tampilan

Layouting Tampilan. Pengenalan Layout Android Akademi Komunitas Negeri Lamongan Oleh Yanuangga GHL. Jenis Layout. – LinearLayout – AbsoluteLayout – TableLayoutTableLayout – RelativeLayout – FrameLayout – ScrollView Layout. Class View.

lupita
Download Presentation

Layouting Tampilan

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Layouting Tampilan Pengenalan Layout Android Akademi Komunitas Negeri Lamongan Oleh Yanuangga GHL

  2. Jenis Layout • – LinearLayout • – AbsoluteLayout • – TableLayoutTableLayout • – RelativeLayout • – FrameLayout • – ScrollView Layout

  3. Class View • 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)

  4. Contoh komponen dgn Layouting • LinearLayout • LinearLayout adalah ViewGroup yang akan meletakkan elemen anak(child) secara vertikal maupun horizontal.

  5. Contoh komponen dgn Layouting #2 RelativeLayout RelativeLayout adalah sebuah ViewGroup yang RelativeLayout adalah sebuah ViewGroup yang memungkinkan Anda untuk elemen anak layout posisi relatif terhadap orang tua atau saudara elemen. TableLayout Sebuah TableLayout adalah ViewGroup yang akan meletakkan elemen view dari anak(child) dalam bentuk baris dan kolom.

  6. LinearLayouts • 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).

  7. Contoh LinearLayout XML • <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>

  8. Contoh LinearLayout XML • Default orientasi LinearLayout diatur ke horisontal. • Jika Anda ingin mengubah orientasi ke vertikal, ubah atribut orientasi ke vertikal

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

  10. Ada dua kolom dan empat baris dalam TableLayout tersebut.

  11. Contoh Program TableLayout XML <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent" android:layout_width="fill_parent" android:background="#00eeff"> <TableRow> <TextView android:text="User Name:" android:width ="120px" /> <EditText android:id="@+id/txtUserName" android:width="200px" /> </TableRow>  <TableRow> <TextView android:text="Password:" /> <EditText android: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 /> <Button android:id="@+id/buttonSignIn" android:text="Log In" /> </TableRow> </TableLayout>

  12. AbsoluteLayout • AbsoluteLayout ini memungkinkan Anda menentukan lokasi yang tepat dari anak(child). Contoh UI berikut didefinisikan dalam activity_main.xml <AbsoluteLayout android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android=http://schemas.android.com/apk/res/android > <Button android:layout_width="188px" android:layout_height="wrap_content" android:text="Button" android:layout x="126px" android:layout_y="361px” /> <Button android: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

  13. RelativeLayout • 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_belowmenunjukkan bahwa widget harus ditempatkan di bawah widget direferensikan dalam properti • - android:layout_toLeftOfmenunjukkan bahwa widget harus ditempatkan di sebelah kiri widget dirujuk dalam properti • - android:layout_toRightOfmenunjukkan bahwa widget harus ditempatkan di sebelah kanan dari widget direferensikan dalam properti

  14. 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

More Related