AND ROI D FAST T RACK

(1)

(2)

Agus Haryanto, MKOM http://agusharyanto.net

@agus_inovator

[email protected] 08551000444 / 089673371119

Juara 2 Indosat M2 Android Application Contest Juara Harapan Kompetisi Android T-Market (Telesindo)

Juara 1 BBDEVID Challenge Blackberry Application (Webworks) Juara 1 AngelHack Blackberry Indonesia

(3)

ANDROID FAST ANDROID FAST TRACK

TRACK

A G U S H A R Y A N T O A G U S H A R Y A N T O

(4)

(5)

Preface...vii

Pengenalan Android...9

Kenalan dengan Android...9

Instalasi Android...10

Project Android pertama...11

Pengenalan User Interface...19

Mengenal Layout...19

Mengenal View...36

Android Database SQLITE...49

SQLITE...49

Kamus Tiga Bahasa (CRUD)...50

Android Google Map...87

Menampilkan Data GPS...87

Menampilkan Map pada Android...95

Menampilkan Direction pada Map...111

Android PHP MySQL...125

CRUD Android PHP Mysql...125

Penutup...151

Semangat...151

Seminar Workshop Android...151

Referensi...152

(6)

Android begitu fenomenal diusianya masih muda sudah mampu mendominasi pasar smartphone dunia. Bagi pengem- bang aplikasi itu adalah pasar yang besar untuk aplikasinya.

Untuk membuat aplikasi android tidaklah sesulit yang dibay- angkan. Syarat utamanya kita harus menguasai dasar java dan konsep object orientedya (OOP). Pada buku Android Fast Track ini akan membahas bagian-bagian penting dalam pembuatan aplikasi Android meliputi Pengenalan dasar pembuatan aplikasi android, pengenalan cara menggunakan database sqlite android, pengenalan cara menggunakan Map API 2 untuk mengembangkan aplikasi android yang menggunakan peta.

Pengenalan cara membuat aplikasi android yang datanya ter- simpan di server

Buku ini tentunya masih jauh dari sempurna. Untuk itu apabila ada masukkan langsung saja email ke [email protected]. Untuk melihat tutorial android lainnya dapat berkunjung ke situs http://agusharyanto.net

Untuk kampus atau sekolah yang berminat mengadakan seminar atau workshop android atau lainnya bisa hubungi saya di email [email protected] ,twitter @agus_inovator atau di 0855-1000-444. Khusus untuk luar kota biaya trans- portasi dan akomodasi ditanggung penyelenggara acara.

(7)

P E N G E N A L A N

A N D R O I D

K

E N A L A N D E N G A N

A

N D R O I D

Sebelum melangkah lebih jauh, alangkah baiknya jika kita mengenal apa itu android. Android adalah Sistem Operasi yang dikem- bangkan dan dipopulerkan oleh Google. Andy Rubin dapat kita sebut sebagai otak utama dibalik OS android ini. Pada awalnya perkemban- gan OS Android ini kurang begitu bagus, Hal ini membuat Google turun tangan dengan turut melahirkan ponsel Google Android per- tama yang legendaris yang dikenal dengan nama Nexus One. Di Nexus One ini Google menunjukkan kemampuan android yang sebenarnya dan hasilnya luar biasa, tanggapan pasar begitu bagus.

Hal inilah yang mendorong minat perusahaan-perusahaan Smarthone bersemangat untuk membuat Smartphone dengan OS Android. Dan hasilnya dapat dilihat saat ini android menguasai pasar Smartphone Dunia dengan dipimpin oleh Samsung dengan seri Galaxynya.

Berikut saya tampilkan data analisis dari Gartner.

1

(8)

Ada Sistem Operasi berarti ada aplikasi yang dapat kita buat di dalamnya. Pada Android Fast Track ini kami mencoba mengenalkan cara membuta aplikasi pada android, disini metode yang diterapkan akan lebih banyak praktek.

I

N S T A L A S I

A

N D R O I D

Sebelum memulai membuat aplikasi android tentunya kita harus mempersiapkan softwarenya terlebih dahulu.

Step Instalaasi :

1. Download Java 1.7 dari oracle.com

http://www.oracle.com/technetwork/java/javase/downloads/j dk7-downloads-1880260.html lalu install.

2. Download Ecliplse Bundle (Eclipse + ADT + Android SDK Plat-

form) dari developer.andorid.com

http://developer.android.com/sdk/index.html#win-bundle 3. Unzip file yang didownload ke direktori yang kita inginkan mis-

alanya “c:\development”

4. Instalasi Selesai. Untuk menjalankannnya, masuk ke direktori eclipse dari file yang diunzip lalu jalankan eclipse

5. Untuk mendownload Platform android lainnya, jalankan SDK- Manager

Untuk Spesifikasi Hardwarenya agar terasa nyaman waktu develop aplikasi sebaikanya gunakan komputer dengan processor core i3 keatas dan memori 4GB

(9)

P

R O J E C T

A

N D R O I D P E R TA M A

Dalam hidup selalu ada yang pertama, demikian juga dengan belajar. Kali ini kita akan membuat project Android Pertama kita.

1. Pada eclipse dibagian toolbar klik New

2. Pada jendela yang tanpil, klik folder Android, lalu pilih An- droid Application Project lalu klik Next

3. Isilah isian pada jendela New Android Application

Field Keterangan

Application Name Nama Aplikasi. Yang akan terlihat pada Icon Launcher Aplikasi.

Project Name Nama Project. Nama Project ini boleh beda dengan nama Aplikasi.

Package Name Nama package aplikasi kita, biasanya diawali dengan domain_organisasi lalu nama aplikasi.

(10)

Misalnya net.agusharyanto.myfirstapp Minimum Required SDK Minimum SDK yang diperbolehkan untuk

menjalankan aplikasi.

Target SDK Target SDK yang akan menjalakan Aplikasi.

Compile With Aplikasi akan di compile dengan SDK versi ini.

Theme Theme yang akan dipakai untuk develop aplikasi.

Klik Next

4. Mucul Jendela untuk mengkonfigurasi project, biarkan saja dengan nilai default. Klik Next

5. Muncul Jendela untuk mengatur Icon dari Aplikasi disini kita harus menyiapkan Icon dengan ukuran 32x32, 48x48, 72x72, 128x128. Jika belum siap klik Next saja.

6. Pada jendela Activity pilih Empty Activity lalu klik Next. Jika ingin pakai Fragment pilih Blank Activity. Karena baru belajar kita pilih yang tanpa Fragment yaitu Empty Activity

7. Pada jendela Empty Activity, kita bisa menentukan nama Activity dan layoutnya, untuk awal kita gunakan suja nilai yang sudah ada (default) lalu klik Finish

Setelah selesai, maka kita sudah berhasil membuat project android dan bisa langsung merun aplikasinya.

Tetapi sebelumnya kita harus memperhatikan beberapa file dan direktori yang ada pada project kita.

(11)

AndroidManifest.xml

Pada file ini konfigurasi projectkita ditentukan, meliputi

• Default Activity yang akan dijalankan pada saat aplikasi dijalankan

(12)

• Daftar Activity dan Service yang akan digunakan dalam aplikasi.

• Datftar Permission

• Minimal SDK yang dapat menjalankan Aplikasi.

• Icon Aplikasi.

src/

Direktori src/ adalah direktori dimana file-file class java aplikasi kita disimpan

res/

Direktory res adalah direktori dimana file-file resource yang berkaitan dengan aplikasi disimpan ada beberapa direktori penting dibawah res/ ini

• layout/ direktori layout adalah tempat untuk menyimpan xml file layout user interface aplikasi.

• values/ direktori values adalah tempat untuk meyimpan file xml resource yang berkaitan dengan xml layout seperti String Defini- tion dan Color Definition

• drawable-***/ adalah direktori untuk menyimpna file-file gam- bar, suara dan lainnya yang digunakan dalam aplikasi.

Setelah kita mengerti, mari kita run projectnya, caranya adalah pada dari menu eclipse pilih Run ----> Run As ----> Android Application

Jika belum ada Emulator AVDnya kita bisa menambahkan melalui menu Window ---> AVD Manager

Terlihat kita sudah berhasil menjalankan project kita.

(13)

Dari mana tulisan “Hello world!”

Yang pertama kita lihat adalah file AndroidManifest.xml

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

<manifest

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

package="net.agusharyanto.myfirstapp"

android:versionCode="1"

android:versionName="1.0" >

<uses-sdk

android:minSdkVersion="8"

android:targetSdkVersion="17" />

(14)

<application

android:allowBackup="true"

android:icon="@drawable/ic_launcher"

android:label="@string/app_name"

android:theme="@style/AppTheme" >

<activity

android:name="net.agusharyanto.myfirstapp.MainActivity

"

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>

Perhatikan disini activity yang dieksekusi pertama kali adalah Main- Activity

Mari kita buka file MainActivity.java package net.agusharyanto.myfirstapp;

import android.os.Bundle;

import android.app.Activity;

import android.view.Menu;

public class MainActivity extends Activity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

(15)

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

getMenuInflater().inflate(R.menu.main, menu);

return true;

} }

Perhatikan activity_main.xml

<RelativeLayout

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

android:layout_width="match_parent"

android:layout_height="match_parent"

android:paddingBottom="@dimen/activity_vertical_margin

"

android:paddingLeft="@dimen/activity_horizontal_margin

"

android:paddingRight="@dimen/activity_horizontal_margi n"

android:paddingTop="@dimen/activity_vertical_margin"

tools:context=".MainActivity" >

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/hello_world" />

</RelativeLayout>

Disini menggunakan relative layout yang didalamnya ada TextView dari sinilah android:text="@string/hello_world"

HelloWorld muncul, buka file string.xml

<string name="app_name">MyFirstApp</string>

<string name="action_settings">Settings</string>

(16)

<string name="hello_world">Hello world!</string>

</resources>

Tugas

Jawablah Pertanyaan-pertanyaan dibwah ini.

1. Apa itu Android ?

2. Apayang membuat anda tertarik belajar membuat aplikasi android ?

3. Apa keuntungan yang didapat jika kita mempunyai kemampuan untuk membuat aplikasi android ?

4. Anda lebih suka bahasa java atau HTML 5 ? 5. Anda suka dengan programming ?

(17)

P E N G E N A L A N U ^{S E R} I N T E R FA C E

Sebelumnya kita sudah belajar membuat aplikasi sederhana pada An- droid. Sekarang kita melangkah ke aplikasi yang lebih menarik, yaitu aplikasi yang sudah menggunakan beberapa object view groups dan view.

M

E N G E N A L

L

^{AY O U T}

Pada Android layout memegang peranan penting terutama pada user interface. Dalam layout biasany didalamnya terdiri dari satu atau lebih objek view sehingga dapatlah disebut Layout adalah View Group.

Ada beberapa layout yang berlaku di android.

Linear Layout

Linear Layout sesuai dengan namanya digunakan untuk menyusun view sacara linear vertical atau horizontal.

Agar Lebih memahaminya mari kita buat satu project yang menggunakan linear layout

2

(18)

1. Buat project baru, isi kan parameter-parameternya seperti dibawah ini

(19)

Field Isi

Application Name BelajarLinearLayout Project Name BelajarLinearLayout

Package Name net.agusharyanto.belajarlayout Minimum Required

SDK

Api 8: Android 2.2 (Froyo)

Target SDK Api 19: Android 4.4 (KitKat) Compile With Holo Light With Dark Action

Bar

Activity Name BelajarLinearLayoutActivity

Layout Name main

2. Buka File activity_main.xml kemudian ketikan kode berikut

<LinearLayout

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

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

android:orientation="vertical"

tools:context="${packageName}.${activityClass}">

<LinearLayout

android:orientation="horizontal"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1">

<TextView

android:text = "Merah"

android:gravity="center_horizontal"

android:background="#aa0000"

android:layout_weight = "1"/>

<TextView

android:text = "Hijau"

android:background="#00aa00"

(20)

android:layout_weight="1"/>

<TextView

android:text = "Biru"

android:background="#0000aa"

<TextView

android:text = "Kuning"

android:background="#aaaa00"

</LinearLayout>

<LinearLayout

android:layout_weight="1">

<TextView

android:text = "Baris Satu"

android:textSize="15pt"

android:layout_weight = "1"/>

< EditText android:id = "@+id/EditText1"

android:text = "Baris Dua"

<Button android:id="@+id/Button1"

android:text = "Baris Tiga"

<TextView

android:text = "Baris Empat"

(21)

</LinearLayout>

Coba perhatikan kita ada tiga tag LinearLayout.

1. LinearLayout yang paling luar android:orientation diset vertical, yang berarti setiap view atau layout yang berada didalamnya akan disusn secara vertical.

2. LinearLayout yang kedua berada didalam LinearLayout yang diluar, android:orientation diset horizontal , yang berarti setiap view atau layout yang berada didalamnya akan disusun secara horizontal

3. Linear Layout yang ketiga juga berada didalam LinearLayout yang diluar, android:orientation diset vertical yang berarti setiap view atau layout yang berada didalamnya akan disusun secara vertical

LinearLayout yang paling luar bisa disebut parent dari LinearLayout yang kedua dan ketiga.

Disini kita juga mulai dikenalkan dengan beberapa tag baru yang masuk kedalam golongan view

Tag Fungsi

TextView Untuk menampilkan Text dalam bentuk label EditText Untuk Menampilkan Inputan Text

Button Digunakan untuk menampilkan button atau tombol.

Diatas juga terlihat properti-properti (Kalau kita biasa dengan HTML ini bisa disebut Atribut dan CSSnya) yang melekat pada masing-masing view.

Property (Atribut) fungsi

(22)

android:id Menetapkan id dari suatu view

android:text Menetapkan isi text yang akan dit- ampilkan

Property (CSS) fungsi

android:textSize Menetapkan besar ukuran huruf android:layout_width Menetapkan lebar dari suatu view android:layout_height Menetapkan tinggi dari suatu view android:layout_weight Menunjukkan berapa banyak ru- ang ekstra dalam LinearLayout akan dialokasikan ke tampilan yang terkait dengan Layout- Params.

android:gravity Menentukan tempat object/view pada suatu layout

Agar lebih memahami fungsi dari property-property diatas cobalah baca javadoc android pada situs developer.andorid.com dan coba rubah nilainya.

3. Buka File MainActivity.java

package net.agusharyanto.belajarandroidlayout;

@Override

protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);

} }

(23)

4. Sekarang Mari kita jalankan projectnya

TableLayout

Yang namanya table pasti ada baris dan kolom, demikian juga dengan TableLayout ini, view yang ada dalam layout ini akan disusun berdasarkan baris dan kolomnya.dimana ada TableLayout maka didalamnya akan ada TableRow

TableRow adalah child dari TableLayout. Setiap Satu TableRow merupakan 1 baris dalam table.

Pusing yang dengan teori, yah sudah kita langsung praktek saja.

(24)

 Masih dengan project yang tadi buat pada directory res/layout buat layout baru dengan nama tablelayout.xml

(25)

(26)

Sacara ototmatis akan membuat file tablelayout.xml difolder layout, Edit file tersebut lalu ketikkan kode berikut

<TableLayout

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

android:stretchColumns="1">

(27)

<TextView

android:text="Nama"

android:padding="3dip"

android:background="#0000AA"/>

<TextView

android:text="Nilai"

android:gravity="right"

android:padding="3dip"

android:background="#0000AA" />

</TableRow>

<TextView

android:text="Agus"

android:padding="3dip" />

<TextView

android:text="90"

</TableRow>

<TextView

android:text="Zainal"

<TextView

android:text="80"

</TableRow>

</TableLayout>

Pada file tablelayout.xml diatas terdapat 1 TableLayout yang did- alamnya 3 TableRow, disetiap TableRow masing-masing mem- punya 2 TextView, dari struktur code diatas maka akan terlihat se- buah table yang mempunyai 3 baris dan 2 kolom.

 buka file MainActivity.java rubah layout yang digunakan un- tuk activity ini menjadi yang semula activity_main menjadi tablelayout

(28)

@Override

setContentView(R.layout.tablelayout);

} }

 Sekarang mari kita run projectnya

Nah Betulkan hasilnya dalam bentuk table dangan 3 baris dan 2 ko- lom.

RelativeLayout

(29)

RelativeLayout sesuai dengan namanya, disini kita dapat menentukan posisi dari suatu view berdasarkan sudut pandang parent atau siblingnya.

Agar lebih mudah dimengerti mari kita mulai lagi codingnya

1. Masih dengan project yang tadi buat pada directory res/layout buat layout baru dengan nama relativelayout.xml caranya sama seperti buat tablelayout diatas hanya pada jendela New Android XML File pada root elementnya pilih RelativeLayout

Pada file relativelayout.xml ketikan kode berikut

<RelativeLayout

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

android:background="#005500"

android:padding="10px" >

(30)

<TextView android:id="@+id/label"

android:text="Isi Pesan:" />

<EditText android:id="@+id/entry"

android:background="@android:drawable/editbox_backgro und"

android:layout_below="@id/label" />

<Button android:id="@+id/kirim"

android:layout_below="@id/entry"

android:layout_alignParentRight="true"

android:layout_marginLeft="10px"

android:text="Kirim" />

<Button android:layout_width="wrap_content"

android:layout_toLeftOf="@id/kirim"

android:layout_alignTop="@id/kirim"

android:text="Cancel" />

</RelativeLayout>

2. Buka file MainActivity.java

@Override

setContentView(R.layout.relativelayout);

} }

(31)

3. Sekarang mari kita run projectnya

AbsoluteLayout

Absolute Layout dapat digunakan untuk meletakkan view sesuai dengan posisi yang kita inginkan.

• Masih dengan project yang tadi buat pada directory res/layout buat layout baru dengan nama absolutelayout.xml

< AbsoluteLayout

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

>

<Button

android:layout_width = "188px"

android:text = "Button"

android:layout_x = "126px"

android:layout_y = "361px"

/>

(32)

<Button

android:layout_width = "113px"

android:text = "Button"

android:layout_x = "12px"

android:layout_y = "361px"

/>

</AbsoluteLayout>

• Buka file MainActivity.java

@Override

setContentView(R.layout.absolutelayout);

} }

• Sekarang mari kita run projectnya

(33)

M

E N G E N A L

V

^{I E W}

Sebelumnya kita telah belajar tentang layout pada android disitu melihat ada TextView, Button dan lain-lain. Nah TextView, Button dan kawan-kawannya itu kalau diandroid disebut sebagai View, View ini adalah komponen-komponen yang membentuk user interface pada aplikasi android.

Kita bisa mengelompokkan view ini dalam beberapa group.

• Basic Views, biasanya ini yang umum atau sering digunakan seperti TextView, EditText dan Button

• Picker Views, biasanya berupa pilihan untuk menginputkan Date dan Time seperti DatePicker dan TimePicker.

• List Views, biasanya menampilkan daftar pilihan yang panjang seperti ListView dan Spinner View

• Display Views – view yang digunakan untuk menampilkan gambar seperti Gallery dan ImageSwitcher views.

(34)

• Menus – views yang menampilkan tambahan menu ataupun context menu

• Additional Views seperti AnalogClock dan DigitalClock

Basic View

Pada Seksi ini, kita akan membahas basic view pada android, untuk meudahkan saya akan menjelaskanya dalam bentuk table

 TextView

 EditText

 Button

 ImageButton

 CheckBox

 ToggleButton

 RadioButton

 RadioGroup

Widget Fungsi

TextView sama seperti label pada SWING, yaitu untuk menampilkan tulisan dilayar.

EditText sama seperti TextBox pada SWING, yaitu untuk user menginputkan data

Button Sama seperti Button pada SWING yaiu sebagai Trigger untuk menjalankan suatu Fungsi

ImageButton Sama fungsinya seperti Button, Bedanya Button ini didalamnya ada gambarnya CheckBox Digunakan apabila ada pertanyaan pili-

han yang jawabannya bisa lebih dari satu Radio Button Biasanya digunakan untuk pilihan yang

jawabannya 1

Radio Group Kumpulan dari Radio Button

(35)

Sekarang mari kita coba gunakan view-view diatas kedalam aplikasi.

1. Buat New Android Projectnya

(36)

2. edit file activity_main.xml

<LinearLayout

>

<Button android:id="@+id/btnSave"

android:text="Save"

/>

<Button android:id="@+id/btnOpen"

android:text="Open"

/>

<ImageButton android:id="@+id/btnImg1"

android:src="@drawable/ic_launcher"

/>

<EditText android:id="@+id/txtName"

/>

<CheckBox android:id="@+id/chkAutosave"

android:text="Autosave"

/>

<CheckBox android:id="@+id/star"

style="?android:attr/starStyle"

/>

<RadioGroup android:id="@+id/rdbGp1"

(37)

>

<RadioButton android:id="@+id/rdb1"

android:text="Option 1"

/>

<RadioButton android:id="@+id/rdb2"

android:text="Option 2"

/>

</RadioGroup>

<ToggleButton android:id="@+id/toggle1"

/>

</LinearLayout>

(38)

Perhatikan atribut id yang mewakili identitas dari setiap view. Un- tuk mendeklarasikan id pada sebuah view harus diawali dengan

“@+id/” diikuti dengan nama yang ingin kita berikan 3. Sekarang mari kita jalankan projectnya

Coba kita sentuh beberapa view, hasilnya ada yang seperti ini

(39)

Tetapi tentunya kita tidak ingin hanya ditampilan saja yang berubah.

Tentunya kita ingin program juga dapat menangkap apa yang terjadi pada user Interface.

Untuk itu mari kita buka otak dari project kita, yaitu file Main- Activity.java

package net.agusharyanto.basicview;

import android.view.View;

(40)

import android.widget.Button;

import android.widget.CheckBox;

import android.widget.RadioGroup;

import

android.widget.RadioGroup.OnCheckedChangeListener;

import android.widget.Toast;

import android.widget.ToggleButton;

@Override

public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);

setContentView(R.layout.main);

//---Button view---

Button btnOpen = (Button) findViewById(R.id.btnOpen);

btnOpen.setOnClickListener(new View.OnClickListener() {

public void onClick(View v) {

Toast.makeText(getBaseContext(), "You have clicked the Open button",

Toast.LENGTH_SHORT).show();

} });

Button btnSave = (Button) findViewById(R.id.btnSave);

btnSave.setOnClickListener(new View.OnClickListener()

{

DisplayToast("You have clicked the Save button");

} });

//---CheckBox---

CheckBox checkBox = (CheckBox) findViewById(R.id.chkAutosave);

checkBox.setOnClickListener(new View.OnClickListener()

{

(41)

if (((CheckBox)v).isChecked()) DisplayToast("CheckBox is checked");

else

DisplayToast("CheckBox is unchecked");

} });

//---RadioButton---

RadioGroup radioGroup = (RadioGroup) findViewById(R.id.rdbGp1);

radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener()

{

public void onCheckedChanged(RadioGroup group, int checkedId) {

//---displays the ID of the RadioButton that is checked---

DisplayToast(Integer.toString(checkedId));

} });

//---ToggleButton---

ToggleButton toggleButton = (ToggleButton) findViewById(R.id.toggle1);

toggleButton.setOnClickListener(new View.OnClickListener()

{

if (((ToggleButton)v).isChecked()) DisplayToast("Toggle button is On");

else

DisplayToast("Toggle button is Off");

} });

}

private void DisplayToast(String msg) {

Toast.makeText(getBaseContext(), msg,

(42)

} }

Oke mari kita perhatikan code by codenya Button btnOpen = (Button) findViewById(R.id.btnOpen);

btnOpen.setOnClickListener(new View.OnClickListener() {

Toast.makeText(getBaseContext(), "You have clicked the Open button",

} });

Agar sebuah view bisa kita manipulasi (merubah isi, atau menangkap event) perlu didaftarkan di code activity.

Contoh diatas kita mendaftarkan View (Button) dengan id bt- nOpen kedalam sebuah variable btnOpen. setelah itu kita bisa me- nambahkan listener pada button tersebut, kalau pada code diatas yang kita daftarkan adalah setOnClickListener. Efek yang terjadi adalah apabila btnOpen diklik maka akan mengeksekusi perintah yang ada pada method onClick. Pada kode diatas akan menampilkan popup informasi dalam bentuk Toast

Untuk Button lainnya dan view lainnya silahkan dicoba sendiri.

Dan perhatikan pada method setOnclick dari masing-masing view.

(43)

Tugas

Kerjakan tugas-tugas dibawah ini

1. Buatlah aplikasi kalkulator sederhana yang fungsinya menghi- tung dua bilangan seperti dibawah ini

(44)

(45)

(46)

A N D R O I D D ATA B A S E

SQLITE

Sebelumnya kita sudah belajar membuat aplikasi sederhana pada Android, nah sekarang mari kita buat aplikasi yang lebih keren, aplikasi yang menggunakan database SQLite.

SQLITE

Seperti telah dijelaskan diatas database pada android menggunakan SQLite. Dengan SQLite untuk insert, update dan query data dapat dilakukan dengan syntak SQL.

Untuk itu sebelum melangkah pembuatan aplikasi Android yang memanfatkan firtur SQlite databasenya, kita harus menguasai cara menggunakan SQLite.

Sama seperti database lainnya syntak SQLnya terbagi 2 kategori yaitu syntak untuk Data Definition Language (DDL) dan Data Manip- ulation Language (DML). Bagi yang pernah belajar database pasti tidak asing dengan kedua istilah tersebut.

Sekarang ada pertanyaan nih apa beda DDL dan DML ?

3

(47)

Biar mudah dipahami, kalau database itu kita ibaratkan sebuah rumah, maka DDL itu adalah syntax untuk membuat rumah, menam- bah kamar, merubah bangunan rumah, makanya yang termasuk syntak-syantak DDL adalah create table, alter table, drop table.

sedangkan DML adalah syntax untuk mengetahui isi rumah, siapa saja penghuninya, berapa jumlahnya, ada berapa yang pria dan yang wanita, adakah anak-anak dirumah itu.

Makanya yang termasuk syntak-syntak DML adalah insert, update, delete, select

Untuk mengetahui lebih lanjut tentang sqlite bisa kunjungi SQL- ite Home Page

K

^{A M U S}

T

^{I G A}

B

^{A H A S A}

(CRUD)

Sekarang mari kita buat project yang menggunakan database sqlite di android. Dulu sebelum pakai android dihandphone yang dulu pasati pernah install kamus inggris Indonesia, yang kita gunakan untuk mencari terjemahan suatu kata dalam bahasa indonesia ke bahasa inggris dan jerman. Sebetulnya diandroid juga sudah ada yang buat. Tetapi tentunya akan lebih puas jika kita buat sendiri.

Goal dari Aplikasi ini adalah untuk memahami CRUD dbsqlite pada Android.

Berikut langkah-langkahnya

1. Buat project baru android dengan nama Kamus

(48)

2. Buat Class baru dengan nama DatabaseHelper.java package net.agusharyanto.kamus;

import android.content.ContentValues;

import android.content.Context;

import android.database.sqlite.SQLiteDatabase;

import android.database.sqlite.SQLiteOpenHelper;

public class DatabaseHelper extends SQLiteOpenHelper { private static final String DATABASE_NAME =

"dbkamus";

public static final String INGGRIS= "inggris";

public static final String INDONESIA =

"indonesia";

public static final String JERMAN = "JERMAN";

//Constructor DataKamus untuk initiate database

(49)

public DatabaseHelper(Context context) { super(context, DATABASE_NAME, null, 1);

}

//method createTable untuk membuat table kamus public void createTable(SQLiteDatabase db){

db.execSQL("DROP TABLE IF EXISTS kamus");

db.execSQL("CREATE TABLE if not exists kamus (_id INTEGER PRIMARY KEY AUTOINCREMENT, " +

"inggris TEXT, indonesia TEXT, jerman TEXT);");

}

//method generateData untuk mengisikan data ke kamus.

public void generateData(SQLiteDatabase db){

ContentValues cv=new ContentValues();

cv.put(INGGRIS, "run");

cv.put(INDONESIA, "lari");

cv.put(JERMAN, "laufen");

db.insert("kamus", INGGRIS, cv);

cv.put(INGGRIS, "walk");

cv.put(INDONESIA, "jalan");

cv.put(JERMAN, "gehen");

db.insert("kamus", INDONESIA, cv);

cv.put(INGGRIS, "read");

cv.put(INDONESIA, "membaca");

cv.put(JERMAN, "lesen");

db.insert("kamus", JERMAN, cv);

}

@Override

public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {

// TODO Auto-generated method stub createTable(db);

generateData(db);

}

@Override

public void onCreate(SQLiteDatabase db) { // TODO Auto-generated method stub //Toast.makeText(getBaseContext(),

"Oncreate", Toast.LENGTH_SHORT).show();

createTable(db);

(50)

generateData(db);

} }

Pada class inilah database dibuat dengan nama dbkamus, disini table juga dibuat dengan nama kamus dan diisikan dengan beberapa data.

3. Edit file activity_main.xml pada direktori res/layout lalu ketikan kode berikut

<LinearLayout

android:orientation="vertical" >

<TextView

android:text="Kamus Inggris Indonesia Jerman"

/>

<TextView

android:id="@+id/TextView01"

android:text="Inggris :" >

</TextView>

<EditText

android:id="@+id/txtInggris"

android:text="" >

</requestFocus>

</EditText>

<Button

android:id="@+id/btnTerjemah"

(51)

android:onClick="getTerjemahan"

android:text="Terjemahkan" >

</Button>

<TextView

android:text="Indonesia :" >

</TextView>

<EditText

android:id="@+id/txtIndonesia"

android:editable="false"

android:text="" >

</EditText>

<TextView

android:id="@+id/textView1"

android:text="Jerman" >

</TextView>

<EditText

android:id="@+id/txtJerman"

android:layout_height="wrap_content" >

</EditText>

</LinearLayout>

Disini untuk user interface menggunakan linear layout yang didalamnya ada tiga edit text dan satu button

4. Edit file MainActivity.java yang ada apada direktori src/ lalu ketikan kode berikut

package net.agusharyanto.kamus;

import android.database.Cursor;

(52)

import android.widget.EditText;

private SQLiteDatabase db = null;

private Cursor kamusCursor = null;

private EditText txtInggris;

private EditText txtIndonesia;

private EditText txtJerman;

private DatabaseHelper datakamus = null;

public static final String INGGRIS = "inggris";

"indonesia";

/** Called when the activity is first created.

*/

@Override

public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);

datakamus = new DatabaseHelper(this);

db = datakamus.getWritableDatabase();

txtInggris = (EditText) findViewById(R.id.txtInggris);

txtIndonesia = (EditText) findViewById(R.id.txtIndonesia);

txtJerman = (EditText) findViewById(R.id.txtJerman);

}

public void getTerjemahan(View view) { String bhsindonesia = "";

String bhsjerman="";

String englishword = txtInggris.getText().toString();

kamusCursor = db.rawQuery("SELECT _ID, INGGRIS, INDONESIA, JERMAN "

+ "FROM kamus where INGGRIS='"

+ englishword

+ "' ORDER BY INGGRIS", null);

if (kamusCursor.moveToFirst()) {

(53)

for (; !kamusCursor.isAfterLast();

kamusCursor.moveToNext()) {

bhsindonesia = kamusCursor.getString(2);

bhsjerman = kamusCursor.getString(3);

} }else{

Toast.makeText(getBaseContext(),

"Terjemahan Tidak ditemukan", Toast.LENGTH_SHORT).show();

}

txtIndonesia.setText(bhsindonesia);

txtJerman.setText(bhsjerman);

}

@Override

public void onDestroy() { super.onDestroy();

try {

kamusCursor.close();

db.close();

}catch (Exception e){

} }

}

(54)

Pada isian Inggris ketikan run lalu klik button Terjemahkan.

Coba isi inggris diisi dengan sepatu lalu klik Terjemahkan Coba inggris tidak diisi lalu klik Terjemahkan

6. Oke kita sudah berhasil membuat kamus, sekarang kita ingin menampilkan kata-kata dalam database kedalam list.

7. Buat Layout baru dengan nama row.xml lalu ketikan kode berikut

<RelativeLayout

(55)

android:orientation="horizontal"

android:paddingBottom="5sp"

android:paddingTop="5sp" >

< TextView

android:id="@+id/inggris"

android:layout_width="100sp"

android:layout_alignParentLeft="true" />

< TextView

android:id="@+id/indonesia"

android:layout_toRightOf="@+id/inggris" />

< TextView

android:id="@+id/jerman"

android:layout_toRightOf="@+id/indonesia" />

</RelativeLayout>

8. Buat Layout baru dengan nama daftarkata.xml lalu ketikan kode berikut

<RelativeLayout

android:layout_height="match_parent" >

<TextView

android:layout_alignParentLeft="true"

android:layout_alignParentTop="true"

android:text = "Inggris"

android:textSize="20sp" />

<TextView

(56)

android:layout_toRightOf="@+id/textView1"

android:text = "Indonesia"

<TextView

android:layout_toRightOf="@+id/textView2"

android:text = "Jerman"

<ListView android:id="@+id/list1"

android:layout_weight = "1"

android:layout_alignParentLeft="true"

android:layout_below="@+id/textView1"/>

</RelativeLayout>

9. Buat Class baru dengan nama Daftarkata.java lalu ketikkan kode berikut.

import android.content.Context;

import android.database.Cursor;

import android.util.Log;

import android.view.LayoutInflater;

import android.view.ViewGroup;

import android.widget.ListView;

import android.widget.SimpleCursorAdapter;

(57)

import android.widget.TextView;

public class DaftarKata extends Activity { private DatabaseHelper dbhelper;

private SQLiteDatabase db = null;

private ListView listContent = null;

private Cursor kamusCursor = null;

CustomCursorAdapter adapter;

/** Called when the activity is first created. */

@Override

dbhelper = new DatabaseHelper(this);

setContentView(R.layout.daftarkata);

listContent = (ListView) findViewById(R.id.list1);

isDataListView();

}

private void isDataListView() { try {

db = dbhelper.getWritableDatabase();

kamusCursor = db.query("kamus", new String[] { "_id", "inggris",

"indonesia", "jerman" },

"_id>0", null, null, null, null);

// startManagingCursor( jasaCursor);

/*

* Create an array to specify the fields we want to display in the

* list (only the

'inggris,indonesia,jerman' column in this case) */

String[] from = new String[] {

"inggris", "indonesia", "jerman" };

/*

* and an array of the fields we want to bind those fieiplds to (in

(58)

* this case just the textView 'inggris,indonesia,jerman' from our new row.xml

* layout above) */

int[] to = new int[] { R.id.inggris, R.id.indonesia, R.id.jerman };

/* Now create a simple cursor adapter.. */

adapter = new

CustomCursorAdapter(this, R.layout.row, kamusCursor, from, to);

// listView.setAdapter(adapter);

listContent.setAdapter(adapter);

} catch (Exception e) { e.printStackTrace();

} finally {

if (db != null && db.isOpen()) { db.close();

} }

}

@Override

try {

kamusCursor.close();

} catch (Exception e) { }

}

protected class CustomCursorAdapter extends SimpleCursorAdapter {

private int layout;

private LayoutInflater inflater;

private Context context;

public CustomCursorAdapter(Context context,

(59)

int layout, Cursor c,

String[] from, int[] to) { super (context, layout, c, from, to);

this.layout = layout;

this.context = context;

inflater = LayoutInflater.from(context);

}

@Override

public View newView(Context context, Cursor cursor, ViewGroup parent) {

Log.d("NewView", "*****xxx");

View v =

inflater.inflate(R.layout.row, parent, false);

return v;

}

@Override

public void bindView(View v, Context context, Cursor c) {

// 1 is the column where you're getting your data from

String inggris = c.getString(1);

String jerman = c.getString(3);

String indonesia = c.getString(2);

/**

* Next set the name of the entry.

*/

TextView name_text = (TextView) v.findViewById(R.id.inggris);

TextView des_text = (TextView) v.findViewById(R.id.jerman);

TextView id_text = (TextView) v.findViewById(R.id.indonesia);

des_text.setText(jerman);

id_text.setText(indonesia);

if (name_text != null) {

name_text.setText(inggris);

}

(60)

} }

}

10. Rubah bagian yang bercetak tebal pada AndroidManifest.xml

<manifest

package="net.agusharyanto.kamus"

<uses-sdk

<application

<activity

android:name="net.agusharyanto.kamus.DaftarKata"

<intent-filter>

<action

<category

</intent-filter>

</activity>

</application>

</manifest>

11. Sekarang mari kita Run projectnya.

(61)

12. Kita sudah sukses menampilkan daftar kata, selanjutnya kita akan menyedian form untuk menambahkan kata.

13. Buat layout baru dengan nama tambahkata.xml selanjutnya ketikan kode berikut

<LinearLayout

(62)

<TextView

android:text = "Kamus Inggris Indonesia Jerman"

/>

<TextView

android:text = "Inggris :" >

</TextView>

< EditText

android:id="@+id/txtInggris"

android:text="" >

</EditText>

<TextView

android:text = "Indonesia :" >

</TextView>

< EditText

android:id="@+id/txtIndonesia"

android:text="" >

</EditText>

<TextView

android:text = "Jerman" >

</TextView>

< EditText

android:id="@+id/txtJerman"

(63)

android:layout_height="wrap_content" >

</EditText>

<Button

android:id="@+id/btnTerjemah"

android:onClick="saveData"

android:text = "Save Data" >

</Button>

</LinearLayout>

14. Buat class baru dengan nama TambahKata.java package net.agusharyanto.kamus;

import android.content.ContentValues;

import android.widget.EditText;

public class TambahKata extends Activity{

private SQLiteDatabase db = null;

private EditText txtInggris;

private EditText txtIndonesia;

private EditText txtJerman;

private DatabaseHelper datakamus = null;

public static final String INGGRIS= "inggris";

"indonesia";

public static final String JERMAN = "JERMAN";

datakamus = new DatabaseHelper(this);

db = datakamus.getWritableDatabase();

setContentView(R.layout.tambahkata);

txtInggris = (EditText) findViewById(R.id.txtInggris);

(64)

txtIndonesia = (EditText) findViewById(R.id.txtIndonesia);

txtJerman = (EditText) findViewById(R.id.txtJerman);

}

public void saveData(View view) { String bhsindonesia = txtIndonesia.getText().toString();;

String bhsjerman=

txtJerman.getText().toString();

String englishword = txtInggris.getText().toString();

ContentValues cv=new ContentValues();

cv.put(INGGRIS, englishword);

cv.put(INDONESIA, bhsindonesia);

cv.put(JERMAN, bhsjerman);

if (db.insert("kamus", INGGRIS, cv)>0){

"Save Data Success", Toast.LENGTH_SHORT).show();

}else{

"Save Data Fail", Toast.LENGTH_SHORT).show();

}

@Override

db.close();

} }

15. Rubah AndroidManifest.xml yang bercetak tebal

<manifest

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

(65)

oid"

<uses-sdk

<application

<activity

android:name="net.agusharyanto.kamus.TambahKata"

<intent-filter>

<action

<category

</intent-filter>

</activity>

</application>

</manifest>

16. Sekarang mari kita run projectnya.

(66)

17. Bagaimana melihat hasilnya ? apa harus rubah AndroidMani- fest.xml. Cara yang lebih baik adalah dengan membuat menu yang dapat mengakses form Terjemahan, Daftar Kata dan Tambah Kata 18. Buat Class baru dengan nama MenuActivity.java lalu ketikkan kode berikut

import android.app.ListActivity;

import android.content.Intent;

(67)

import android.widget.ArrayAdapter;

import android.widget.ListView;

public class MenuActivity extends ListActivity { String[] menuutama = new String[] { "Terjemah Kata", "Tambah Kata",

"Daftar Kata", "Keluar Aplikasi" };

public void onCreate(Bundle icicle) { super.onCreate(icicle);

// Menset nilai array ke dalam list adapater sehingga data pada array

// akan dimunculkan dalam list this.setListAdapter(new

ArrayAdapter<String>(this,

android.R.layout.simple_list_item_1, menuutama));

}

@Override

/**method ini akan mengoveride method onListItemClick yang ada pada class List Activity

* method ini akan d1ipanggil apabilai ada salah satu item dari list menu yang dipilih

*/

protected void onListItemClick(ListView l, View v, int position, long id) {

super.onListItemClick(l, v, position, id);

// Menangkap nilai text yang dklik Object o =

this.getListAdapter().getItem(position);

String pilihan = o.toString();

// Menampilkan hasil pilihan menu dalam bentuk Toast

tampilkanPilihan(pilihan);

}

protected void tampilkanPilihan(String pilihan) { try {

//Intent digunakan untuk sebagai pengenal suatu activity

Intent i = null;

(68)

if (pilihan.equals("Terjemah Kata")) {

i = new Intent(this,MainActivity.class);

} else if (pilihan.equals("Tambah Kata")) {

i = new Intent(this, TambahKata.class);

} else if (pilihan.equals("Daftar Kata")) {

i = new Intent(this, DaftarKata.class);

} else if (pilihan.equals("Keluar Aplikasi")) {

finish();

} else {

Toast.makeText(this,"Anda Memilih: " + pilihan + " , Actionnya belum dibuat", Toast.LENGTH_LONG).show();

}

startActivity(i);

} catch (Exception e) { e.printStackTrace();

} }

}

19. Pada AndroidManifest.xml rubah dan tambahkan yang bercetak tebal

<manifest

<uses-sdk

<application

(69)

<activity

android:name="net.agusharyanto.kamus.MenuActivity"

<intent-filter>

<action

<category

</intent-filter>

</activity>

<activity android:name="MainActivity"

android:label="Terjemah Kata">

</activity>

<activity android:name="DaftarKata"

android:label="Daftar Kata">

</activity>

<activity android:name="TambahKata"

android:label="Tambah Kata">

</activity>

</application>

</manifest>

(70)

Klik masing-masing menu.

21. Sekarang kita melangkah kebagian Rubah data dan Hapus data.

Pasti kita memikirkan bagaiman cara menempatkan Edit dan Hapus ini. Aha kita letakan saja di DaftarKata. Jadi ketika satu baris kata di klik lama (long click) akan memunculkan menu edit dan hapus.

22. Buka file String.xml pada direktori value ketikan kode berikut

<string name="app_name">Kamus</string>

<string name="action_settings">Settings</string>

<string name="hello_world">Hello world!</string>

(71)

<string name="save">Simpan</string>

<string name="cancel">Cancel</string>

<string name="add_title">Edit Kamus</string>

<string name="delete_title">Hapus Kamus, And yakin ?</string>

</resources>

23. Tambahkan layout untuk edit data beri nama edit.xml

<LinearLayout

<TextView

android:text = "Inggris :" >

</TextView>

< EditText

android:id="@+id/inggris"

android:text="" >

</EditText>

<TextView

android:text = "Indonesia :" >

</TextView>

< EditText

android:id="@+id/indonesia"

android:text="" >

AND ROI D FAST T RACK

ANDROID FAST ANDROID FAST TRACK

TRACK

P E N G E N A L A N

A N D R O I D

K

A

1

I

A

P

A

P E N G E N A L A N U S E R I N T E R FA C E

M

L

2

M

V

Coba kita sentuh beberapa view, hasilnya ada yang seperti ini

A N D R O I D D ATA B A S E

SQLITE

SQLITE

3

K

T

B

(CRUD)

P E N G E N A L A N U ^{S E R} I N T E R FA C E