API dan DB.pdf (3,641Kb)

  

Google Map API Gunadarma University INTRODUCTION API

  EXAMPLE Google Maps

  Menampilkan Peta Di Dalam Website INTRODUCTION API

  EXAMPLE Google Maps

  Fitur Utama Pada Google Maps Google Maps

  Map Dapat Diterapkan pada Aplikasi Android

  INTRODUCTION API

  EXAMPLE Google Maps

  INTRODUCTION API

  EXAMPLE

  Google Map API untuk membuat map dan informasi secara spesifik API yang disediakan adalah services / fungsi yang terdiri dari :  Marker  Directions  Coordinates  Mengakomodasi Fungsi Utama Google Map Versi Web  Services Lainnya Case Study

  • Menampilkan Alamat yang telah diinput pada

  Map

  • Menampilkan Lokasi sebenarnya pada Map
Case Study

  Step by Step

  1. Membuat nama projek tampilan : a. Buka panel Properties.

  b. ubah Title menjadi Map it

  2. Membuat

Label “Google Map “

  a. klik Label pada Pada Palette -> lalu tarik ke halaman Viewer Project.

  b. Melakukan pengaturan pada Properties

  Pengaturan Properties Label “Google map”

  1. BackgroundColor : Light Gray

  2. FontBold : Ceklis

  

  3. FontSize : 14.0

  4. FontTypeface : default

  5. HasMargins : Ceklis

  

  6. Height : Automatic

  7. Width : Fill parent

  8. Text : Google Map

  9. TextAlignment : Center : 1

  10. TextColor : Red

  11. Visible : ceklis

  

Membuat layout baru

  1. Klik VerticalArrangement pada Palette

  • – Layout.

  2. Tarik kehalaman Viewer.

  3. Atur Properties Layout.

  Pengaturan Properties Layout

  1. AllignHorizotal : Left:1

  2. AllignVertical : Top:1

  3. BockgroundColor : Light Gray

  4. Height : Automatic

  5. Width : Fill parent

  6. Image : None

  7. Visible : Ceklis

  

Pengaturan VerticalArrangement

Input Componet VerticalArrangement

  a. klik & tahan Label pada Palette - User Interface -> lalu tarik ke halaman Viewer.

  b. klik & tahan TextBox Pada Palette - User Interface -> lalu tarik ke halaman Viewer.

  c. klik & tahan Button Pada Palette - User Interface -> lalu tarik ke halaman Viewer.

d. Melakukan pengaturan pada Masing-Masing Component VerticalArrangement2.

  Langkah-langkah Merubah Nama Component

1. Klik Component yang akan

  dirubah namanya

  3. Ketikan Nama baru yang diinginkan untuk mengganti

  nama yang lama pada kolom New name  OK

  4. Maka nama baru pada Component

  yang dipilih akan sesuai dengan yg

2. Klik Rename yang berada pada telah diketikan.

  bagian paling bawah Component

  Pengaturan Properties Label “SelectedAddresLabel”

  1. BackgroundColor : None

  2. FontBold : Ceklis

  

  3. FontSize : 14.0

  4. FontTypeface : default

  5. HasMargins : Ceklis

  

  6. Height : Automatic

  7. Width : Fill parent

  8. Text : Masukan Alamat

  9. TextAlignment : left: 1

  10. TextColor : Black

  11. Visible : Ceklis

  

  Pengaturan Properties Label “AddresForMApLabel”

  1. BackgroundColor : Default

  2. Enabled : Ceklis

  

  3. FontSize : 14.0

  4. FontTypeface : default

  5. Height : Automatic

  6. Width : Fill parent

  7. Hint : masukan alamat

  yang dicari

  8. TextAlignment : left: 0

  9. TextColor : Black

  10. Visible : Ceklis

  

  Pengaturan Properties Button “ViewOnMapButton”

  1. BackgroundColor : Default

  2. Enabled : Ceklis

  

  3. FontBold : Ceklis

  

  4. Fontitalic : Blank

  5. FontSize : 14.0

  6. FontTypeface : default

  7. Height : Automatic

  8. Width : Fill parent

  9. Image : None

  10. Shape : default

  11. Text : View On Map

  12. TextAlignment : Center:1

  13. TextColor : Default

  

Membuat Button baru

  1. Klik Button pada Palette

  • – user Interface 2. Tarik kehalaman Viewer.

  3. Atur Properties Button.

  Pengaturan Properties Button “MyLocationButton”

  1. BackgroundColor : Default

  2. Enabled : Ceklis

  

  3. FontBold : Ceklis

  

  4. Fontitalic : Blank

  5. FontSize : 14.0

  6. FontTypeface : default

  7. Height : Automatic

  8. Width : Fill parent

  9. Image : None

  10. Shape : default

  11. Text : My Location On The Map

  12. TextAlignment : Center:1

  13. TextColor : Default

  

Menambahkan Database

Step by step :

  1. Klik & tahan TinyDB pada

  Pallete – Storage.

  2. Tarik menuju halaman Viewer

  3. Lepaskan

  

Menambahkan Notifikasi

Step by step :

  1. Klik & tahan Notifier pada

  Pallete – User Interface.

  2. Tarik menuju halaman Viewer 3. Lepaskan.

  

Menambahkan ActivityStrarter

Step by step :

  1. Klik & tahan ActivityStarter pada Pallete

  • – Connectivity.

  2. Tarik menuju halaman Viewer

  3. Lepaskan

  

Menambahkan LocationSensor

Step by step :

  1. Klik & tahan LocationSensor pada Pallete

  • – Sensors.

  2. Tarik menuju halaman Viewer

  3. Lepaskan

  Mengaktivkan Setiap Component Dengan Control Block

  Pengaturan Control Block

  Klik tombol Blocks untuk pindah pada tampilan Pengaturan activity Componen Case Study

  Menampilkan Peta dari Alamat yang Diinput

  Aksi yang Ditampilkan saat Tombol View On Map Di Klik Case Study

  Menampilkan Peta Lokasi Asal saat

  Button My Location Di klik Menampilkan Peta dari Alamat yang Diinput Step by Step :

  1. Klik Blocks-Prosedures

  2. Pilih tipe prosedures to-do

  3. Klik pada tipe yang sesuai lalu tarik menuju halaman Ubah Menjadi :

  Viewer showMap

  Menampilkan Peta dari Alamat yang Diinput Step by Step :

  1. Klik Blocks-ActivityStarter1

  2. Pilih tipe set-action-to

  3. Klik pada tipe yang sesuai lalu tarik menuju halaman Viewer

  4. Gabungkan dengan Block sebelumnya.

  Menampilkan Peta dari Alamat yang Diinput Step by Step :

  1. Klik Blocks- Text

  2. Pilih tipe Banks Text

  3. Klik pada tipe yang sesuai lalu tarik menuju halaman Viewer

  4. Gabungkan dengan Blocks sebelumnya.

  Isi bagian kosong dengan : Lanjutkan Hingga membentuk pola seperti dibawah ini :

Menampilkan Peta dari Alamat yang Diinput

  Menampilkan Peta dari Alamat yang Diinput Blocks

   Text “…..”

  4 Isi dengan : geo:0,0?q= Blocks Text Join

  3

2 Blocks

   ActivityStarter1 Call ActivityStarter1. StartActivity Blocks

   AddressForMapTextAddressForMapText. Text

  5 Blocks ActivityStarter1 DataUri. to

  1 Membuat Pola baru untuk menambahkan aksi pada tombol view on map.

  

Aksi yang Ditampilkan saat Tombol View On Map Di Klik

  Aksi yang Ditampilkan saat Tombol View On Map Di Klik Blocks

   Text is empty

3 Blocks

  AddressForMapText AddressForMapText. Text

4 Blocks  Text  “…….”

  6

1 Blocks

   Blocks

   Text “Info”

  7 ViewOnMapButtonwhen ViewOnMapButton . Click

  8 Blocks Control if then

  Blocks Text “Okay”

  Blocks Notifier1Call Notifier1. ShowMessageDialog

  5 (lalu klik kotak biru untuk

  2 message menambahkan kondisi else) title button text Blocks

   Procedures Call ShowMap Membuat Pola baru untuk menambahkan aksi pada tombol My Location

Menampilkan Peta Lokasi Asal saat Button

My Location Di klik

  Menampilkan Peta Lokasi Asal saat Button My Location Di klik Isi bagian kosong dengan : Android.intent.action.VIEW Blocks

   Text “…..”

  3 Blocks ActivityStarter1 Set ActivityStarter1.Action. to

2 Blocks

   Text “…..”

  6 Isi dengan : geo:0,0?q=

1 Blocks

   MyLocationButton

   When MyLocationButton

  5 Click, do Blocks

   Text Join

  7 Blocks Procedures Call ActivityStarter1 . StartActivity

8 Blocks

   LocationSensor1 LocationSensor1.Currentaddress Blocks

   ActivityStarter1 Set ActivityStarter1.DataUri. to

  4

  

Database Dengan TinyDB Gunadarma University Database

  Kumpulan informasi yang disimpan di dalam komputer secara sistematik Dapat dilihat kembali dengan menggunakan program aplikasi Bersifat Persisten Database

Atribut Tabel Database

  Sekolah Siswa nisn nama_siswa

  Guru NIP nama_guru

  Mapel Kode_mapel Nama_mapel TinyDB

  Menerima / Membaca Data di

  TinyDB TinyDB

  Menyimpan Data di dalam storage Devices TinyDB

  Mengambil Nilai dari Database Case Study

  • – Menggunakan Projek Sebelumnya

    • Menyimpan Alamat Dalam Database • Memilih Alamat yang telah disimpan di dalam database
    • Menampilkan Alamat pada Map
    Case Study

  • – Menggunakan Projek Sebelumnya

  3 Ubah Text sesuai SS

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Label

  2 Ubah Text sesuai SS

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop ListPicker

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Horizontal Arrang.

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Horizontal Arrang.

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Dua Button

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Vertical Arrang.

  2 Ubah Text dari Label

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Label

  2 Ubah Text dari Label

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Label

  2 Ubah Text dari Label

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop TextBox

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop Horizontal

  Arrangment Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop 2 Button

  Case Study

  • – Menggunakan Projek Sebelumnya

1 Drag n Drop 2 Button

  TextBox

  Case Study

  • – Menggunakan Projek Sebelumnya

  1 Set background ke white

1 Drag n Drop Label, Mengganti

  Case Study

  • – Menggunakan Projek Sebelumnya

  Definisi Variabel Membaca Database saat Aplikasi Dibuka Case Study

  • – Menggunakan Projek Sebelumnya

  Definisi Variabel

  2 Drag n Drop dan Pasang ke tagAdress

  1 Drag n Drop

  3 Drag n Drop dan Pasang ke listLocations Case Study

  • – Menggunakan Projek Sebelumnya

  Membaca Database saat Aplikasi Dibuka

  1 Drag n Drop

  2 Drag n Drop dan Pasang ke listLocations

  2 Drag n Drop dan Pasang ke block When-Do

  3 Drag n Drop dan Pasang ke block When-Do Case Study

  • – Menggunakan Projek Sebelumnya

4 Drag n Drop dan psang

  ke ListPikcer

  Membaca Database saat Aplikasi Dibuka

  Fungsi Membaca Data Aksi Ketika Tombol Add

  Case Study

  • – Menggunakan Projek Sebelumnya

  Location Di-Klik Aksi Ketika Tombol

  Cancel Di-Klik Fungsi Menambah Data Alamat yang Diinput

  Menampilkan alamat yang dipilih pada label Case Study

  Case Study

  • – Menggunakan Projek Sebelumnya

  • – Menggunakan Projek Sebelumnya