juliaamanda.blogspot.com: Materi Pembelajaran Pemrograman Berorientasi Objek Kelas XII RPL

2. Mengenal Struktur Pemrograman Android

Sebelum memulai membuat aplikasi android sederhana,anda perlu mengetahui struktur pemrograman dalam Android. Berikut adalah struktur pemrograman dan penyimpanan folder terkait dalam Android studio.

Penjelasan struktur program Android Studio adalah sebagai berikut.

a java

Bagian ini digunakan untuk menyimpan file-file yang berisi source code Java yang dibuat oleh programmer dan dipisahkan berdasarkan nama package. Bagian utama darı program akan disimpan dalam file MainActivity.java. Bentuk default dari MainActivity.java adalah sebagai berikut.

1 package com.example.myapplication

3 import android.os.Bundle

4 import com.google.android.material. snackbar.Snackbar

5 import androidx.appcompat.app.AppCompatActivity.

6 import android.view.menu

7 import android.view.MenuItem

9 import kotlinx.android.synthetic.main. activity_main.

11 class MainActivity: AppCompatActivity() {

12 Bundle ?) {

13 override fun onCreate(savedInstanceState:

14 super.onCreate(savedInstanceState)

15 setContentView(R.layout.activity_main)

16 setSupportActionBar (toolbar)

18 fab.setOnClickListener {

19 view ->

20 Snackbar.make (view, "Replace with your own action", Snackbar.LENGTH LONG)

21.setAction("Action", null).show()

22 }

23 }

24 override fun onCreateOptionsMenu (menu: Menu): Boolean {

25 menuinflater.inflate(R.menu.menu_main, menu)

26 return true

27 }

29 override fun onOptionsItemSelected(item: MenuItem): Boolean {

30 return when (item.itemId) {

31 R.id.action settings -> true

32 else -> super.onOptionsItemSelected(item)

33}

34 }

35 }

b. res/drawable-hdpi Bagian ini merupakan folder untuk menyimpan drawable object atau desain dari objek yang dibuat dalam format .jpg atau .png.

C. res/layout Bagian ini merupakan folder untuk menyimpan file-file user interface.

d. res/menu Bagian ini merupakan folder untuk menyimpan file XML yang membentuk menu dari aplikasi.

e. res/mipmap Bagian ini merupakan folder yang dikhususkan untuk menyimpan ikon aplikasi.

f. res/values Bagian ini digunakan untuk menyimpan file XML, seperti colors, dimens, strings, dan styles.

Berikut adalah penjelasan dari masing-masing file tersebut.

1) colors.xml

colors.xml digunakan untuk mengatur warna dari status bar, teks, dan pengaturan warna lainnya. Bentuk default dari colors.xml adalah sebagai berikut.

<?xml version="1.0" encoding="utf-8"?>

<color name="colorAccent">#D81B60</ color> /resources>

2) dimens.xml

dimens.xml digunakan untuk mengatur margin aplikasi yang dibuat. Bentuk default dari dimens.xml adalah sebagai berikut.

</resources>

3) strings.xml

strings.xml digunakan untuk mengatur teks dari aplikasi yang dibuat. Bentuk default dari strings.xml adalah sebagai berikut.

<string name="app_name">My

Application</string>

<string name="action_

settings">Settings</string>

</resources>

4) styles.xml

styles.xml digunakan untuk memberi nama pada warna setelah dimasukkan (mix color) atau setelah warna di-setting pada colors.xml. Bentuk default dari styles.xml adalah sebagai berikut.

AppCompat.Light. DarkActionBar">

<item name="colorPrimary">@color/ colorPrimary</item>

<item name="colorPrimaryDark">@color/ colorPrimaryDark</item>

<item name="colorAccent">@color/ colorAccent</item>

</style>

<item name="windowActionBar">false</ item>

</Resource>

5) AndroidManifest.xml

AndroidManifest.xml merupakan tempat menyimpan manifest aplikasi, karakter, atau jenis dari aplikasi yang terdiri atas application name, icon, theme, dan user permission. Bentuk default dari AndroidManifest.xml adalah sebagai berikut.

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.

android.com/apk/res/android" package="com.

example.myapplication">

<application

android:allowBackup="true"

android:icon="@mipmap/ic_launcher"

android:label="@string/app name"

android:roundIcon="@mipmap/ic_launcher_ round"

android:supportsRtl="true"

android:theme="@style/AppTheme"> <activity

android:name=".MainActivity"

android:label="@string/app_name"

android:theme="@style/AppTheme. NoActionBar">

<intent-filter>

</intent-filter>

</activity>

</application>

</manifest>

6) build.gradle

build.gradle adalah tempat menyimpan file project yang telah ter-generate atau terkompilasi, antara lain compileSdkVersion, build Tools Version, applicationld, minSdkVersion, targetSdkVersion, versionCode, dan versionName. build.gradle digunakan untuk mengidentifikasi versi OS, SDK, dan library yang akan digunakan dalam aplikasi.

3. Membuat Project Android

Untuk membuat project dengan menggunakan Android Studio, langkah-langkahnya adalah sebagai berikut. Klik File, kemudian New dan pilih New Project. Selanjutnya, pada halaman Welcome to Android Studio, klik Start a new Android Studio project.

b. Pada halaman Create New Project, tentukan nama aplikasi, domain, dan direktori penyimpanan project.

c. Setelah itu, pilih tipe minimal Android SDK yang didukung oleh project yang Anda kembangkan, kemudian klik Next.

d. Selanjutnya, isikan jenis project (form activity) pada bagian Activity Name, Layout Name, Title, dan Menu Resource Name, kemudian klik Finish.

J. Membuat Aplikasi Android Sederhana

ada subbab sebelumnya, Anda telah belajar mengenai P Android Studio, mulai dari kebutuhan sistem, tahapan instalasi, struktur program, hingga membuat project baru. Pada subbab ini, Anda akan mencoba membuat aplikasi sederhana serta menjalankannya pada emulator dan perangkat Android secara langsung.

1. Membuat Aplikasi Sederhana dengan Android Studio

Setelah Anda memahami cara membuat project baru dengan Android Studio, Anda akan belajar mendesain tampilan dan menambahkan kode pada project Android yang telah Anda buat. Pada tutorial ini, Anda akan membuat aplikasi sederhana untuk menghitung luas persegi panjang. Langkah-langkahnya adalah sebagai berikut.

a. Buatlah sebuah project di Android Studio dengan nama BangunDatar. Selanjutnya, aturlah minimal Android SDK yang didukung, yaitu API 8: Android 2.2 (Froyo).

b. Sebagai langkah awal, Anda akan membuat layout dari aplikasi. Untuk melakukannya, klik menu app→res → layout. Pada menu layout, terdapat dua file, yaitu activity_ main.xml dan content_main.xml. File activity_main.xml digunakan untuk menampilkan bagian luar dari layout, seperti toolbar dan floating bar. Adapun content_main.xml menampilkan bagian isi atau konten dari layout.

c. Untuk mengatur layout pada content main.xml, klik menu appres layout content main.xml. Pada menu ini, Anda akan membuat layout seperti berikut.

d. Pada layout tersebut, terdapat dua tipe layout yang digunakan, yaitu relative layout dan linear layout. Relative layout adalah desain tampilan aplikasi dengan tata letak (layout) secara bebas sesuai dengan aturan user. Sementara itu, linear layout adalah desain tampilan aplikasi dengan tata letak (layout) horizontal atau vertikal. Desain tampilan hanya dapat dimasukkan secara menyamping (horizontal) atau menurun (vertikal), berbeda dengan relative layout yang dapat dilakukan secara bebas.

e. Pada Gambar 2.56, Anda dapat melihat tampilan Design dari content_main.xml. Anda dapat menambahkan konten layout dengan menarik komponen yang terdapat di menu Pallete di sebelah kiri layar. Aturlah komponen seperti contoh yang ada. Setelah itu, klik Text untuk melihat kode yang dihasilkan.

Kode tersebut dihasilkan dari komponen-komponen yang telah Anda atur sebelumnya. Pada bagian ini, Anda juga dapat menambahkan komponen atau pengaturan dengan menggunakan kode xml. Berikut adalah contoh kode yang dihasilkan.

1 <?xml version="1.0" encoding="utf-8"?>

2 <RelativeLayout xmlns:android="http:// schemas.android.com/apk/res/android"

3 xmlns: tools="http://schemas.android.com/ tools"

4xmlns:app="http://schemas.android.com/apk/ res-auto"

5 android:layout_width="match_parent"

6 android:layout_height="match_parent"

7 android:paddingLeft="@dimen/activity_ horizontal_margin"

8 android:paddingRight="@dimen/activity_ horizontal_margin"

9 android:paddingTop="@dimen/activity_ vertical margin"

10android:paddingBottom="@dimen/activity_ vertical_margin"

11 app:layout_behavior="@string/appbar_ scrolling_view_behavior"

12 tools:showIn="@layout/activity_main" tools:context=".MainActivity">

14 <RelativeLayout

15 android:layout_width="match_parent"

16 android:layout_height="match_parent"

17 android:layout_alignParentTop="true"

18 android:layout alignParentLeft="true"

19 android:layout alignParentStart="true">

21 <LinearLayout

22 android:orientation="vertical"

23 android:layout_width="match_parent"

24 android:layout_height="wrap_content"

25 android:id="@+id/linearLayout"

26 android:paddingBottom="32dp"

27 android:layout_centerVertical="true"

28 android:layout alignRight="@+id/clear"

29 android:layout_alignEnd="@+id/clear"> 30

31 <TextView

32 android:layout_width="wrap_content"

33 android:layout_height="wrap_content"

34 android:textAppearance="?android:attr/ textAppearanceMedium"

35 android:text="Panjang"

36 android:id="@+id/textView2"

37 android:layout_centerVertical="true" />

39 <EditText

40 android:layout_width="match_parent"

41 android:layout_height="wrap_content"

42android:inputType="number|numberDecimal" 43 android:ems="10"

44 android:id="@+id/input Panjang"

45 android:layout_gravity="right"

46 android:singleLine="true" />

48 <TextView

49 android:layout_width="wrap_content"

50 android:layout_height="wrap_content"

51 android:textAppearance="?android:attr/ textAppearanceMedium"

52 android:text="Lebar"

53 android:id="@+id/textView3"

54 android:layout_centerVertical="true" />

56 <EditText

57 android:layout_width="match_parent"

58 android:layout_height="wrap_content"

59 android:inputType="number|numberDecimal"

60 android:ems="10"

61 android:id="@+id/inputLebar"

62 android:layout_below="@+id/linearLayout"

63 android:layout_alignParentLeft="true"

64 android:layout_alignParentStart="true"

65 android:layout_ alignParentRight="true"

66 android:layout_alignParentEnd="true"

67 android:singleLine="true" />

69 <TextView

70 android:layout_width="wrap_content"

71 android:layout_height="wrap_content"

72 android:textAppearance="?android:attr/ textAppearanceMedium"

73 android:text="Luas Persegi Panjang"

74 android:paddingTop= "72dp"

75 android:id="@+id/textView4"

76 android:layout_below="@+id/editText2"

77 android:layout_alignParentLeft="true"

78 android:layout_alignParentStart="true" />

80 <TextView

81 android:layout_width="wrap_content"

82 android:layout_height="wrap_content"

83 android:textAppearance="?android:attr/ textAppearanceLarge"

84 android:text="0"

85 android:layout_gravity="end"

86 android:textAlignment="textEnd"

87 android:textSize="64dp"

88 android:id="@+id/hasil"

89 android:layout above="@+id/button"

90 android:layout_alignParentLeft="true"

91 android:layout_alignParentStart="true"

92 android:layout_alignParentRight="true" 93 android:layout_alignParentEnd="true"

94 android:layout_below="@+id/textView4" />

96 </LinearLayout>

98 <Button

99 android:layout_width="160dp"

100 android:layout_height="wrap_content"

101 android:text="PROSES"

102 android:textColor="#FFFFFF"

103 android:id="@+id/button"

104 android:onClick="hitungLuas"

105android:background="@color/colorAccent"

106android:layout_below="@+id/linearLayout"

107 android:layout_alignParentLeft="true"

108 android:layout_alignParentStart="true" />

109

110 <Button

111 android:layout_width="160dp"

112 android:layout_height="wrap_content"

113 android:text="CLEAR"

114 android:textColor="#FFFFFF"

115 android:id="@+id/clear"

116 android:onClick="clearData"

117 android:background="#FFBB33"

118 android:layout_alignTop="@+id/button"

119 android:layout_alignParentRight="true"

120 android:layout_alignParentEnd="true" />

121

122 </RelativeLayout>

123

124 </RelativeLayout>

i. Setelah itu, klik Text untuk menambahkan kode program dan pengaturan pada tampilan tersebut.

Perhatikan kode program berikut.

1 <?xml version="1.0" encoding="utf-8"?>

2 <android.support.design.widget. CoordinatorLayout

3xmlns:android="http://schemas.android.com/ apk/res/android"

4xmlns:app="http://schemas.android.com/apk/ res-auto" 5xmlns:tools="http://schemas.android.com/ tools"

6 android:layout_width="match_parent"

7 android:layout_height="match_parent"

8 android:fitsSystemWindows="true"

9 tools:context=".MainActivity">

11<android.support.design.widget.AppBarLayout

12 android:layout_height="wrap_content"

13 android:layout_width="match_parent"

14 android:theme="@style/AppTheme. AppBarOverlay">

16 <android.support.v7.widget.Toolbar

17 android:id="@+id/toolbar"

18 android:layout_width="match_parent"

19 android:layout_height="?attr/actionBarSize"

20 android:background="?attr/colorPrimary"

21 app:popupTheme="@style/AppTheme. PopupOverlay" />

23 </android.support.design.widget. AppBarLayout>

25 <include layout="@layout/content_main" />

27 </android.support.design.widget. CoordinatorLayout>

Kode program tersebut digunakan untuk mengatur toolbar, seperti ukuran panjang, lebar, warna, dan style. Perhatikan baris 25 pada kode program tersebut, terdapat perintah <include layout="@layout/ content main" />. Perintah tersebut digunakan untuk memasukkan layout yang terdapat pada file content_main. xml. Dengan demikian, ketika kedua file layout digabungkan, akan muncul tampilan aplikasi yang dilengkapi toolbar, kolom input user, hasil penghitungan, serta tombol penghitungan dan reset, seperti yang ditunjukkan Gambar 2.53 (Halaman 73).

J. Setelah mengatur layout dari aplikasi, selanjutnya adalah menambahkan kode untuk melakukan penghitungan luas persegi panjang. Pada project structure, klik menu app → java com.example.user.bangundatar xml. activity_main.

Berikut adalah kode program untuk MainActivity.java.

1 package com.example.user.bangundatar;

3 import android.os.Bundle;

4 import android.support.design.widget.FloatingActionButton;

5 import android.support.design.widget.Snackbarr;

6 import android.support.v7.app. 8 import android.support.design.widget.AppCompatActivity;

7 import android.support.v7.widget.Toolbar;

8 import android.view.View;

9 import android.view.Menu;

10 import android.view.MenuItem;

11 import android.widget.EditText;

12 import android.widget.TextView;

14 public class MainActivity extends 15 AppCompatActivity {

16 private EditText panjang:

17 private EditText lebar;

18 private TextView hasil;

20 @Override

21 protected void onCreate(Bundle savedInstanceState) {

22 super.onCreate(savedInstanceState);

23 setContentView(R.layout.activity_main); 24 Toolbar toolbar (Toolbar) findViewById(R.id.toolbar):

25 setSupportActionBar (toolbar);

26 panjang (EditText) findViewById(R. id.inputPanjang);

27 lebar (EditText) findViewById(R. id.inputlebar);

26 hasil (TextView) findViewById(R. id.hasil); 29

30)

32 public void hitungLuas (View v) {

33 String strPanjang panjang.getText(). toString();

34 String strlebar lebar.getText().

36 float valPanjang = Float. parseFloat(strPanjang);

37 float vallebar parseFloat (strlebar); Float.

39 float valHasil valPanjang vallebar:

41 displayLuas (valHasil);

42 }

44 public void displayLuas (float vallasil)

45 String strHasil "";

46 astrhasil = " " +valHasil ;

48 hasil.setText (strHasil): 49 }

51 public void clear Data (View v) {

52 panjang.setText("");

53 lebar.setText("");

54 hasil.setText("0");

55 }

58 @Override

59 public boolean onCreateOptionsMenu (Menu menu) {

60 // Inflate the menu: this adds items to the action bar if it is present.

61getMenuInflater().inflate(R.menu.menu_main, menu):

62 return true;

63}

65 @Override

66 public boolean onOptionsItemSelected(MenuItem item) (

67 // Handle action bar item clicks here. The action bar will

68 // automatically handle clicks on the Home/Up button, so long

69 // as you specify a parent activity in AndroidManifest.xml.

70 int id item.getItemId();

72//noinspection SimplifiablelfStatement

73/ * if (id R.id.action_settings) {

74 return true;

75 }

76*/

77 return super.onOptionsItemSelected(item);

78 }

79 }

k. Setelah mengatur layout dan menambahkan kode, Anda dapat melakukan beberapa pengaturan tambahan agar aplikasi Anda tampak lebih menarik. Anda dapat mengubah pengaturan warna aplikasi dengan mengeklik menu app → res values colors.xml.

Setelah itu, tambahkan kode program berikut.

<?xml version="1.0" encoding="utf-8"?> <resources>

</resources>

Daftar color name tersebut adalah daftar warna yang digunakan pada program. Contohnya colorPrimary adalah warna yang akan digunakan pada toolbar, colorPrimaryBar adalah warna pada status bar, dan colorAccent adalah warna yang muncul sebagai highlight ketika kolom input (EditText) ditekan.

1. Anda juga dapat mengubah pengaturan string sehingga tidak harus menulis kembali string yang sama secara berulang. Klik menu app → res→ values → strings.xml.

Setelah itu, tambahkan kode berikut.

<string name="app name">Luas Persegi Panjang</string>

</resources>

m. Setelah melakukan langkah-langkah tersebut, Anda telah mampu membuat sebuah aplikasi sederhana dengan Android Studio. Pada tutorial berikutnya, Anda akan belajar menjalankan aplikasi tersebut dengan emulator dan perangkat Android secara langsung.

2. Mengaktifkan Android Virtual Device (AVD)

Android Virtual Device atau AVD adalah sebuah komponen yang disediakan oleh Android Studio untuk menjalankan emulator pada komputer. Langkah-langkah konfigurasi AVD adalah sebagai berikut.

a. Klik tombol AVD configuration.

b. Lalu pilih jenis device yang akan digunakan, kemudian klik Next.

C. Langkah selanjutnya adalah melakukan konfigurasi Android Image. Pilih System Image yang diinginkan kemudian klik Next.

3. Menjalankan Aplikasi dengan Emulator

Untuk mengetahui hasil desain layout project Android yang telah dibuat, lakukan kompilasi pada project. Langkah-langkah untuk mengompilasi desain project Android Studio pada AVD adalah sebagai berikut.

a. Klik tombol Run untuk memulai kompilasi.

b. Pastikan bahwa launch emulator telah terpilih, kemudian klik OK.

c. Hasil dari kompilasi adalah sebagai berikut.

Selain dijalankan melalui emulator, hasil desain dapat pula dijalankan secara langsung pada perangkat Android yang disambungkan dengan komputer. Langkah-langkahnya adalah sebagai berikut.

4. Menjalankan Aplikasi Sederhana pada Perangkat Android

Untuk menjalankan project pada perangkat Android, terlebih dahulu pastikan perangkat memiliki versi sistem operasi Android yang minimal sama dengan versi SDK yang telah diatur sebelumnya. Setelah itu, sambungkan perangkat Android ke komputer dengan menggunakan kabel data.

a. Klik pada tombol Android Device Monitor.