Peringatan: Artikel ini dikategorikan sebagai archived. Artinya artikel ini tidak akan dirawat, diperbarui, ataupun dijadikan sebagai bahan diskusi.
Ketika kamu sedang menciptakan aplikasi, komponen apa yang paling sulit kamu pikirkan? Mungkinkah salah satunya adalah nama aplikasi (app name)? Atau ketika kamu ingin memberi tahu kepada orang lain apa yang bisa dilakukan oleh aplikasi kamu hanya dalam satu kalimat yang singkat namun padat, apakah itu juga sulit? Nama sebuah aplikasi dan deskripsinya menjadi salah satu kunci agar dapat menarik hati calon penggunanya. Icon atau logo aplikasi juga menjadi salah satu faktor penting agar aplikasi dapat sukses dilirik banyak orang.
Di aplikasi Windows 10, logo aplikasi bisa juga ditempelkan di live tile-nya. Live tile sendiri sudah menjadi ciri khas yang unik yang dimiliki Windows sejak versi Windows 8. Live tile dapat menyajikan informasi di ubin (tile) aplikasi tanpa kita harus menjalankan aplikasi tersebut. Namun developer mempunyai preferensi sendiri ketika mengembangkan aplikasinya, apakah mereka ingin menggunakan fitur live tile atau hanya sekedar menempelkan logo saja di tile aplikasi.
Pada bagian kedua tutorial UWP ini, saya akan menjelaskan cara mengatur nama dan deskripsi aplikasi, serta cara memasang logo aplikasi UWP.
“Windows 7? Good. Windows 8? Crap.
Windows 9? Good.Windows 10?”
Baca tutorial sebelumnya: Cara Membuat Project dan Men-deploy Aplikasi Windows 10 UWP
Setelah kamu membuat project aplikasi UWP dan dihadapkan dengan tampilan IDE-nya, lihatlah ke sidebar sebelah kanan dan cari Solution Explorer. Di situ kamu bisa melihat file-file apa saja yang terlibat dalam project.
Di Solution Explorer, klik ganda file bernama Package.appxmanifest untuk memunculkannya di tampilan code editor. Package.appxmanifest merupakan file tempat kita mengatur informasi dasar aplikasi seperti nama, deskripsi, dan logo aplikasi. Di sini kamu juga bisa mengatur aplikasi untuk dapat mengakses hardware ataupun kemampuan tertentu, namun pada tutorial ini saya tidak akan menjelaskannya.
File tersebut bukanlah berisi kodingan, melainkan formulir yang dapat kita isi sesuka kita. Jadi di tutorial ini kamu tidak perlu pusing-pusing (lol).
Pertama, kita akan memberi nama dan deskripsi aplikasi.
Pada jendela Package.appxmanifest, navigasikan ke tab Application.
Untuk mengatur nama aplikasi, isilah Display name dengan nama aplikasi yang kamu inginkan.
Untuk mengatur deskripsi aplikasi, isi pada form Description.
Sebagai tambahan, untuk mengatur rotasi yang didukung oleh aplikasi, centang jenis orientasi rotasi yang kamu inginkan di Supported rotations.
Sekarang deploy aplikasinya dan lihatlah list aplikasi di Start menu. Di sana muncul aplikasi dengan nama yang telah kamu beri.
Selanjutnya kita akan mengatur logo dan tile aplikasi.
Masih di Package.appxmanifest, navigasikan ke tab Visual Assets.
Lalu di sidebar sebelah kiri di dalam bagian Visual Assets, klik All Image Assets.
Pada bagian Tile, terdapat tiga elemen yang dapat kamu atur, yaitu Short name, Show name, dan Background color.
Di Short name, kamu bisa membuat aplikasi menampilkan nama yang berbeda dari nama aplikasi yang telah kamu atur di bagian Application. Di sini saya mengisinya dengan nama yang lebih pendek, yaitu UWP Tutor App (nama asli aplikasi adalah UWP Tutorial App).
Di Show name, kamu bisa mengatur pada ukuran berapa saja tile akan menampilkan nama aplikasi. Di sini saya memilih Square 310×150 Logo alias ukuran Wide, sehingga nama aplikasi hanya akan muncul jika saya mengubah ukuran tile aplikasi menjadi Wide.
Di Background color, kamu bisa mengatur warna latar tile sesuka kamu. Di mobile, jika kamu memberi warna latar pada tile aplikasi, tile tidak akan menjadi transparan ketika kamu mengatur opacity Start screen menjadi transparan, melainkan akan tetap menggunakan warna latar tersebut.
Pada bagian Splash Screen -> Background color, isilah dengan warna latar splash screen. Di sini saya memberikan warna latar yang sama dengan warna latar tile aplikasi.
Pada bagian Square 71×71 Logo, isilah dengan file gambar logo yang kamu Ingin untuk ditampilkan pada tile ukuran 71×71 pixel (Small).
Keterangan ukuran tile adalah sebagai berikut:
- Square 71×71: Small
- Square 150×150: Medium
- Square 310×150: Wide
- Square 310×310: Large
Isi hingga bagian terakhir, yaitu Splash screen.
Setelah semua visual assets yang dibutuhkan terisi, mari kita coba deploy aplikasinya.
Aplikasi terlihat begitu menawan dengan splash screen dan warna latar barunya, seperti tampak pada Gambar 11.
Lalu coba kita pin tile aplikasi ke Start menu dan coba ubah ukuran tile ke setiap ukuran yang ada.
Dapat terlihat pada Gambar 12 bahwa tile hanya menampilkan nama aplikasi pada saat ukurannya Wide, dan nama aplikasi yang muncul adalah short name-nya.
Setelah kita mencobanya di PC, mari kita coba deploy ke mobile.
Dan hasilnya adalah seperti Gambar 13 untuk splash screen barunya, dan Gambar 14 untuk tile dalam berbagai ukuran.
Seperti biasa, jika kamu ingin mencoba menjalankan project ini tanpa mengikuti tutorial, silakan download source code project dan App Packages tutorial ini dan langsung saja deploy.
Baca tutorial selanjutnya: Cara Menambahkan Elemen Kontrol (Control Element) di Aplikasi UWP
Sekian tutorial bagian kedua yang saya buat tentang cara mengatur nama, deskripsi, dan visual assets aplikasi Windows 10 UWP. Jika ada pertanyaan ataupun masalah mengenai tutorial ini, silakan tulis di kolom komentar dan saya akan mencoba membantu. Terima kasih telah membaca sampai akhir kata!
