Study Independent

Android Development (Day 3)

Ringkasan
Membangun Antarmuka Pengguna

a. Material Design
b. Animasi dan Transisi
c. View
d. ViewGroup

Pembahasan
Material Design

Material Design adalah sebuah guideline / panduan untuk mendesain yang dibuat oleh Google
melalui riset yang dalam untuk menghasilkan UX yang lebih baik. Material design sendiri adalah
framework yang digunakan oleh Android, dan faktanya Android adalah sistem operasi untuk
mobile yang paling banyak digunakan. Desain material mencakup beberapa komponen seperti
color, theme, typography dan shape. Berikut adalah beberapa fondasi dari material desain yang
berguna untuk diketahui:

a. Layout :
Bentuk struktur tata letak yang menampung satu atau lebih dari satu komponen.
b. Navigasi :
Interaksi perpindahan dari satu page ke page yang lain.
c. Navigasi Drawer :
Merupakan daftar menu navigasi yang biasanya berada di kiri aplikasi.
d. Bottom Navigasi :
Merupakan menu navigasi yang diletakan pada posisi bawah layout.

1
Animasi dan Transisi

Android menyertakan framework transisi, yang memungkinkan untuk dengan mudah

menganimasikan perubahan antara dua hierarki tampilan. Framework menganimasikan tampilan
saat waktu proses dengan mengubah beberapa nilai propertinya pada interval waktu. Framework
ini mencakup animasi bawaan untuk efek umum dan memungkinkan membuat animasi kustom
dan callback siklus proses transisi. Berikut ini beberapa tipe animasi:

a. Property Animation

Ini adalah salah satu animasi yang fleksibel yang diperkenalkan di Android 3.0. Animasi
properti dapat digunakan untuk menambahkan animasi apa pun di CheckBox,
RadioButtons, dan widget apa pun. Berikut ini adalah contoh gambar dari animasi
property:

b. View Animation

Digunakan untuk melakukan animasi seperti ukuran, rotasi, titik awal, dan titik akhir.
Animasi ini lebih lambat dan kurang fleksibel. Contoh animasi Tampilan dapat digunakan
jika kita ingin memperluas tata letak tertentu di tempat itu kita dapat menggunakan
Animasi Tampilan. Contoh View Animation bisa dilihat di Expandable RecyclerView.

2
 c. Drawable Animation

Digunakan jika ingin menganimasikan satu gambar di atas yang lain. Cara sederhana
untuk memahami animasi drawable adalah dengan memuat rangkaian drawable satu
demi satu untuk membuat animasi. Contoh sederhana animasi yang dapat digambar
dapat dilihat di banyak aplikasi Layar splash pada animasi logo aplikasi.

View

View merupakan suatu komponen yang terlihat, dan pengguna dapat berinteraksi dengannya.
Berikut ini beberapa contoh turunan dari View :
a. TextView : Komponen view untuk menampilkan text
b. EditText : Komponen view untuk menampilkan input text atau form
c. ImageView : Komponen view untuk menampilkan gambar
d. Button : Komponen view untuk menampilkan button dengan text
e. CheckBox : Komponen view untuk tampilan checklist
f. RadioButton : Komponen view untuk menampilkan selector list
g. ProgressBar : Komponen view untuk menampilkan progress seperti garis linear atau
circular (bulat)
h. SeekBar : Komponen view digunakan untuk tampilan progress yang dapat diubah oleh
user seperti perpindahan durasi atau frame pada video player
i. dsb.

ViewGroup
ViewGroup juga merupakan salah satu turunan dari View. Perbedaanya ViewGroup biasanya
digunakan untuk menampung beberapa View atau ViewGroup Lainnya. Berikut ini beberapa
contoh turunan dari ViewGroup :
a. FrameLayout : Layout yang digunakan untuk tampilan sederhana yang saling menindih
atau bisa disebut stack layout
b. LinearLayout : Layout yang digunakan untuk tampilan linear secara vertical atau horizontal
c. RelativeLayout : Layout yang digunakan untuk tampilan yang fleksibel
d. ConstraintLayout : Sama seperti relative layout, tetapi lebih fleksibel
e. CoordinatorLayout : Layout yang biasa digunakan untuk membuat collapsing header

3
 f. TableLayout : Layout yang digunakan untuk menampilkan tampilan grid seperti tabel
g. dsb

Referensi
Berikut merupakan sumber referensi dari materi yang dibuat:

• https://material.io/develop/android
• https://medium.com/belajar-desain/material-design-dce52be59d36
• https://www.geeksforgeeks.org/introduction-to-material-design-in-android/
• https://developer.android.com/training/animation
• https://www.geeksforgeeks.org/animation-in-android-with-example/
• https://developer.android.com/guide/topics/ui/declaring-layout
• https://www.tutorialspoint.com/android/android_user_interface_layouts.htm

Referensi Tutorial
Berikut merupakan referensi tambahan dari materi yang dibuat:

• https://youtu.be/QDp8X43oFy8
• https://youtu.be/otMSB-dFuY8
• https://youtu.be/TPdXdXr1ghU
• https://youtu.be/v1hpaQdgutY

Penilaian
Penilaian akan dilakukan dengan memberikan tugas pada minggu terakhir (jumat).