PMO18-TI16A-P1-PENGANTAR AWAL PEMROGRAMAN MOBILE: MULTI BAHASA, MULTI UKURAN LAYAR, DESAIN RESPONSIF

November 23, 2018
 |  No Comments

PEMROGRAMAN MOBILE 2

KELOMPOK 4

Anggota Kelompok :

  1. žPermadi Endro  (16.11.0183)
  2. žIkur Tri Iswara  (16.11.0189)
  3. žKhilmi Choerul Fuadi  (16.11.0196)
  4. žFajar Aji Permana  (16.11.0220)
  5. žGilang Dwi Prasetyo  (16.11.0227)
  6. žFathurrohman  (16.11.0249)
  7. žNur Ali Firdaus  (16.11.0258)
  8. žLanang Rizqi A  (16.11.0260)
  9. žFerry Putra Wijaya  (16.11.0261)
  10. žA. Deva Mayyella  (16.11.0265)
  11. žGatra Wira Malik  (16.11.0269)

 

Materi yang dibahas:

  • Multi Bahasa
  • Multi Ukuran Layar
  • Desain Responsif

 

Multi Bahasa

Salah satu hal yang perlu diperhatikan saat mengembangkan aplikasi android adalah penggunaan bahasa di dalam nya. Sering kita dapati ketika membuat aplikasi hanya menggunakan satu bahasa, sebenarnya tidak masalah kita menggunakan satu bahasa akan tetapi ketika memberikan support multi bahasa pada aplikasi kita ini akan membuat pengalaman pengguna aplikasi kita akan lebih baik karena mereka mengerti dengan bahasa yang ada pada aplikasi kita.

Multi bahasa digunakan agar aplikasi yang dibuat menggunakan android studio tersedia berbagai bahasa. . Fitur dukungan multibahasa di Android merupakan bagian dari fitur localization. Fitur ini secara umum digunakan untuk menangani keragaman lokasi pengguna aplikasi Android. Para pengembang dapat mengatur content aplikasi buatan mereka, meliputi teks, file audio, file grafis, bilangan, dan mata uang, untuk disesuaikan dengan lokasi di mana aplikasi tersebut akan digunakan agar tepat guna. Maka, secara singkat, fitur dukungan multibahasa ini dapat diartikan sebagai proses penyesuaian konten teks berdasarkan region tertentu. Aplikasi dengan multi  bahasa akan memudahkan kita dalam memasarkan aplikasi ke dalan pasar global.

Untuk menambahkan dukungan agar lebih banyak bahasa, buat direktori values tambahan dalam res/ . Setelah memutuskan bahasa yang akan dipilih, buat subdirektori sumber daya dan file sumber daya string. Misalnya:

Untuk membuat file string baru, klik kanan pada file string.xml, pilih open Translations editor

Setelah itu klik ikon bumi dan akan muncul tampilan seperti di bawah, ini berfungsi untuk membuat file string baru dengan bahasa yang berbeda dari file string.xml default:

Isi sumber daya (file) string baru tersebut agar nantinya aplikasi dapat digunakan untuk multi bahasa, contoh :

Setelah selesai membuat file strting baru, selanjutnya kita desain activity_main.xml, kita tambahkan textview dan button

Lalu kita deklarasikan Buttonnya agar bisa mengganti bahasa, kita deklarasikan pada MainActivity.java

Jika sudah, kita jalankan programnya. Hasilnya seperti dibawah ini:

Apabia kita ingin mengganti bahasa, kita tinggal klik button Pilih Bahasa, maka akan muncul output seperti dibawah ini. Disini saya memilih Bahasa Inggris

 

Multi Ukuran Layar

Android dijalankan pada beragam perangkat yang menawarkan kepadatan dan ukuran layar yang berbeda. Untuk aplikasi, sistem Android menyediakan lingkungan development yang konsisten di berbagai perangkat dan menangani hampir semua pekerjaan untuk menyesuaikan antarmuka pengguna aplikasi ke layar yang menampilkannya. Jadi aplikasi yang kita buat harus bisa mendukung diberbagai ukuran layar, contohnya pada gambar dibawah ini :

Android mengkategorikan perangkat layar menjadi 2 jenis, yaitu size dan density. Size adalah ukuran layar sedangkan density kepadatan atau kerapatan layar atau jumlah piksel dalam area fisik layar, biasa disebut sebagai dpi (dot per inci).

  • Ada empat size umum (ukuran layar): kecil, normal, besar, dan ekstra besar.
  • Ada empat density umum (kepadatan layar):
  1. ldpi (rendah)
  2. mdpi (medium)
  3. hdpi (tinggi)
  4. xhdpi (ekstra-tinggi)

Untuk menambahkan dukungan multi ukuran layar, buat direktori layout dalam res/ . Kemudian tambahkan -<ukuran layar> . Contoh : res/layout-large/ 

kemudian tempatkan gambar yang tadi sudah di atur pada file resource drawable seperti berikut :

Untuk memastikan bahwa layout fleksibel dan beradaptasi dengan ukuran layar berbeda, harus menggunakan “wrap_content” dan “match_parent” untuk lebar dan tinggi beberapa komponen tampilan. Jika menggunakan “wrap_content”, lebar atau tinggi tampilan akan diatur ke ukuran minimum yang diperlukan agar pas dengan materi dalam tampilan itu, sementara “match_parent” akan membuat komponen membentang agar pas dengan ukuran tampilan induknya.

Dengan menggunakan nilai ukuran “wrap_content” dan “match_parent” sebagai ganti ukuran terprogram atau hardcoded, masing-masing tampilan Anda hanya akan menggunakan ruang yang diperlukan untuk tampilan itu maupun luaskan untuk mengisi ruang yang tersedia.

Kita juga bisa membentuk layout yang cukup kompleks menggunakan instance tersarang LinearLayout serta kombinasi “wrap_content” dan ukuran “match_parent”. Akan tetapi, LinearLayout tidak memungkinkan untuk mengontrol dengan tepat hubungan spasial dari tampilan. Tampilan dalam LinearLayout hanya berjajar berdampingan. Jika ingin tampilan diorientasikan bervariasi, bukannya garis lurus, solusi yang lebih baik adalah menggunakan RelativeLayout, yang memungkinkan untuk menetapkan layout dari segi hubungan spasial antar komponen. Misalnya, bisa menyejajarkan satu tampilan di sisi kiri dan tampilan lainnya di sisi kanan layar.

 

 Desain Responsif

Pada dasarnya, desain responsif dengan multi size pada aplikasi Android saling berhubungan. Jika multi size pada aplikasi Android itu artinya aplikasi tersebut bisa digunakan diberbagai ukuran layar Android. Kalau desain responsif artinya aplikasi tersebut bisa ditampilkan baik dalam bentuk potrait maupun landscape.

Desain Responsif merupakan suatu cara atau motode guna untuk mengoptimalkan layout pada aplikasi, agar terlihat lebih rapi dan menarik, sekaligus menyempurnakan kegunaan serta meningkatkan interaksi dan retensi pengguna.

Prinsip Desain :

1.Permukaan dan bayangan digunakan sebagai metafora, elemen UI harus berupa permukaan dengan lapisan tersendiri, yang ditumpuk di atas atau di samping satu sama lain. Bayangan harus digunakan untuk menunjukkan permukaan yang berada di depan permukaan lain, yang membantu memfokuskan perhatian dan membentuk hierarki.

2.Citra harus full-bleed. Minimalkan ruang antar foto, juga margin antara foto dan tepi layar, agar UI jadi lebih imersif dan kaya konten.

3.Warna harus digunakan dengan berani untuk menekankan pada branding dan elemen UI yang penting.  gunakan API Palet untuk menarik warna langsung dari konten, untuk memberikan pengalaman penggunaan yang lebih imersif.

4.Metrik dan baris utama sebaiknya digunakan untuk meratakan dan mengukur konten berdasarkan petak dasar 8dp, untuk keterbacaan dan konsistensi visual.

5.Interaksi responsif seperti masukan sentuhan dasar sebaiknya menggunakan bentuk ripples permukaan. Selain ripples permukaan, permukaan interaktif juga harus terangkat saat disentuh untuk mengikuti jari pengguna saat memproses masukan, dan setiap perubahan harus terpancar dari titik kontak.

 

Sumber :

 

Link PPT:  PPT KELOMPOK 4

Link Project: Project

Uncategorized