Modul Pemrograman Mobile

Android Activity
Aplikasi Android Sederhana penerapan Input Events

A. Tujuan
1. Mahasiswa mengetahui apa itu Activity pada Aplikasi Android.
2. Mahasiswa Mampu memahami tahapan pengimplementasian komponen Activity
pada aplikasi Android sederhana.
B. Teori

Dalam modul ini kita akan belajar tentang komponen-komponen dasar yang digunakan untuk
membuat aplikasi android yang sederhana. Beberapa komponen diantaranya adalah :

1. Activity
Merupakan satu komponen yang berhubungan dengan pengguna. Activity menangani
window (tampilan) mana yang akan di tampilkan ke dalam interface (antarmuka). Activity
memiliki daur hidup (life cycle) tersendiri yang dimulai dari onCreate hingga onDestroy.

1. Activity merupakan sebuah komponen di Android yang berfungsi untuk menampilkan

user interface ke layar handset Android pengguna. Ini seperti pada saat Anda melihat
 daftar percakapan pada aplikasi chat atau daftar email pada aplikasi Gmail di ponsel
Android Anda.
2. Umumnya dalam sebuah aplikasi terdapat lebih dari satu activity yang saling terhubung
dengan tugas yang berbeda-beda.
3. Activity merupakan salah satu komponen penting Android yang memiliki daur hidup
(life cycle) dalam sebuah stack pada virtual sandbox yang disiapkan oleh Dalvik Virtual
Machine (DVM) atau Android Runtime (ART) yang bersifat last in first out.
4. Pada implementasinya, activity selalu memiliki satu layout user interface dalam bentuk
berkas xml.
5. Suatu aplikasi Android bisa memiliki lebih dari satu activity dan harus terdaftar di
berkas AndroidManifest.xml sebagai sub aplikasi.
6. Sebuah class Java dinyatakan sebuah activity jika mewarisi (extends)
superclass Activity atau turunannya seperti AppCompatActivity dan
FragmentActivity.

Jenis-jenis Activity pada Android Studio :

Jenis-jenis template Fungsinya

Activity
Add No Activity Tidak ada Activity yang ditambahkan

Activity dengan template komponen material design seperti

Basic Activity
FloatingActionButton

Bottom Navigation Activity Activity dengan tampilan side bar menu di bagian bawah

Empty Activity Activity dalam bentuk yang paling dasar

Fragment + ViewModel Activity dengan menerapkan architecture component

Fullscreen Activity Activity fullscreen tanpa status bar

Google AdMob Ads Activity Activity dengan konfigurasi default iklan Admob

Google Maps Activity Activity dengan menyediakan konfigurasi dasar Google Maps

Login Activity Activity untuk halaman login

Activity yang diperuntukan untuk alur aplikasi master detail pada

Master / Detail Flow
peranti tablet

Navigation Drawer Activity Activity dengan tampilan side bar menu

Scrolling Activity Activity dengan kemampuan scroll konten didalamnya secara vertikal

Settings Activity Activity yang diperuntukan untuk konfigurasi aplikasi

Activity yang diperuntukan untuk menampilkan lebih dari satu

Tabbed Activity tampilan, dapat digeser ke kanan dan ke kiri (swipe) dengan
menggunakan komponen ViewPager
C. Praktikum

Codelab Membuat Proyek Baru

Ikuti alur berikut untuk mengerjakan latihan ini:

1. Buat proyek baru dengan klik File → New → New Project pada Android Studio
Anda atau Anda bisa memilih Start a new Android Studio project di bagian
dashboard.

2. Pada bagian ini kita akan memilih tipe Activity awal dari template yang telah disediakan. Saat
ini Android Studio sudah menyediakan berbagai macam template Activity dari yang paling
sederhana hingga yang paling kompleks.
3. Selain itu, Anda juga bisa memilih target device mana yang akan Anda buat seperti Phone and
Tablet, Wear OS, TV, Android Auto atau Android Things. Saat ini kita pilih tipe Empty
Activity, klik Next untuk melanjutkan.

4. Selanjutnya masukkan nama aplikasi dan nama package aplikasi Anda. Sebaiknya jangan
sama dengan apa yang ada di contoh, karena ini berfungsi sebagai id dari aplikasi yang Anda
 buat. Kemudian Anda bisa menentukan lokasi proyek yang akan Anda buat. Setelah itu pilih
tipe gawai/peranti (device) untuk aplikasi beserta target minimuBarBarVolumem SDK yang
akan digunakan. Pilihan target Android SDK akan mempengaruhi banyaknya peranti yang
dapat menggunakan aplikasi. Di sini kita memilih nilai minimum SDK kita pasang ke Level 21
(Lollipop). Klik Finish untuk melanjutkan.

java

5. Tampilan layar Anda akan seperti contoh di bawah ini:

6. Di sebelah kanan Anda adalah workspace di mana Activity anda berada dan bernama
MainActivity dengan layout-nya activity_main.xml. Di sebelah kiri Anda terdapat struktur
proyek, di mana nanti kita akan banyak menambahkan berbagai komponen baru, asset, dan
library. Untuk lebih mengenal Android Studio lebih dalam silakan baca materi di sini.

Codelab Layouting Tampilan

1. Silakan pilih tab berkas activity_main.xml pada workspace
Anda(res/layout/activity_main.xml).

2. Pastikan project window pada pilihan Android, seperti di bawah ini:

3. Maka akan ada tampilan seperti ini, kemudian pilih tab Code di sebelah pojok kanan atas.

4. Ubah layout dasar dari ConstraintLayout menjadi LinearLayout seperti berikut dan
menambahkan baris TextView dan ListView seperti kode di bawah ini :
1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
3. xmlns:tools="http://schemas.android.com/tools"
4. android:layout_width="match_parent"
5. android:layout_height="match_parent"
6. android:padding="16dp"
7. android:orientation="vertical">
 8.
9. <TextView
10. android:layout_width="match_parent"
11. android:layout_height="wrap_content"
12. android:text="Panjang" />
13.
14. <EditText
15. android:id="@+id/edt_length"
16. android:layout_width="match_parent"
17. android:layout_height="wrap_content"
18. android:inputType="numberDecimal"
19. android:lines="1" />
20.
21. <TextView
22. android:layout_width="match_parent"
23. android:layout_height="wrap_content"
24. android:text="Lebar" />
25.
26. <EditText
27. android:id="@+id/edt_width"
28. android:layout_width="match_parent"
29. android:layout_height="wrap_content"
30. android:inputType="numberDecimal"
31. android:lines="1" />
32.
33. <TextView
34. android:layout_width="match_parent"
35. android:layout_height="wrap_content"
36. android:text="Tinggi" />
37.
38. <EditText
39. android:id="@+id/edt_height"
40. android:layout_width="match_parent"
41. android:layout_height="wrap_content"
42. android:inputType="numberDecimal"
43. android:lines="1" />
44.
45. <Button
46. android:id="@+id/btn_calculate"
47. android:layout_width="match_parent"
48. android:layout_height="wrap_content"
49. android:text="Hitung" />
50.
51. <TextView
52. android:id="@+id/tv_result"
53. android:layout_width="match_parent"
54. android:layout_height="wrap_content"
55. android:gravity="center"
56. android:text="Hasil"
57. android:textSize="24sp"
58. android:textStyle="bold" />
59. </LinearLayout>
5. Kemudian akan muncul warning pada atribut android:text pada layout tersebut.
Ini karena kita melakukan hardcoding pada nilai string-nya. Mari kita hilangkan code warning
tersebut dengan menekan Alt+Enter (option + return pada Mac) atau menekan lampu kuning
yang muncul pada attribute android:text. Akan muncul dialog seperti ini, pilih extract string
resource.
6. Kemudian akan muncul dialog seperti di bawah ini. Sesuaikan dengan nama yang
ada.
7. Fungsi extract string resource akan secara otomatis menambahkan nilai dari
android:text ke dalam berkas res → values → strings.xml.

8. Lakukan hal yang sama pada komponen view lainnya hingga tidak ada warning lagi.
Jika kita buka berkas strings.xml, maka isinya akan menjadi seperti ini:
1. <resources>
2. <string name="app_name">BarVolume</string>
3. <string name="width">Lebar</string>
4. <string name="height">Tinggi</string>
5. <string name="calculate">Hitung</string>
6. <string name="result">Hasil</string>
7. <string name="length">Panjang</string>
8. </resources>
9. Maka kode di dalam activity_main.xml akan menjadi seperti ini:
1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
3. xmlns:tools="http://schemas.android.com/tools"
4. android:layout_width="match_parent"
5. android:layout_height="match_parent"
6. android:padding="16dp"
7. android:orientation="vertical">
8.
9. <TextView
10. android:layout_width="match_parent"
11. android:layout_height="wrap_content"
12. android:text="@string/length" />
13.
14. <EditText
15. android:id="@+id/edt_length"
16. android:layout_width="match_parent"
17. android:layout_height="wrap_content"
18. android:inputType="numberDecimal"
19. android:lines="1" />
 20.
21. <TextView
22. android:layout_width="match_parent"
23. android:layout_height="wrap_content"
24. android:text="@string/width" />
25.
26. <EditText
27. android:id="@+id/edt_width"
28. android:layout_width="match_parent"
29. android:layout_height="wrap_content"
30. android:inputType="numberDecimal"
31. android:lines="1" />
32.
33. <TextView
34. android:layout_width="match_parent"
35. android:layout_height="wrap_content"
36. android:text="@string/height" />
37.
38. <EditText
39. android:id="@+id/edt_height"
40. android:layout_width="match_parent"
41. android:layout_height="wrap_content"
42. android:inputType="numberDecimal"
43. android:lines="1" />
44.
45. <Button
46. android:id="@+id/btn_calculate"
47. android:layout_width="match_parent"
48. android:layout_height="wrap_content"
49. android:text="@string/calculate" />
50.
51. <TextView
52. android:id="@+id/tv_result"
53. android:layout_width="match_parent"
54. android:layout_height="wrap_content"
55. android:gravity="center"
56. android:text="@string/result"
57. android:textSize="24sp"
58. android:textStyle="bold" />
59. </LinearLayout>
10. Jika Anda perhatikan, hasil layout sementara akan menjadi seperti ini:
Codelab Kode Logika pada MainActivity

1. Selanjutnya setelah selesai, lanjutkan dengan membuka berkas MainActivity dan lanjutkan
ketik baris-baris di bawah ini.
Tambahkan beberapa variabel yang akan digunakan untuk menampung view.
1. private EditText edtWidth;
2. private EditText edtHeight;
3. private EditText edtLength;
4. private Button btnCalculate;
5. private TextView tvResult;
2. Kemudian inisiasi variabel yang telah kita buat dengan menambahkan kode berikut di dalam
metode onCreate.
1. @Override
2. protected void onCreate(Bundle savedInstanceState) {
3. super.onCreate(savedInstanceState);
4. setContentView(R.layout.activity_main);
5.
6. edtWidth = findViewById(R.id.edt_width);
7. edtHeight = findViewById(R.id.edt_height);
8. edtLength = findViewById(R.id.edt_length);
9. btnCalculate = findViewById(R.id.btn_calculate);
10. tvResult = findViewById(R.id.tv_result);
11.
12. btnCalculate.setOnClickListener(this);
13.
14. }
3. Akan muncul baris merah pada kata this. Hal ini karena kita belum menambahkan interface di
kelas MainActivity. Silakan klik di atas baris merah tersebut, kemudian tekan tombol Alt
+ Enter (option + return pada Mac) atau menekan lampu merah yang muncul lalu pilih
aksi berikut untuk implement interface.

4. Maka secara otomatis akan ada penambahan kode pada kelas MainActivity seperti berikut
ini:

1. public class MainActivity extends AppCompatActivity implements

View.OnClickListener {
2.
3. ...
4.
5. }
5. Jika terdapat baris merah seperti ini:

Jangan khawatir! Silakan klik di atas baris merah tersebut, kemudian tekan
tombol Alt + Enter (option + return pada Mac) atau menekan lampu merah yang
muncul lalu pilih implement members (Kotlin) atau implement methods
(Java). Jika terdapat baris merah seperti ini:
6. Maka secara otomatis akan ada penambahan metode onClick di kelas MainActivity. Setelah
itu, tambahkan kode berikut ke dalam metode onClick:
1. @Override
2. protected void onCreate(Bundle savedInstanceState) {
3. super.onCreate(savedInstanceState);
4. setContentView(R.layout.activity_main);
5.
6. ...
7.
8. }
9.
10. @Override
11. public void onClick(View v) {
12. if (v.getId() == R.id.btn_calculate) {
13. String inputLength =
edtLength.getText().toString().trim();
14. String inputWidth =
edtWidth.getText().toString().trim();
15. String inputHeight =
edtHeight.getText().toString().trim();
16.
17. Double volume = Double.parseDouble(inputLength) *
Double.parseDouble(inputWidth) * Double.parseDouble(inputHeight);
18. tvResult.setText(String.valueOf(volume));
19. }
20. }
7. Akhirnya kelas MainActivity akan memiliki kode seperti berikut ini:
1. public class MainActivity extends AppCompatActivity implements
View.OnClickListener {
2. private EditText edtWidth, edtHeight, edtLength;
3. private Button btnCalculate;
4. private TextView tvResult;
5.
6. @Override
7. protected void onCreate(Bundle savedInstanceState) {
8. super.onCreate(savedInstanceState);
9. setContentView(R.layout.activity_main);
10.
11. edtWidth = findViewById(R.id.edt_width);
12. edtHeight = findViewById(R.id.edt_height);
13. edtLength = findViewById(R.id.edt_length);
14. btnCalculate = findViewById(R.id.btn_calculate);
15. tvResult = findViewById(R.id.tv_result);
16.
17. btnCalculate.setOnClickListener(this);
18. }
19.
20. @Override
21. public void onClick(View v) {
22. if (v.getId() == R.id.btn_calculate) {
23. String inputLength =
edtLength.getText().toString().trim();
24. String inputWidth =
edtWidth.getText().toString().trim();
25. String inputHeight =
edtHeight.getText().toString().trim();
26.
27. Double volume = Double.parseDouble(inputLength)
* Double.parseDouble(inputWidth) *
Double.parseDouble(inputHeight);
28. tvResult.setText(String.valueOf(volume));
 29. }
30. }
31. }
8. Setelah selesai, silakan jalankan aplikasi dengan memilih menu Run → Run ‘app’
dari menu bar.

9. Selain cara di atas, Anda juga dapat menekan icon berikut di toolbar:

10. Kemudian akan muncul pilihan seperti ini:

11. Pilih OK untuk menjalankan dan tunggu hingga proses building dan instalasi APK
selesai.
12. Silakan masukkan nilai panjang, lebar, dan tinggi kemudian tekan tombol Hitung dan hasilnya
akan ditampilkan di objek textview tvResult. Namun masih ada sedikit masalah di sini, yaitu
Anda tetap melakukan proses perhitungan walaupun salah satu nilainya kosong. Hal ini akan
menyebabkan aplikasi force close karena perhitungan tidak dapat diproses. Maka untuk
mengatasinya Anda akan menggunakan percabangan untuk mengecek apakah masing-masing
EditText kosong atau tidak.
Silakan buka kembali kelas MainActivity. Tambahkan kode berikut ke dalam metode
onClicksebelum melakukan perhitungan.

1. @Override
2. public void onClick(View v) {
3. if (v.getId() == R.id.btn_calculate) {
4. String inputLength =
edtLength.getText().toString().trim();
5. String inputWidth =
edtWidth.getText().toString().trim();
6. String inputHeight =
edtHeight.getText().toString().trim();
7.
8. boolean isEmptyFields = false;
9.
10. if (TextUtils.isEmpty(inputLength)) {
11. isEmptyFields = true;
12. edtLength.setError("Field ini tidak boleh kosong");
13. }
14.
15. if (TextUtils.isEmpty(inputWidth)) {
16. isEmptyFields = true;
17. edtWidth.setError("Field ini tidak boleh kosong");
18. }
19.
20. if (TextUtils.isEmpty(inputHeight)) {
21. isEmptyFields = true;
22. edtHeight.setError("Field ini tidak boleh kosong");
23. }
24.
25. if (!isEmptyFields) {
26. Double volume = Double.parseDouble(inputLength) *
Double.parseDouble(inputWidth) *
Double.parseDouble(inputHeight);
27. tvResult.setText(String.valueOf(volume));
28. }
29. }
30. }
13. Akhirnya kelas MainActivity akan memiliki kode seperti berikut ini:
1. public class MainActivity extends AppCompatActivity implements
View.OnClickListener {
2. private EditText edtWidth, edtHeight, edtLength;
3. private Button btnCalculate;
4. private TextView tvResult;
5.
6. @Override
7. protected void onCreate(Bundle savedInstanceState) {
8. super.onCreate(savedInstanceState);
9. setContentView(R.layout.activity_main);
10.
 11. edtWidth = findViewById(R.id.edt_width);
12. edtHeight = findViewById(R.id.edt_height);
13. edtLength = findViewById(R.id.edt_length);
14. btnCalculate = findViewById(R.id.btn_calculate);
15. tvResult = findViewById(R.id.tv_result);
16.
17. btnCalculate.setOnClickListener(this);
18. }
19.
20. @Override
21. public void onClick(View v) {
22. if (v.getId() == R.id.btn_calculate) {
23. String inputLength =
edtLength.getText().toString().trim();
24. String inputWidth =
edtWidth.getText().toString().trim();
25. String inputHeight =
edtHeight.getText().toString().trim();
26.
27. boolean isEmptyFields = false;
28.
29. if (TextUtils.isEmpty(inputLength)) {
30. isEmptyFields = true;
31. edtLength.setError("Field ini tidak boleh
kosong");
32. }
33.
34. if (TextUtils.isEmpty(inputWidth)) {
35. isEmptyFields = true;
36. edtWidth.setError("Field ini tidak boleh
kosong");
37. }
38.
39. if (TextUtils.isEmpty(inputHeight)) {
40. isEmptyFields = true;
41. edtHeight.setError("Field ini tidak boleh
kosong");
42. }
43.
44. if (!isEmptyFields) {
45. Double volume = Double.parseDouble(inputLength)
* Double.parseDouble(inputWidth) *
Double.parseDouble(inputHeight);
46. tvResult.setText(String.valueOf(volume));
47. }
48. }
49. }
50. }
51.
52.
53.
14. Jalan kembali aplikasi Anda dengan memilih menu Run → Run ‘app’ atau shortcut Shift +
F10. Cobalah langsung menekan tombol HITUNG tanpa mengisi EditText, maka aplikasi
Anda tidak akan force close dan akan muncul peringatan bahwa "Field ini tidak boleh
kosong".
15. Apakah kita sudah selesai? Belum! Masih ada yang kurang. Ketika nilai volume sudah dihitung
dan kemudian terjadi pergantian orientasi (portrait-landscape) pada peranti, maka hasil
perhitungan tadi akan hilang. Hal ini karena di dalam Android, jika melakukan pergantian
orientasi, Android akan memanggil fungsi onCreate kembali, sehingga data akan kembali
menjadi seperti semula.

16. Untuk mengatasinya, tambahkan metode onSaveInstanceState() pada MainActivity dan

sesuaikan seperti berikut:
1. private static final String STATE_RESULT = "state_result";
2.
3. ...
4.
5. @Override
6. protected void onSaveInstanceState(Bundle outState) {
7. super.onSaveInstanceState(outState);
8. outState.putString(STATE_RESULT,
tvResult.getText().toString());
9. }
17. Kemudian tambahkan juga beberapa baris berikut pada baris terakhir metode onCreate.
 1. @Override
2. protected void onCreate(Bundle savedInstanceState) {
3. super.onCreate(savedInstanceState);
4. setContentView(R.layout.activity_main);
5.
6. ...
7.
8. if (savedInstanceState != null) {
9. String result =
savedInstanceState.getString(STATE_RESULT);
10. tvResult.setText(result);
11. }
12. }
18. Silakan jalankan kembali aplikasinya. Ulangi proses perhitungan seperti sebelumnya.
Kemudian ganti orientasi peranti Anda. Jika sudah benar maka hasil perhitungan tidak akan
hilang.

Daftar Pustaka

Kelas Online, Kelas Fundamental Android Developer Expert, Dicoding.