Android Fundamentals 04.1 : Clickable Images

Alat dan aplikasi yang diperlukan:

• PC/Desktop dengan Sistem Operasi Windows
• Java Development Kit (JDK) versi 11
• Android Studio versi 3.3

Task 1 : Menambahkan Image ke Layout

1.1 Memulai proyek baru

1. Buat proyek baru dengan nama Droid Cafe.
2. Pilih template Basic Activity. Pada file MainActivity.java, pastikan bahwa file General Layout dan opsi Backwards Compatibility (AppCompat) telah dipilih.
3. Klik Finish.
4. Proyek akan terbuka dengan memunculkan dua file layout pada folder res > layout : activity_main.xml untuk app bar dan floating action button (tidak diubah pada task ini) , dan filecontent_main.xml untuk hal lainnya pada layout. Buka file content_main.xml dan klik tab Design.

5. Pilih TextView “Hello World” pada layout dan buka panel Attributes.

6. Ubah atribut textintro seperti berikut:

7. Hapus constraint bawah dari textintro .

8. Pindah ke tab Text, lalu jadikan teks Droid Desserts menjadi resource name seperti berikut.

1.2 Menambahkan Gambar

1. Copy gambar donut_circle.png, froyo_circle.png, dan icecream_circle.png ke folder app > src > main > res > drawable.

2. Buka file content_main.xml dan klik tab Design.

3. Atur ikon gambar pada layout seperti berikut.

4. Jika muncul ikon segitiga kuning dengan tanda (!) , maka klik dua kali pada ImageView > Fix > Ok.

1.3 Menambahkan Deskripsi Teks

1. Drag TextView ke layout.
2. Atur Atribut seperti berikut. Lakukan hal yang sama pada ID ice_cream dan froyo .

Task 2 : Menambahkan Metode onClick untuk Gambar

2.1 Membuat Method Toast

1. Pada file string.xml, ketikkan kode berikut.

2. Kemudian, ketikkan kode berikut pada file MainActivity.java.

2.2 Membuat Click Handlers

Tulis kode berikut untuk menampilkan pesan ketika gambar desserts diklik.

2.3 Menambahkan Atribut onClick

1. Buka file content_activity.xml. Ubah ke tab Text.
2. Tuliskan kode berikut pada semua ImageView gambar desserts.

3. Jalankan aplikasi.

Task 3: Mengubah Floating Action Button

3.1 Menambahkan Ikon Baru

1. Pergi ke panel Project > Android dan klik kanan pada folder drawable.
2. Pilih New > Image Asset. Muncul dialog Configure The Image Asset.
3. Pilih Action Bar and Tab icons pada menu drop-down di bagian atas dialog.
4. Pada kolom Name, ubah ic_action_name menjadi ic_shopping_cart.
5. Klik logo Android di samping Clipart: untuk memilih gambar clip art sebagai ikon. Pilih ikon shopping cart.

6. Pilih HOLO_DARK dari menu drop-down pada Theme. Klik Next.

7. Klik Finish pada Confirm Icon Path dialog.

3.2 Menambahkan Activity

1. Klik kanan pada folder com.example.android.droidcafe di kolom bagian kiri Android Studio dan pilih New > Activity > Empty Activity.

2. Edit Activity Name menjadi OrderActivity, dan Layout Name menjadi activity_order. Klik Finish.

3.3 Merubah Action

1. Buka file MainActivity.java.
2. Ubah method onClick(View view) menjadi seperti berikut.

3. Jalankan aplikasi.

Ketika diklik icon di pojok kanan bawah, maka akan mengarahkan ke OrderActivity

Sumber:

https://codelabs.developers.google.com/codelabs/android-training-clickable-images/