BAGIAN

USER INTERFACE (UI)

Komponen User Interface (UI)
Secara umum Arsitektur user interface (UI) pada aplikasi Android adalah user interface
yang meliputi Activity dan user interface yang terdiri dari komponen . semua yang
berhubungan dengan user interface pada aplikasi android biasanya berada pada lokasi
res/layout/filename.xml.dimana coding java untuk memanggilnya yang kita
kenal dengan R.layout.filename.
Secara umum sintaks file ini mempunyai sturuktur sebagai berikut :
<?xml version="1.0" encoding="utf-8"?>
<ViewGroup xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@[+][package:]id/resource_name"
android:layout_height=["dimension" | "fill_parent" | "wrap_content"]
android:layout_width=["dimension" | "fill_parent" | "wrap_content"]
[ViewGroup-specific attributes] >
<View
android:id="@[+][package:]id/resource_name"
android:layout_height=["dimension" | "fill_parent" | "wrap_content"]
android:layout_width=["dimension" | "fill_parent" | "wrap_content"]
[View-specific attributes] >
<requestFocus/>
</View>
<ViewGroup >
<View />
</ViewGroup>
<include layout="@layout/layout_resource"/>
</ViewGroup>

Komponen-komponennya adalah sebagai berikut :

<ViewGroup>
Kumpulan view dimana kita dapat menentukan tata letak komponen view secara
berbeda, seperti LinearLayout, RelativeLayout, FrameLayout,serta
Tabulasi. Atribut dari ViewGroup ini biasaya terdiri dari :

android:id
resource id, yang berisi variabel unik dari element tersebut.

android:layout_height
dimensi valuenya (height) yang diikutinya dengan opsi fill_parent
atau wrap_content, tentunya perbedaan keduanya sudah kita bahas
dalam akhir bab program hello android.

29
User Interface

android:layout_width
dimensi valuenya (width) yang diikutinya dengan opsi fill_parent atau
wrap_content

<View>
Sama seperti <ViewGroup> tetapi <View> lebih di kenal dengan individual
UI component, atributnya juga minimal terdiri dari tiga yang
sama persis dengan atribut yang dimiliki oleh <ViewGroup>.

<requestFocus>
Element kosong yang bisa kita defenisikan di dalam <view>

<include>
Memasukkan file layout ke dalam layout. Atributnya sama dengan <ViewGroup>
dan <View> tetapi ada satu tambahan atribut yaitu <resource> yang berfungsi
untuk menentukan file layoutnya.

AndroidManifest.xml
File AndroidManifest.xml diperlukan oleh setiap aplikasi android, file ini berada pada
folder root aplikasi, File ini mendeskripsikan variabel global dari paket aplikasi yang
kita gunakan, file ini juga berfungsi untuk mendeskripsikan resource apa saja yang akan
digunakan oleh project seperti koneksi internet,sms,mengakses gps,dll.Berikut adalah
contoh file AndroidManifest.xml yang akan kita gunakan dalam program UIcoding.
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.wilis.uicoding1"
android:versionCode="1"
android:versionName="1.0">
<application android:icon="@drawable/icon" android:label="@string/app_name">

<activity android:name=".uicoding1" android:label="@string/app_name">

<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
<uses-sdk android:minSdkVersion="9" />

30
User Interface

</manifest>

Didalam AndroidManifest.xml ini lah berisi semua pendefinisian hal-hal yang

dibutuhkan oleh aplikasi android kita, beberapa elemen yang terdapat di dalam file ini
adalah sebagai berikut :
<manifest>
Titik root utama dari AndroidManifest.xml, berisi atribut package aplikasi serta paket
activity dalam program android kita.
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.wilis.uicoding1"
android:versionCode="1"
android:versionName="1.0">

disini terlihat bahwa package kita adalah com.wilis.uicoding1 beserta version code yang
digunakan.
<uses-permission>
Menjelaskan tentang user permission/security permission yang harus diberikan agar
aplikasi dapat berjalan sebagaimana mestinya misalnya, apabila kita menggunakan
resources yang tersedia dari sistem, seperti ketika mengirim sms, dan sebagainya.
Contoh uses-permisson ini adalah
<uses-permission android.name=android.permission.RECEIVE_SMS/>

<permission>
Menjelaskan batasan tentang user permission/security permission.
<instrumentation>
Mendeklarasikan komponen instrumen yang tersedia untuk menguji fungsionalitas dari
paket aplikasi yang kita gunakan dalam aplikasi android kita.
<application>
Elemen root yang berisi deklarasi aplikasi android kita.
<application android:icon="@drawable/icon">

<intent filter>
Mendeklarasikan intent yang dibutuhkan oleh aplikasi android yang kita gunakan,
atribut-atribut bisa diberikan disini untuk mensupply label,icon,data dan informasi yang
kita gunakan dalam aplikasi android.
<action>
Berisi tentang action type yang didukung oleh komponen-komponen yang berada dalam
aplikasi android.
31
User Interface

<category>
Mendeklarasikan kategory-kategory yang didukung oleh aplikasi android.
<data>
Mendeklarasikan tipe MIME, URL, authority penggunaan URL serta penentuan path
yang digunakan dalam URL.
<meta-data>
Mendeklarasikan meta data yang kita butuhkan sebagai tambahan data yang ada kita
gunakan dalam aplikasi android.
<receiver>
Mendeklarasikan dimana aplikasi kita diberikan informasi mengenai sesuatu perubahaan
atau aksi yang terjadi, seperti menerima SMS.
<service>
Mendeklarasikan komponen yang dapat berjalan sebagai service (berjalan di
background).
<provider>
Mendeklarasikan komponen-komponen yang mengelola data dan mempublikasikannya
untuk dikelola/dipakai oleh aplikasi lain.
<uses-sdk uses-sdk android:minSdkVersion = ?>
Mendeklarasikan skd Android yang digunakan, bisa juga menentukan sdk minimum
yang digunakan. Sampai buku ini ditulis, tersedia kemungkinan nilai minSdkVersion
sebagai berikut :

1 mewakili Android 1.0 SDK

2 mewakili Android 1.1 SDK

3 mewakili Android 1.5 SDK

4 mewakili Android 1.6 SDK

5 mewakili Android 2.0 SDK

6 mewakili Android 2.0 SDK

7 mewakili Android 2.0 Update (2.0.1) SDK

8 mewakili Android 2.2 SDK

9 mewakili Android 2.3 SDK

32
User Interface

10 mewakili Android 2.3.3 SDK

11 mewakili Android 3.0

12 mewakili Android 3.1

13 mewakili Android 3.2

14 mewakili Android 4.0

15 mewakili Android 4.0.1

16 mewakili Android 4.1

17 mewakili Android 4.2.1

18 mewakili Android 4.2.2

19 mewakili Android 4.3

Program UIcoding1
Pada program Uicoding1 ini kita akan coba lihat penerapan dari istilah-istilah yang telah
dijelaskan diatas.
Buatlah project android dengan ketentuan sebagai berikut :
Project Name

: UIcoding1

Buitl Target

: Android 2.3

Application name

: uicoding1

Package name

: com.wilis.uicoding1

Activity

: uicoding1

Min SDK

:9

uicoding1.java
package com.wilis.uicoding1;
import android.app.Activity;
import android.os.Bundle;
public class uicoding1 extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

33
User Interface

setContentView(R.layout.main);

uicoding1.java diatas berarti hanya menampilkan isi dari main.xml, hal itu ditunjukkan
dengan coding setContentView(R.layout.main) , itu berarti user interface
aplikasi dihandle sepenuhnya di main.xml.
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, saya TextView" />
<Button android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, saya Button" />
</LinearLayout>

Didalam main.xml ini terdiri dari dua komponen yaitu TextView dan Button. TextView
berupa tulisan Hello, saya TextView dengan nama variabel id/text serta Button dengan
tulisan Hello, saya Button dengan variabel id/button. Dimana kedua komponen itu
ditampilkan dengan layout wrap_content. Tampilan wrap_content akan membuat
layout untuk elemen tersebut selebar dan setinggi tulisan dari element tersebut, lain
halnya fill_parent akan membuat tulisan mengisi layar secara penuh (layar yang tersedia
space untuk element tersebut.
Perhatikan pemberian nama variabel dari setiap komponen didalam main.xml diawali
dengan tanda @+. Penggunaan LinearLayout akan dibahas di bab bagian Widgets.
string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding1</string>
</resources>

34
User Interface

string.xml cukup berisa satu variabel yaitu variabel app_name, variabel ini dipanggil
oleh melalui coding di file Android.Manifest.xml dengan perintah coding yaitu
android:label="@string/app_name" untuk menampilkan tulisan uicoding1
sebagai tampilan nama aplikasi kita. Sebenarnya kita bisa menghapus file string.xml ini
dengan mengganti nilai langsung pada file Android.Manifest.xml seperti
android:label="uicoding1", dengan begitu file Android.Manifest tidak
membutuhkan string.xml lagi untuk mengisi android.labelnya karena sudah diisi
langsung.
Android.Manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.wilis.uicoding1"
android:versionCode="1"
android:versionName="1.0">
<application android:icon="@drawable/icon"
android:label="@string/app_name">
<activity android:name=".uicoding1"
android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>

package="com.wilis.uicoding1 adalah defenisi package dari aplikasi Uicoding1

kita, anda dapat melakukan perubahan package di file ini, tapi perhatikan apabila anda
melakukan perubahan package, pastikan coding di java juga package ikut di ubah. Ada
buah intent yang umumnya wajib dimiliki oleh aplikasi android yang kita rancang yaitu
action android:name="android.intent.action.MAIN" dan
category android:name="android.intent.category.LAUNCHER".

didalam

Android.Manifest.xml

diatas, tidak kita defenisikan <uses-sdk

android:minSdkVersion= />., anda dapat mendefenisikan ini jika anda
menentukan minimum SDK Android untuk mengeksekusi aplikasi anda. Tetapi target
SDK Android yang dipakai ditentukan di dalam file default.propertis yang berada
didalam file Android.Manifest.xml di dalam project view.
Apabila Aplikasi Uicoding1 dijalankan akan memiliki hasil seperti gambar berikut :

35
User Interface

Gambar 4.1. Program UIcoding1.

Perubahan atau penambahan komponen didalam layout (main.xml) sebenarnya tidak
harus dilakukan dengan coding manual, namun bisa dilakukan dengan visual, artinya
kita dapat mendrag komponen-komponen apa saja yang mau ditambahkan didalam
layout (main.xlm), Caranya adalah dengan mengclick Graphical Layout pada editor
eclipse seperti gambar dibawah ini :

Gambar 4.2. Graphical Layout main.xml uicoding1.

Coba anda tambahkan komponen lain misalnya Button, setelah itu perhatikan coding
main.xml akan otomatis menambahkan coding untuk komponen yang kita tambahkan
36
User Interface

secara visual. Penambahan secara visual untuk pemula sangat membantu dalam
mendesain layout main.xml.
Program Uicoding2
Sekarang kita akan coba perkaya pengetahuan kita mengenai user interface beserta
element-element didalamnya serta bagaimana memanipulasi user interface. Buatlah
project android dengan ketentuan berikut :
Project Name

: UIcoding2

Buitl Target

: Android 2.3

Application name

: uicoding2

Package name

: com.wilis.uicoding2

Activity

: uicoding2

Min SDK

:9

uicoding2.java
package com.wilis.uicoding2;
import android.app.Activity;
import android.os.Bundle;
public class uicoding2 extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=
"http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="wrap_content"

37
User Interface

android:layout_height="wrap_content"
android:text="Element One"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Two"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Three"
/>
</LinearLayout>

Didalam main.xml ada tiga komponen yang semuanya tipenya adalah TextView.
string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding2</string>
</resources>

Apabila Aplikasi Uicoding2 dijalankan akan memiliki hasil seperti gambar berikut :

Gambar 4.3 Program UIcoding2

Program Uicoding3
Buatlah project android dengan ketentuan berikut :
Project Name

: UIcoding3

Buitl Target

: Android 2.3

Application name

: uicoding3

38
User Interface

Package name

: com.wilis.uicoding3

Activity

: uicoding3

Min SDK

:9

uicoding3.java
package com.wilis.uicoding3;
import android.app.Activity;
import android.os.Bundle;
public class uicoding3 extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

main.xml (Layout berubah menjadi RelativeLayout)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android=
"http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="@+id/EL01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element One"
/>
<TextView
android:id="@+id/EL02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Two"
android:layout_below="@id/EL01"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Three"
android:layout_toRightOf="@id/EL02"
/>
</RelativeLayout>

39
User Interface

Dalam main.xml ini perintah untuk menampilkan di layar menggunakan layout_below

dan layout_toRighOf. layout_below artinya berada di bawah variabel yang disebutkan di
dalam layout_below, sementara layout_toRight berada disebelah kanan. Selain kedua
cara layout itu ada beberapa layout yang lain, yaitu :
android:layout_above
android:layout_alignBaseline
android:layout_alignBottom
android:layout_alignLeft
android:layout_alignParentBottom
android:layout_alignParentLeft
android:layout_alignParentRight
android:layout_alignParentTop
android:layout_alignRight
android:layout_alignTop
android:layout_alignWithParentIfMissing
android:layout_centerHorizontal
android:layout_centerInParent
android:layout_centerVertical
android:layout_toLeftOf
silakan anda coba dengan mengganti layout dengan salah satu layout diatas dan
perhatikan perbedaan tampilan layout nya.
string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding3</string>
</resources>

Apabila Aplikasi Uicoding3 dijalankan akan memiliki hasil seperti gambar berikut :

40
User Interface

Gambar 4.4 Program UIcoding3

Program Uicoding4
Buatlah project android dengan ketentuan berikut :
Project Name

: UIcoding4

Buitl Target

: Android 2.3

Application name

: uicoding4

Package name

: com.wilis.uicoding1

Activity

: uicoding4

Min SDK

:9

uicoding4.java
package com.wilis.uicoding4;
import android.app.Activity;
import android.os.Bundle;
public class uicoding4 extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

main.xml (menggunakan AbsoluteLayout)

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android=
"http://schemas.android.com/apk/res/android"

41
User Interface

android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element One"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Two"
android:layout_x="30px"
android:layout_y="30px"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Three"
android:layout_x="50px"
android:layout_y="50px"
/>
</AbsoluteLayout>

Element one ditempatkan tanpa mendefenisikan posisi penempatan text nya,

sementara Eelement two dan Element Three dalam penempatan posisi text nya
menggunakan perintah
android:layout_x="30px"
android:layout_y="30px",
android:layout_x="50px"
android:layout_y="50px"

nilai x dan y sebagai koordinat posisi penempatan text ditentukan. Tentunya, teknik ini
sangat kita butuhkan apabila kita perlu menempatkan posisi text pada posisi yang kita
hitung secara matematis dengan konsep x,y terutama dalam peta dan game.
string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding4</string>
</resources>

42
User Interface

Apabila Aplikasi Uicoding4 dijalankan akan memiliki hasil seperti gambar berikut :

Gambar 4.5. Program UIcoding4

Coba anda ubuh nilai layout_x dan nilai layout_y menjadi nilai 60 element two dan nilai
layout_x dan nilai_layout_y menjadi 90 untuk element three dan lakukan running ulang
project dan perhatikan perbedaan posisi penempatannya.
Program Uicoding5
Buatlah project android dengan ketentuan berikut :
Project Name

: UIcoding5

Buitl Target

: Android 2.3

Application name

: uicoding5

Package name

: com.wilis.uicoding5

Activity

: uicoding5

Min SDK

:9

uicoding5.java
package com.wilis.uicoding5;
import android.app.Activity;
import android.os.Bundle;

43
User Interface

public class uicoding5 extends Activity {

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

main.xml (Menggunakan TableLayout)

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element One A"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element One B"
/>
</TableRow>
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Two A"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Element Two B"
/>
</TableRow>
</TableLayout>

Proses penampilan layout menggunakan konsep Table.

string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding5</string>
</resources>

Apabila Aplikasi Uicoding5 dijalankan akan menghasilkan seperti gambar berikut :

44
User Interface

Gambar 4.6. Program UIcoding5

Program UIcoding6
Buatlah project android dengan ketentuan berikut :
Project Name

: UIcoding6

Buitl Target

: Android 2.3

Application name

: uicoding6

Package name

: com.wilis.uicoding6

Activity

: uicoding6

Min SDK

:9

uicoding6.java
package com.wilis.uicoding6;
import android.app.Activity;
import android.os.Bundle;
public class uicoding6 extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

main.xml (Menggunakan ScrollView)

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android= "http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical">

45
User Interface

<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:text="Login Screen"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<TextView
android:text="Username:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<EditText
android:id="@+id/username"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint =Input Username
/>
<TextView
android:text="Password:"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<EditText
android:id="@+id/password"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:inputType =textPassword
/>
<Button
android:id="@+id/loginbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
/>
<TextView
android:id="@+id/status"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textStyle="normal"
android:text="Enter Username and Password"
/>
</LinearLayout>
</ScrollView>

46
User Interface

string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding6</string>
</resources>

Apabila Aplikasi Uicoding6 dijalankan akan menghasilkan seperti gambar berikut :

Gambar 4.7. Program UIcoding6

Program UIcoding7
Buatlah project android dengan ketentuan berikut :
Project Name

: UIcoding7

Buitl Target

: Android 2.3

Application name

: uicoding7

Package name

: com.wilis.uicoding7

Activity

: uicoding7

Min SDK

:9

uicoding7.java
package com.wilis.uicoding7;
import android.app.Activity;
import android.os.Bundle;
public class uicoding7 extends Activity {
/** Called when the activity is first created. */
@Override

47
User Interface

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

main.xml (LinearLayout)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Enter Text Below"
/>
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="Text Goes Here!"
/>
</LinearLayout>

Ada dua komponen didalam main.xml yaitu komponen TextView yang bertuliskan
Enter Text Below dan komponen EditText yang bertuliskan Text Goes Here!.
string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding7</string>
</resources>

Apabila Aplikasi Uicoding7 dijalankan akan menghasilkan seperti gambar berikut :

Gambar 4.8. Program UIcoding7

48
User Interface

Program UIcoding8
Buatlah project android dengan ketentuan berikut :
Project Name

: UIcoding8

Buitl Target

: Android 2.3

Application name

: uicoding8

Package name

: com.wilis.uicoding8

Activity

: uicoding8

Min SDK

:9

uicoding8.java
package com.wilis.uicoding8;
import
import
import
import

android.app.Activity;
android.os.Bundle;
android.widget.CheckBox;
android.widget.CompoundButton;

public class uicoding8 extends Activity

implements CompoundButton.OnCheckedChangeListener {
CheckBox cb;
@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.main);

cb=(CheckBox)findViewById(R.id.check);
cb.setOnCheckedChangeListener(this);

public void onCheckedChanged(CompoundButton buttonView,boolean

isChecked) {
if (isChecked) {
cb.setText("checkbox : checked");
}
else {
cb.setText("checkbox : unchecked");
}
}
}

main.xml
<?xml version="1.0" encoding="utf-8"?>
<CheckBox xmlns:android="http://schemas.android.com/apk/res/android"

49
User Interface

android:id="@+id/check"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="checkbox : unchecked" />

string.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">uicoding8</string>
</resources>

Apabila Aplikasi Uicoding8 dijalankan akan menghasilkan seperti gambar berikut :

Gambar 4.9 Program UIcoding8

50
User Interface