T Modul 13 Android GUI.pdf

51

Transcript of T Modul 13 Android GUI.pdf

Page 1: T Modul 13 Android GUI.pdf
Page 2: T Modul 13 Android GUI.pdf

• Dapat memahami dasar teori pemrogramanDapat memahami dasar teori pemrogramanandroid

• Dapat memahami mekanisme kerjacomponent dalam sistem operasi android

• Dapat menggunakan component secaraefektif dalam membuat aplikasi androidp

Page 3: T Modul 13 Android GUI.pdf

• ActivityyMenyajikan antar muka visual yang digunakansebagai interaksi pengguna.

k b k d• Intent merupakan objek yang memegang isi daripesan.

• Activity menyajikan antar muka ActivityActivity menyajikan antar muka. Activityberinteraksi dengan pengguna dalam jangkawaktu yang lama, dan tetap aktif, bahkan padasaat idlesaat idle.

Page 4: T Modul 13 Android GUI.pdf

Sebelum android dapat memulai componentSebelum android dapat memulai componentaplikasi, maka android harus melihatcomponent yang sedang berjalan.

Untuk itu, aplikasi akan mendeklarasikancomponent yang mereka gunakan dalamcomponent yang mereka gunakan dalamsebuah file manifest yang digabungkan kedalam paket file android berekstensi (.apk).

File manifest ini berstruktur XML dan selaludiberi nama AndroidManifest xml untuk semuadiberi nama AndroidManifest.xml untuk semuaaplikasi.

Page 5: T Modul 13 Android GUI.pdf

<?xml version="1.0" encoding="utf-8"?>if<manifest . . . ><application . . . >

<activity android:name="com.example.project.FreneticActivity"

android:icon="@drawable/small_pic.png"

android:label="@string/freneticLabel" . . . >

</activity>. . .

</application></application></manifest>

Page 6: T Modul 13 Android GUI.pdf

Obyek intent dapat menampilkan nama targetcomponent secara eksplisit.

Jika hal ini dilakukan android akanJika hal ini dilakukan, android akanmenemukan component (berdasarkan padadeklarasi di dalam file manifest) danmengaktifkannya.

Namun jika target tidak disebutkan secaraNamun jika target tidak disebutkan secaraeksplisit, maka android harus dapatmenentukan component yang terbaik untukmerespon intent tersebut.

Page 7: T Modul 13 Android GUI.pdf

<activity android:name="com.example.project.FreneticActivity"android:icon="@drawable/small_pic.png"android:label="@string/freneticLabel" . . . ><i t t filt ><intent-filter . . . >

<action android:name="android.intent.action.MAIN" /><category

android:name="android intent category LAUNCHER" />android:name= android.intent.category.LAUNCHER /></intent-filter><intent-filter . . . >

<action android:name="com.example.project.BOUNCE" />p p j /<data android:mimeType="image/jpeg" /><category

android:name="android.intent.category.DEFAULT" /></intent-filter>

</activity>

Page 8: T Modul 13 Android GUI.pdf

Jika pengguna meninggalkan task untuk waktuJika pengguna meninggalkan task untuk waktuyang lama, sistem akan membersihkan tasksemua activity kecuali activity dasar.

Ketika pengguna kembali ke task lagi, makapengguna akan melihat tampilan sebagaimanapengguna akan melihat tampilan sebagaimanaketika pengguna meninggalkannya, kecualibila activity awal dijalankan.

Page 9: T Modul 13 Android GUI.pdf

Sebuah activity dapat diatur menjadi entry pointuntuk sebuah task dengan memberikannya intentfilter dengan “android.intent.action.MAIN” yangditentukan sebagai aksi dang“android.intent.category.LAUNCHER” sebagaikategori.

Filter ini akan menampilkan ikon dan label activity diapplication launcher, memberikan akses kepadaapplication launcher, memberikan akses kepadapengguna untuk meluncurkan task dan kembali keapplication launcher kapan saja penggunamenginginkannyamenginginkannya.

Page 10: T Modul 13 Android GUI.pdf

• ActiveKetika ada di permukaan layar (di atastumpukan activity pada task yang saat itusedang berjalan) Activity inilah yangsedang berjalan). Activity inilah yangberkonsentrasi pada aksi dari pengguna

• PauseKetika tidak lagi berkonsentrasi padapengguna namun tetap tampil di layar.

• StopKetika terhalangi sepenuhnya oleh activitylainlain.

Page 11: T Modul 13 Android GUI.pdf

Implementasi dari method siklus hidup activityp p yharus dapat memanggil versi superclass.Contoh :

iprotected void onPause() {super.onPause();. . .

}

Page 12: T Modul 13 Android GUI.pdf
Page 13: T Modul 13 Android GUI.pdf

Ketika sistem menghentikan sebuah activity untuk menghemat memori, mungkin saja pengguna ingin kembali ke activity sebelumnya dan mendapatkan activity dalam sebelumnya dan mendapatkan activity dalam kondisi yang sama seperti sebelumnya.

Untuk menjaga kondisi agar tampak sama seperti sebelum dihentikan, anda dapat mengimplementaskan method mengimplementaskan method onSaveInstanceState() untuk activity tersebut.

Page 14: T Modul 13 Android GUI.pdf
Page 15: T Modul 13 Android GUI.pdf

Ada beberapa macam component Android yangp p y gbiasa dipakai dalam pembuatan aplikasi, yaitu :1. Text Control2. Button3. Check Box4 Radio Button4. Radio Button5. List6. Grid6. Grid7. Date and Time

Page 16: T Modul 13 Android GUI.pdf

Macam-macam text control meliputi :1. TextView2 EditT t2. EditText3. AutoCompleteTextView4 MultiAutoCompleteTextView4. MultiAutoCompleteTextView

Page 17: T Modul 13 Android GUI.pdf

Komponen TextView ini dapat memunculkan tulisan di l t t i tid k d t b h t li layar tetapi pengguna tidak dapat mengubah tulisan tersebut.

Page 18: T Modul 13 Android GUI.pdf

EditText merupakan subclass dari TextView. Dilihatd i EditT t d t di k t kdari namanya, EditText dapat digunakan untukmengubah teks.

Page 19: T Modul 13 Android GUI.pdf

AutoCompleteTextView merupakan TextView denganf i t l t K tik t hfungsi auto-complete. Ketika pengguna menyentuhhuruf, maka akan muncul pilihan menu yang dapatdipilih.

Page 20: T Modul 13 Android GUI.pdf

MultiAutoCompleteTextView sama sepertiAutoCompleteTextView Perbedaannya adalah ketikaAutoCompleteTextView. Perbedaannya adalah ketikakita telah memilih kata, lalu kita menggunakantanda koma kemudian kita dapat mencari kata lagi.

Page 21: T Modul 13 Android GUI.pdf

Pada kesempatan ini, akan dibahas 3 jenis buttonp , jyaitu :1. Basic button

b2. Image button3. Toggle button

Page 22: T Modul 13 Android GUI.pdf

Button yang paling dasar di android adalahd id id t B tt Di l i i h d tandroid.widget.Button. Di class ini hanya dapat

menangani event ketika button di tekan.

Page 23: T Modul 13 Android GUI.pdf

Android pun mendukung image button melaluiandroid.widget.ImageButton. Penggunaan imagebutton hampir sama dengan basic button.

Page 24: T Modul 13 Android GUI.pdf

ToggleButton ini seperti check box atau radio button. gg pButton ini mengarah pada On dan Off.

Page 25: T Modul 13 Android GUI.pdf

Custom button di sini dibuat menggunakan 3 custom imageimage.

Page 26: T Modul 13 Android GUI.pdf

CheckBox memiliki dua keadaan yaitu On dan Offsama seperti ToggleButtonsama seperti ToggleButton.

Page 27: T Modul 13 Android GUI.pdf

RadioButton memberikan pilihan kepada penggunanamun pengguna hanya bisa memilih satu.

Page 28: T Modul 13 Android GUI.pdf

ListView berfungsi untukListView berfungsi untukmenampilkan list dari item –item secara vertikal.

Page 29: T Modul 13 Android GUI.pdf

Android memiliki GridViewyang dapat menampilkandata dalam bentuk grid.Data yang ditampilkanData yang ditampilkandapat berupa teks, gambar,dan lain-lain.

Page 30: T Modul 13 Android GUI.pdf

Android juga menyediakan fasilitas DatePicker danTimePicker yang membuat kita dapat memilihTimePicker yang membuat kita dapat memilihtanggal dan waktu.

Page 31: T Modul 13 Android GUI.pdf

Layout

Manager

Deskripsi

Linear Layout Mengatur posisi layout pada layar secara

linear (horizontal ataupun vertikal).

RelativeLayout Mengatur posisi layout pada layar secara

relative.

TableLayout Mengatur layout agar berbentuk seperti tabel.

FrameLayout Mengatur layout yang memungkinkan untukFrameLayout Mengatur layout yang memungkinkan untuk

mengubah tata letak komponen.

TabLayout Mengatur layout agar dapat berbentuk tab.y g y g p

Page 32: T Modul 13 Android GUI.pdf

LinearLayout adalah tataletak yang paling sederhanatersedia di Android.LinearLayout mengatur tataLinearLayout mengatur tataletak komponen secaralinear horizontal atauvertikalvertikal.

Page 33: T Modul 13 Android GUI.pdf

RelativeLayout mengatur tata letak komponen dalamhubungan satu sama lain. Hal ini memberikanfleksibilitas lebih dari LinearLayouts.

Page 34: T Modul 13 Android GUI.pdf

TableLayout adalah sebuahTableLayout adalah sebuahViewGroup yangmemperlihatkan elemenView sebagai baris barisView sebagai baris-barisdan kolom-kolom.

Page 35: T Modul 13 Android GUI.pdf

Penggunaan layout ini biasanya tidak hanya untukmenampilkan secara dinamis satu view, namun jugadapat diisi dengan banyak item.

Page 36: T Modul 13 Android GUI.pdf

Layout ini mengatur tampilan agar dapat berbentuky g p g ptab.

Page 37: T Modul 13 Android GUI.pdf
Page 38: T Modul 13 Android GUI.pdf

Pembuatan Layout di main.xmly

Page 39: T Modul 13 Android GUI.pdf

b f l Pembuatan file java

Page 40: T Modul 13 Android GUI.pdf

Pembuatan Layout di main.xml

Page 41: T Modul 13 Android GUI.pdf

Pembuatan file java Pembuatan file java

Page 42: T Modul 13 Android GUI.pdf

Pembuatan Layout di main.xml

Page 43: T Modul 13 Android GUI.pdf

Pembuatan Layout di main.xml

Page 44: T Modul 13 Android GUI.pdf

Pembuatan file java Pembuatan file java

Page 45: T Modul 13 Android GUI.pdf

Layout di main.xml

Layout di hal2.xml => tambahkan dari Android XML fileLayout di hal2.xml > tambahkan dari Android XML file

Page 46: T Modul 13 Android GUI.pdf

main.xml

Page 47: T Modul 13 Android GUI.pdf
Page 48: T Modul 13 Android GUI.pdf

Buat 2 file javajlatGUI.java untuk tampilan ke 1hal2.java untuk tampilan ke 2j p

Page 49: T Modul 13 Android GUI.pdf

latGUI.javaj

Page 50: T Modul 13 Android GUI.pdf

hal2.javaj

Page 51: T Modul 13 Android GUI.pdf

Edit di AndroidManifest.xml