MODUL PDF

Preview

Summary

Pertemuan 1 Android Introduction A. Materi  Android Introduction B. Kompetensi Dasar  Mengenal android  Mengenal lingkungan pemrograman Android  Instalasi SDK Android  Setting SDK Android di Android Studio  Membuat program android sederhana C. Tujuan  Mahasiswa mengenal dan memahami android...

Description

Accelerat ing t he world's research.

MODUL Bunga Nanda modul

Cite this paper

Downloaded from Academia.edu 

Get the citation in MLA, APA, or Chicago styles

Related papers

Download a PDF Pack of t he best relat ed papers 

Pertemuan 1 Android Introduction A. Materi  Android Introduction B. Kompetensi Dasar  Mengenal android  Mengenal lingkungan pemrograman Android  Instalasi SDK Android  Setting SDK Android di Android Studio  Membuat program android sederhana C. Tujuan  Mahasiswa mengenal dan memahami android  Mahasiswa mampu melakukan installasi IDE Android  Mahasiswa mampu membuat program sederhana di android D. Dasar Teori 1. Sejarah Android Android adalah sebuah software platform dan sistem operasi untuk mobile device. Sistem operasi Android berbasis linux yang memungkinkan untuk menulis kode dalam bahasa pemrograman java. Awalnya Android dikembangkan oleh Android, Inc. dengan pendirinya Rubin, Miner dan Whiite. Pada tanggal 17 Agustus 2005 Google mengakuisisi Android Inc., menjadikannya sebagai anak perusahaan yang sepenuhnya dimiliki oleh Google. Pada akhir 2007 OHA berdiri dan bergabung bersama dalam pengembangan Android. Pada November 2007 diumumkan pembukaan dari Android platform

2. Diagram Arsitektur Android Diagram arsitektur android bisa dilihat pada Gambar 1.1. Pada arsitekur android terdapat empat layer, diantaranya layer application, application framework, libraries dan linux kernel.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

1

Gambar 1.1. Diagram Arsitektur Android Layer application adalah layer yang berhubungan langsung dengan aplikasi – aplikasi inti yang berjalan di android. Aplikasi – aplikasi tersebut diantaranya email, sms, calendar, maps, browser, contact dsb. Pada layer application framework aplikasi-aplikasi android berjalan pada layer ini. Developer menggunakan komponen-komponen yang ada di layer ini untuk membuat aplikasi. Pada layer libraries ditulis dalam bahasa C. Pada libraries terdapat pustaka-pustaka diantaranya : – – – – –

Media Library untuk memutar dan merekam berbagai macam format audio dan video. Surface Manager untuk mengontrol akses tampilan sistem dan suport 2D dan3D. SQLite untuk mengatur relasi database yang digunakan pada aplikasi. WebKit&SSL library untuk dukungan browser & keamanan internet FreeType library bertanggung jawab untuk dukungan font

Di dalam libraries terdapat Android runtime yang bertanggung jawab supaya aplikasi – aplikasi android bisa berjalan di perangkat mobile. Sedangkan android runtime sendiri dibedakan menjadi dua, Core Libraries dan Dalvix Virtual Machine. Core libraries merupakan interpreter java sedangkan Dalvix Virtual Machine adalah interpreter untuk mengeksekusi file dalam format Dalvix Executable (*.dex). file dalam format *.dex ini akan di load pada Dalvix virtual machine untuk dijalankan di sistem operasi Linux. Sehingga kemudian aplikasi mampu dijalankan. Android dibangun diatas kernel 2.6 yang menangani beberapa servis diataranya manajemen memori dan proses, jaringan, driver dan keamanan.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

2

3. Installasi IDE Android Studio a. Langkah pertama untuk installasi Android Studio kita harus menginstall Java SDK. Apabila komputer anda belum terinstall Java SDK bisa mendownload terlebih dahulu pada http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html. Klik installer Java SDK

b. Download installer Android https://developer.android.com/sdk/index.html. Klik installer android studio

Studio

pada

c. Akan muncul jendela Android Studio Setup seperti pada Gambar 1.2. Klik next

Gambar 1.2. Android Studio Setup Pada jendela Choose component Gambar 1.3. pilih semua komponen. Kemudian klik next.

Gambar 1.3. Choose component android studio setup

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

3

Kemudian akan muncul jendela license agreement klik I Agree. Pada jendela Configuration Setting seperti Gambar 1.4., isikan folder android studio dan SDK installation, klik next. Dan pilih 512MB pada Gambar 1.5. Klik next

Gambar 1.4. Install Location android studio setup

Gambar 1.5. Emulator setup

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

4

Gambar 1.6. Create Android Studio Shortcuts Pada Gambar 1.6. pilih install. Tunggu beberapa saat sampai installation complete, setelah itu klik next. Selanjutnya adalah proses downloading component dari internet. Tunggu sampai selesai . Setelah selesai klik finish.

Gambar 1.7. Downloading component Pada Gambar 1.7. terihat bahwa setelah proses installasi selesai otomatis telah terbuat Android Virtual Devise Nexus_5_API_21_x86. d. IDE Software Android Studio siap untuk digunakan membuat aplikasi-aplikasi android

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

5

4. Membuat Project Baru Buka Android Studio yang telah anda install sebelumnya. Pilih Start a new Android Studio project seperti pada Gambar 1.8.

Gambar 1.8. Memulai membuat projek baru Akan keluar jendela seperti pada Gambar 1.9. Isikan field text yang ada seperti Gambar 1.9.

Gambar 1.9. Memberi nama projek baru Pilih project location, project location adalah tempat anda menyimpan project yang akan dibuat. Kemudian klik next

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

6

Muncul jendela seperti pada Gambar 1.10. klik phone and tablet klik next. Akan keluar jendela baru seperti pada Gambar 1.11. pilih blank activity. Klik next.

Gambar 1.10. Memilih device yang menjalankan aplikasi

Gambar 1.11. Menambahkan activity Setelah membuat activity akan diminta untuk mengisikan nama dari activity tersebut, isikan seperti Gambar 1.12. Klik finish.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

7

Gambar 1.12. Memberi nama activity Project baru sudah selesai kita buat. Buka app-> res-> layout-> activity_main.xml android studio akan terlihat seperti Gambar 1.13.

Gambar 1.13. Tampilan IDE Android Studio Project pertama anda telah terbuat. Yaitu sebuah aplikasi yang bertuliskan “Hello World!”. Jalankan aplikasi pertama dengan cara pilih Run pada toolbar -> run app. Akan mucul jendela seperti Gambar 1.14., Pilih running device bila ada emulator yang telah berjalan. Atau pilih Launch emulator apabila belum ada emulator yang berjalan. Pada combo box pilih AVD (Android Virtual Device). Bila belum ada buat terlebih dahulu ( Tutorial pada point 2 ). Kemudian klik OK.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

8

Gambar 1.14. Memilih emulator

Gambar 1.15. Launch aplikasi di emulator Android Pada Gambar 1.15. terlihat tulisan “Hello World!” telah tampil pada emulator Anda juga bisa running aplikasi menggunakan android device. Hubungkan android device dengan PC menggunakan kabel USB. Pilih USB Debugging. Run Project maka akan tampil seperti Gambar 1.16.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

9

Gambar 1.16. Memilih running device Pada Gambar 1.16 terlihat running device adalah HP LG Android, karena pada tutorial ini menjalankan project yang dibuat pada HP tersebut. Apabila HP anda tidak terdetect anda bisa mengikuti tutorial android developer pada url berikut ini : http://developer.android.com/sdk/win-usb.html http://developer.android.com/tools/device.html 5. Membuat Android Virtual Device Setelah selesai mengerjakan project, project bisa dirunning langsung dengan HP atau bila tidak memiliki bisa menggunakan AVD.. Berikut adalah cara untuk membuat AVD : Pada toolbar klik tools -> Android -> AVD Manager. Akan muncul jendela seperti Gambar 1.17. Pilih Create Virtual Device.

Gambar 1.17. Membuat Android Virtual Device

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

10

Gambar 1.18. Memiliki spesifikasi Android Virtual Device Disini pilih device yang akan digunakan sebagai emulator. Klik next pilih versi android dari AVD seperti Gambar 1.18.. Klik next, Kemudian akan muncul jendela verify configuration, pada button paling bawah klik show Advanced Setting. Otomatis akan muncul seperti pada Gambar 1.19. Isikan 512 untuk RAM AVD. Klik Finish.

Gambar 1.19. Memilih besar RAM AVD Apabila ketika di running terdapat error HAXM not installer maka terlebih dahulu harus menginstall driver ini. Caranya klik tools -> Android -> SDK Manager. Pada SDK Tools centang Intel x86 Emulator Accelerator. Klik Install. Cari driver tersebut pada folder installasi SDK. Berikut adalah folder tempat SDK berada. Sesuaikan dengan lokasi installasi SDK pada PC anda. C:\Users\berlian\AppData\Local\Android\sdk\extras\intel\Hardware_Accelerated_Execution_ Manager Disana akan terlihat file application dari intelhaxm-android, run file .exe tersebut.



PRAKTIKUM

Lakukan installasi android studio pada PC anda!

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

11

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

12

Pertemuan 2 User Interface XML Layout A. Materi  User interface, XML Layout B. Kompetensi Dasar  Mengenal macam layout C. Tujuan  Mahasiswa mengenal dan bisa menerapkan layout pada aplikasi android D. Dasar Teori D. Membuat Layout Layout mendefinisikan tampilan visual dari User Interface. Untuk membuat aplikasi yang akan diakses oleh user tentunya harus memiliki user interface. Dengan user interface user bisa berkomunikasi dengan aplikasi. Contohnya ketika user menginputkan datanya pada EditText kemudian menekan button, selanjutnya data yang diinputkan oleh user akan diproses oleh system. EditText dan button ini disebut dengan widget. Sedangkan widget yang diletakkan di user interface harus menggantung pada layout. Pada modul ini kita akan belajar mengenai pembuatan layout. Di Android ada beberapa jenis layout diantaranya : a. LinearLayout Linearlayout adalah sebuah ViewGroup yang meletakan elemen widget secara vertical atau horizontal. Pada Gambar 2.1. terlihat tampilan user interface yang menggunakan LinearLayout

Gambar 2.1. User Interface menggunakan LinearLayout Pada horizontal layout komponen widget terletak secara horizontal atau sejajar. Sedangkan pada VerticalLayout komponen widget terletak secara vertical.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

13

Untuk membuat LinearLayout ikuti langkah berikut : Buka android studio -> app ->res->layout->activity_main.xml pilih tampilan dalam bentuk design. Terlihat bahwa hp android menampilkan tulisan “hello World!”. Hapus tulisan tersebut. Dari tampilan design pindah ke tampilan text, sehingga akan terlihat list code dalam bentuk xml. Hal ini karena user interface android memakai XML. Ubah code yang ada menjadi berikut :

Pada LinearLayout bisa diletakkan elemen-elemen widget. Berikut elemen LinearLayout yang telah diletakkan widget didalamnya



Bisa pula membuat LinearLayout dengan mendrag Layout ke UI design terlihat seperti pada Gambar 2.2.

1 POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

14

Gambar 2.2. Membuat LinearLayout b. RelativeLayout Buat Layout baru dengan cara klik kanan folder layout -> new -> layout resource file kemudian tulisan nama layout yang baru, awali dengan huruf kecil -> klik ok Berikut langkah untuk membuat RelativeLayout : - Ganti tampilan menjadi design - Drag RelativeLayout ke UI desain - Drag widget dengan letak sesuai keinginanmu Atau bisa dengan cara menambahkan coding pada layout. Caranya : Ganti tampilan menjadi teks. Tambahkan script dibawah ini pada file .xml





Hasil terlihat seperti pada Gambar 2.3.

Gambar 2.3. Tampilan UI dengan Framelayout c. TableLayout TableLayout adalah sebuah ViewGroup yang meletakkan komponen pada baris dan kolom. Untuk membuat komponen yang diletakan pada TableLayout bisa dengan cara drag. Beikut cara membuat dengan tampilan desain :  Drag TableLayout ke UI desain   Drag TableRow ke UI desain    

 Pindah ke mode text. Tambahkan android:stretchColumns="1" didalam komponen TableLayout seperti dibawah ini

   Tambahkan widget ke komponen TableRow. Hingga ComponentTree terlihat seperti Gambar 2.4. POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

16

Gambar 2.4. Component Tree dari project dengan TableLayout Atau bisa dengan meng-copikan script dibawah ini ke file .xml











POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

17

Hasil terlihat seperti pada Gambar 2.5.

Gambar 2.5. Tampilan UI dengan Tablelayout d. FrameLayout FrameLayout adalah FrameLayout adalah frame yang dirancang untuk menyisipkan widget ke dalam widget lain Untuk membuat komponen yang diletakan pada FrameLayout bisa dengan cara drag. Berikut cara membuat dengan tampilan design : - Drag FrameLayout ke UI design - Drag komponen widget yang ingin diletakkan pada FrameLayout. Komponen yang diletakkan bisa seperti yang terlihat pada component tree Gambar 2.6.

Gambar 2.6. Component Tree dari project dengan FrameLayout Atau bisa dengan cara, meng-copikan script dibawah ini ke file .xml

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

18





Hasil terlihat seperti pada Gambar 2.7.

Gambar 2.7. Tampilan UI dengan FrameLayout e. ScrollView ScrollView adalah tipe dari FrameLayout yang mengijinkan user mescroll sebuah list dari view yang membutuhkan banyak space lebih dari tampilan fisik Untuk membuat komponen yang diletakan pada ScrollView bisa dengan cara drag. Beikut cara membuat dengan tampilan design : 4. Drag ScrollView ke UI design 5. Drag Linearllayout ke dalam ScrollView 6. Drag komponen widget ke dalam LinearLayout Komponen yang diletakkan bisa seperti yang terlihat pada component tree Gambar 2.8.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

19

Gambar 2.8. Component Tree dari project dengan ScrollView 6. Supaya textView berisi banyak tulisan seperti Gambar 2.10. bisa menggunakan nilai String yang disimpan di strings.xml 7. Caranya buka values -> klik strings.xml Di file ini menyimpan String atau tulisan yang bisa digunakan untuk membuat project seperti dibawah ini

Aplikasiku2 Hello world! Belajar Android In this tutorial we will show you, how to use Android ScrollView component and create a simple example using various ScrollView properties.

Most Android application will likely to have the contents that’s doesn’t fit the screen. Think a bit about displaying the news details, the contents are dynamic and can grow beyond your screen size. If we design our screen layout using standard layout managers like LinearLayout, RelativeLayout, FrameLayout or TableLayout; when the content grows, and data goes beyond screen size, and user won’t be able scroll and view the content. Settings

Name merupakan key dari nilai String tersebut. Supaya bisa menggunakannya kembali ke file layout .xml, tentukan widget yang akan menggunakan String tersebut. Misal pada textView diatas, klik textView tersebut. Pada properties lakukan seperti pada Gambar 2.9.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

20

Gambar 2.9. Memberi nilai text pada widget  

Lakukan hal yang sama pada textView kedua namun pilih deskripsi Bila bingung, copikan koding dibawah ini ke file .xml anda





POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

21



Hasil bisa dilihat pada Gambar 2.10.

Gambar 2.10. Tampilan UI dengan ScrollView E. PRAKTIKUM 1. Lakukan langkah-langkah membuat Linear Layout, TableLayout, RelativeLayout, FrameLayout dan ScrollView Layout seperti pada dasar teori! 2. Buatlah layout untuk menampilkan form berikut : Nama : Alamat : Email : Submit

Reset

Gunakan Relative Layout untuk meletakan widget serta gunakan Linear Layout untuk meletakan dua buah button! Sehingga Linear Layout terletak didalam Relative Layout

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

22

Pertemuan 3 User Interface, Widget A. Materi  User interface, Widget



B. Kompetensi Dasar  Membuat aplikasi android dasar  Mengenal macam widget C. Tujuan  Mahasiswa mengenal dan bisa menerapkan widget pada aplikasi android

 D. Dasar Teori Subclass ViewGroup adalah kelas dasar untuk layout. Komponen yang tidak terlihat digunakan untuk meletakkan widget atau ViewGroup lainnya. View adalah kelas dasar dari widget untuk membangun user interface yang interaktif. Contohnya button, textfield dsb. Berikut macam-macam widget yang ada pada Android : Label Button Image View and Image Button EditText CheckBox RadioButton Untuk menggunakan widget pada user interface android diletakkan pada layout berupa file .xml. Pada file .xml terdapat dua tampilan yaitu design dan text. Menggunakan widget pada tampilan design dengan cara men-drag komponen pada user interface layout seperti pada Gambar 3.1.

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

23

Gambar 3.1. Menambahkan widget pada layout Sedangkan menggunakan widget dalam tampilan text dengan cara menuliskan kode :

Ketika menggunakan widget maka harus menyertakan code : android:id=“nama_id” Untuk nama id aturan penulisannya @+id/nama_id .Nama id bersifat unik, tidak boleh sama dengan widget lainnya pada suatu layout. Widget yang diletakan di layout memiliki id, id ini digunakan sebagai kontrol dikelas java. Setiap komponen widget yang akan dikontrol di kelas java harus diambil dulu id nya dengan cara : (KomponenWidget)findViewById(R.id.nama_id) 1. Label TextView digunakan untuk menampilkan tulisan. Membuat textView bisa dengan cara mendrag komponen label ke layout pada design. Atau menuliskan code-nya sebagai berikut:

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

24

2. Button Widget button adalah widget yang bisa memiliki aksi klik. Membuat Button bisa dengan cara mendrag komponen ke layout pada design. Atau menuliskan code-nya sebagai berikut :

Untuk menambahkan listener pada Button tambahkan script berikut pada file .java :

Atau menambahkan aksi onClick pada layout :

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

25

Kemudian buatlah method proses pada file java

3. ImageView dan ImageButton ImageView dan ImageButton adalah widget di android yang mengijinkan meng-embed gambar pada aplikasi. Setiap widget membutuhkan atribut code : android:src atau android:background (pada xml) untuk mendefinisikan gambar yang akan ditampilkan. ImageButton berupa gambar namun bisa melakukan aksi samahalnya dengan button. Membuat ImageView atau ImageButton bisa dengan cara mendrag komponen ke layout pada design. Atau menuliskan code-nya sebagai berikut :

4. EditText EditText digunakan untuk menerima inputan dari user. Bersifat editable. Membuat EditText bisa dengan cara mendrag komponen ke layout pada design. Atau menuliskan code-nya sebagai berikut :

POLITEKNIK NEGERI MADIUN 2019 - PRAKTIKUM MOBILE PROGRAMING

26

Untuk mengambil dan mengeset nilai dari EditText bisa menggunakan method sebagai berikut : txtBox.getText().toStrin...