Press "Enter" to skip to content

Aplikasi Android dengan Web Services REST API Sederhana

Resource Project

Pada bagian ini kita akan menambahkan beberapa resource (sumber daya) yang dibutuhkan pada project ini. Resource dibagi kedalam beberapa kategori, seperti resource vector, strings, colors, styles, dimens, menu dan layout.

Resource Vector

Resource Vector adalah sumber daya gambar vector yang akan digunakan pada project ini. Secara garis besar vector akan digunakan untuk beberapa icon yang digunakan pada aplikasi. Tambahkan beberapa resource vector yang akan dibutuhkan pada resource layout pada project ini. Untuk menambahkan resource vevctor dapat dilakukan melalui menu File -> New -> Vector Asset.

Vector Account

Vector asset pertama yang ditambahkan adalah vector account. Silakan ganti pada bagian Clip Art dengan menggunakan kata kunci account untuk mencari icon seperti gambar dibawah ini. Atribut yang lain biarkan default. Jika sudah sesuai pilih Next untuk melanjutkan, dan Finish untuk menambahkan.

Dialog menambahkan vector asset

Berikut adalah dialog untuk pencarian icon. Berikan kata kunci untuk pencarian icon yang diinginkan.

Dialog pencarian icon

Vector Search

Vector asset kedua adalah icon untuk pencarian data. Cari dengan menggunakan kata kunci pencarian “search“. Kemudian ganti nama resource vector dengan mengganti kata black menjadi white. Pada bagian Color ganti menjadi putih dengan menggunakan kode warna “FFFFFF“.

Dialog untuk menambahkan vertor asset untuk pencarian data

Berikut ini adalah tampilan dialog pemilihan warna. Kita dapat menyesuaikan dengan kode heksa, kode RGB, atau dengan menggunakan color picker.

Dialog memilih warna

Vector Delete

Vector asset ketiga adalah icon untuk penghapusan data. Cari dengan menggunakan kata kunci pencarian “delete“. Kemudian ganti nama resource vector dengan mengganti kata black menjadi white. Pada bagian Color ganti menjadi putih dengan menggunakan kode warna “FFFFFF“.

Dialog untuk menambahkan vertor asset untuk hapus data

Vector Add

Vector asset keempat adalah icon untuk penambahan data. Cari dengan menggunakan kata kunci pencarian “add“. Kemudian ganti nama resource vector dengan mengganti kata black menjadi white. Pada bagian Color ganti menjadi putih dengan menggunakan kode warna “FFFFFF“.

Dialog untuk menambahkan vertor asset untuk tambah data

Resource Strings

Resource Strings adalah sumber daya string/teks yang akan digunakan pada project ini. Modifikasi resource strings.xml yang terdapat pada diretory app -> res -> values -> strings.xml sebagai berikut ini.

Resource Colors

Resource Colors adalah sumber daya color/warna yang akan digunakan pada project ini. Modifikasi resource colors.xml yang terdapat pada diretory app -> res -> values -> colors.xml untuk memberikan warna dasar baru sebagai berikut ini.

Resource Styles

Resource Styles adalah sumber daya style/gaya yang akan digunakan pada project ini. Resource style pada aplikasi Android memiliki konsep yang sama dengan CSS pada aplikasi web. Modifikasi resource styles.xml yang terdapat pada diretory app -> res -> values -> styles.xml untuk memberikan style baru sebagai berikut ini.

Resource Dimens

Resource Dimens adalah sumber daya dimensi yang akan digunakan pada project ini. Secara garis besar dimens akan digunakan untuk menentukan ukuran dari resource lain pada aplikasi. Resource dimens tidak ditambahkan secara otomatis oleh Android Studio sehingga kita perlu tambahkan sendiri. Tambahkan resource dimens melalui klik kanan pada folder values yang berada pada directory app -> res -> values kemudian pilih menu New -> Values Resource File. Berikan nama file “dimens”.

Tambahkan tiga buah resource dimen dengan nama small_margin, medium_margin, dan large_margin yang masing-masing memiliki nilai 4, 8, dan 16 sebagai berikut.

Resource Menu

Resource Menu digunakan untuk menampilkan menu pada tool bar aplikasi. Pada project ini dibentuk dua buah resource menu yang masing-masing akan ditempatkan pada Main Activity yang merupakan tampilan utama dari aplikasi dan juga pada Input Activity yang merupakan activity untuk mengelola data.

Directory untuk menampung resource menu belum tersedia untuk project yang menggunakan templater empty activity. Sehingga kita perlu tambahkan melalui klik kanan pada folder res kemudian pilih menu New -> Android Resource Directory. Pilih Resource type menu untuk membentuk directory untuk resource menu lalu pilih OK.

Dialog menambahkan Android Resource Directory

Menu Main

Resource Menu pertama yang ditambahkan adalah resource menu main yang ditambahkan melalui klik kanan pada directory resource menu kemudian pili menu New -> Menu Resource File. Berikan nama menu_main.

Dialog menambahkan menu resource file

Resource menu_main akan ditampilkan di Main Activity untuk menampilkan menu pencarian data. Sehingga menu_main memilki satu buah menu item yang akan digunakan sebagai menu untuk pencarian data. Berikut adalah kode XML dari resource menu_main.

Menu Input

Resource Menu kedua yang ditambahkan adalah resource menu input yang diberikan nama menu_input. Resource menu_input akan ditampilkan di Input Activity untuk menampilkan menu hapus data. Sehingga menu_input memilki satu buah menu item yang akan digunakan sebagai menu untuk menghapus data. Berikut adalah kode XML dari resource menu_input.

Resource Layout

Resource Layout digunakan untuk mendesain tampilan aplikasi. Pada project ini dibentuk beberapa resource layout. Beberapa layout akan digunakan pada Main Activity yang merupakan tampilan utama dari aplikasi dan masing-masing satu layout akan kita bentuk pada saat pembetukan Input Activity yang merupakan activity untuk mengelola data dan Tampil Activity yang merupakan activity untuk menampilkan data.

Layout Activity Main

Berikut adalah kode lengkap dari file layout main_activity.xml. Jika ada peringatan atau pesan error pada baris ke-9 yang merupakan perintah untuk memanggil layout content_main, dapat diabaikan terlebih dahulu karena kita akan bentuk layout content_main setelah bagian ini.

Layout Content Main

Layout content_main adalah layout yang disisipkan pada layout main_activity untuk membantu menampilkan data. Silakan tambahkan satu buah resource layout melalui klik kanan pada direcotory layout kemudian pilih menu New -> Layout Resource File dan berikan nama content_main.

Dialog menambahkan layout resource file baru yang diberikan nama content_main

Berikut adalah kode XML lengkap dari file content_main.xml. Terdapat sebuah elemen view berupa recycler view untuk menampilkan list data.

Layout List Contact

Layout list_contact adalah layout yang digunakan untuk menampilkan setiap list data contact pada layout content_main. Silakan tambahkan satu buah resource layout melalui klik kanan pada direcotory layout kemudian pilih menu New -> Layout Resource File dan berikan nama list_contact.

Dialog menambahkan layout resource file baru yang diberikan nama list_Contact

Berikut adalah kode XML lengkap dari file list_contact.xml.

Layout Activity Input

Layout berikutnya adalah sebuah resource layout yang dibutuhkan pada sebuah activity baru yang digunakan untuk mengelola data contact baru. Sebelum melakukan desain layout pertama-tama kita bentuk terlebih dahulu activity dari layout yang akan didesain. Tambahkan activity baru melalui menu New -> Activity -> Empty Activity. Berikan nama InputActivity pada isian Activity Name. Dengan pembentukan activity baru ini, akan dibentuk pula sebuah layout secara otomatis dan diberikan nama activity_input seperti yang terlihat pada isian Layout Name pada gambar berikut.

Dialog menambahkan activity baru yang diberikan nama InputActivity

Ubahlah kode XML dari layout activity_input yang telah terbentuk menjadi seperti kode XML berikut.

Layout Activity Tampil

Layout berikutnya adalah sebuah resource layout yang dibutuhkan pada sebuah activity baru yang digunakan untuk menampilkan data contact. Sebelum melakukan desain layout pertama-tama kita bentuk terlebih dahulu activity dari layout yang akan didesain. Tambahkan activity baru melalui menu New -> Activity -> Empty Activity. Berikan nama TampilActivity pada isian Activity Name. Dengan pembentukan activity baru ini, akan dibentuk pula sebuah layout secara otomatis dan diberikan nama activity_tampil seperti yang terlihat pada isian Layout Name pada gambar berikut.

Ubahlah kode XML dari layout activity_tampil yang telah terbentuk menjadi seperti kode XML berikut.

Pages: 1 2 3 4 5 6 7 8 9