Advertisement
  1. Code
  2. Mobile Development
  3. Android Development

Bagaimana Cara Memperbarui Ikon Peluncur untuk Aplikasi Android Anda

Scroll to top
Read Time: 5 min

() translation by (you can also view the original English article)

Memberikan suatu tampilan produk pengguna antarmuka secara profesional dan nuansa menambah nilai untuk itu. Ketika pengguna menyukai apa yang dilihatnya di UI aplikasi, peluang yang akan mereka pasang akan meningkat sangat besar. Ada seperangkat aturan yang ditetapkan untuk desain, warna, ikon, dan elemen UI lainnya yang harus diikuti aplikasi Android Anda. Pada artikel ini, kita akan menempel pada ikon, ikon launcher , for your Android app.

Ikon untuk aplikasi Android dipisahkan menjadi beberapa kategori. ini termasuk :

  • Ikon Launcher: ikon ini mewakili aplikasi Anda di layar awal atau daftar aplikasi perangkat pengguna. Ini bisa menjadi Ikon adaptive launcher, untuk tipe Android 8.0 (API level 26) atau di atas, atau Legacy Launcher Icon, untuk Android tipe 7.1 (API level 25) atau di bawah.
  • Ikon Action Bar: untuk item pada action bar.
  • Ikon Tab: untuk item tab yang memiliki ikon, jika ada

Anda dapat mempelajari lebih lanjut tentang kategori ikon ini dengan melihat aplikasi lain. Berikut ini contohnya Whatsapp icons:

WhatsApp Icons ExampleWhatsApp Icons ExampleWhatsApp Icons Example

Sekarang, membuat ikon ini mungkin tampak mudah jika Anda seorang desainer, atau jika Anda seorang pengembang yang memiliki desainer di tim Anda. Tapi itu tidak semudah kelihatannya. Anda harus membuat ikon untuk setiap dimensi yang berbeda, berdasarkan pada resolusi dan kepadatan layar perangkat Android. Untuk memberi Anda gambaran tentang seberapa banyak pekerjaan ini, berikut adalah daftar ukuran yang Anda perlukan untuk membuat ikon peluncur jika Anda akan melakukannya dengan cara tradisional:

Density Ikon Ikon
ldpi 36 x 36 px
mdpi 48 x 48 px
tvdpi
64 x 64 px
hdpi
72 x 72 px
xhdpi
96 x 96 px
xxhdpi
144 x 144 px
xxxhdpi
192 x 192 px
Web
512 x 512 px

Dan ini hanya ikon peluncur. Ada daftar serupa untuk setiap kategori ikon. Namun untungnya, Android Studio memberi kami alat yang disebut Image Asset Studio yang menangani pembuatan ikon untuk semua kepadatan layar dengan sangat mudah.

Apa itu Aset Gambar Studio?

Android Studio 3 telah memperkenalkan Image Asset Studio untuk membuat ikon untuk aplikasi Anda. Ini mengurus menghasilkan ikon aplikasi resolusi yang sesuai untuk kepadatan layar yang berbeda dan menempatkannya di masing-masing folder mipmap-density di direktori resource. Ini juga menghasilkan ikon untuk web (512 x 512 px) yang diperlukan untuk mengunggah aplikasi ke Google Play Store. Ikon-ikon ini kemudian diambil dari folder berdasarkan kerapatan layar perangkat selama waktu proses.

Untuk adaptive launcher icons, Image Asset Studio menyediakan pratinjau lengkap dari rangkaian ikon yang mencakup lingkaran, kotak, persegi membulat, lapisan tipis, lapisan penuh, ikon warisan, ikon bulat dan Google Play Store ikon juga.

Adaptive launcher Icons Preview

Untuk Ikon legacy launcher, di sisi lain, perangkat tidak mendukung ikon dari berbagai bentuk. Jadi, serangkaian ikon yang lebih terbatas akan dihasilkan.

Legacy Launcher Icons Preview

Menggunakan Gambar Asset Studio

Mari kita lihat cara membuat set ikon menggunakan Image Asset Studio.

Perbarui Ikon menggunakan Gambar Aset Studio:

Untuk memulai Image Asset Studio, pilih Android pada Project Window. Klik kanan pada folder res dan pilih New -> Gambar Asset. Anda sekarang telah membuka gambar Asset Studio. Sekarang Anda dapat membuat Ikon Peluncur Adaptif atau Ikon Peluncur Hanya yang Legacy sesuai kebutuhan Anda.

Membuat Ikon Adaptive Launcher

Adaptive Launcher IconAdaptive Launcher IconAdaptive Launcher Icon

Anda akan menggunakan jenis ikon ini untuk dukungan Android 8.0.

pertama, pilihlah ikon Launcher (Adaptive & Legacy)untuk Icon Type. Mengubah name ikon jika Anda mau. Jika nama sudah ada, akan ada peringatan di bagian bawah dialog, memberi tahu yang sudah ada akan ditimpa.

Di Tab Foreground Layer pilih Asset Type:

  • Image: Atur jalur gambar ikon kustom.
  • Clip Art: Pilih Ikon dari kumpulan ikut desain material dan kumpulan warna.
  • Text: Atur string yang ditentukan, atur font dan warnanya.

Demikian pula, di Background Layer tab Anda dapat memilih GambarClip Art, atau Text tipe asset.

Untuk kedua lapisan latar depan dan latar belakang, Anda juga memiliki pengaturan opsional berikut:

  • Nama Lapisan: Anda dapat memberi layer nama yang unik.
  • Parameter Penskalaan: dapat diatur sesuai kebutuhan Anda. Opsi ini dinonaktifkan jika Anda memilih warna untuk lapisan latar belakang.
  • Trim: Pilih jika Anda ingin menghapus ruang transparan di sekitar ikon Anda.
  • Resize: Ubah ukuran ikon.

Legacy Tab memungkinkan Anda memutuskan apakah akan menghasilkan ikon warisan. Di sini Anda dapat memilih apakah Anda ingin menghasilkan ikon warisan, ikon Google Play Store, dan ikon bulat, serta bentuk apa yang digunakan untuk masing-masing.

Buat Ikon Peluncur Legacy 

Ini adalah jenis ikon yang akan Anda buat jika Anda ingin mendukung versi Android kurang dari atau sama dengan 7.1.

Pertama pilih Launcher Icons (Legacy Only) untuk Jenis Ikon. Anda dapat mengubah Name ikon saat ini jika Anda mau. Jika nama sudah ada, akan ada peringatan di bagian bawah bahwa yang sudah ada akan ditimpa. Pilih tipe Asset dan konfigurasikan pengaturan asosiasi.

  • Image: Atur jalur gambar ikon kustom.
  • Clip Art: Pilih ikon dari set ikon desain material dan atur warnanya.
  • Text: Atur string yang ditentukan, atur font dan warnanya.

Pilih ikon dari set ikon desain material dan atur warnanya:

  • Trim: Pilih jika Anda ingin menghapus ruang transparan di sekitar ikon Anda.
  • Padding: Atur padding untuk ikon.
  • Foreground: Atur warna latar depan.
  • Background: Atur warna latar belakang.
  • Scaling: Pilih tanaman atau menyusut agar sesuai.
  • Shape: Untuk menambahkan latar belakang ke ikon, pilih bentuknya. Untuk latar belakang transparan, pilih tidak ada.
  • Effect: Memilih apakah untuk memiliki anjing eared efek untuk ikon berbentuk persegi atau persegi panjang.

Setiap perubahan yang Anda buat, akan tercermin di bagian pratinjau. Setelah Anda puas dengan tampilan dan nuansa/ tampilan ikon Anda, klik Next.

Anda kemudian akan dibawa ke layar pengaturan di mana Anda dapat mengubah Resource Directory di mana ikon Anda akan dipancarkan. Perbarui jika Anda mau. Berikut adalah opsi yang tersedia:

  • main/res: untuk semua varian build, termasuk rilis dan debug.
  • release/res: menimpa set sumber utama untuk versi rilis tunggal dari build.
  • debug/res: hanya untuk debug.
  • custom source set: Anda dapat menentukan kumpulan sumber Anda sendiri.

Akhirnya, tutup dengan menekan Finish.

Sekarang kami siap dengan ikon peluncur baru kami di semua folder masing-masing. Nama ikon peluncur saya adalah ic_launcher_demo. Anda dapat melihat semua ikon yang dibuat untuk ikon ini di tangkapan layar di bawah ini.

perbarui AndroidManifest File

sekarang saat nya memperbaharui AndroidManifest file sehingga aplikasi kami tahu untuk menggunakan ikon baru. Untuk memulai, buka AndroidManifest.xml file. Di sini adalah set ikon laucher default diatur pada baris 7 dan 9. Anda perlu memperbaruinya dengan ikon baru yang Anda buat.

Mengubah android:icon and android:roundIcon ke nama yang Anda pilih untuk ikon peluncur Anda.

1
android:icon="@mipmap/ic_launcher_demo"
2
android:roundIcon="@mipmap/ic_launcher_demo_round"

Selamat! Anda telah berhasil memperbarui ikon peluncur untuk aplikasi Anda.

Kesimpulan

Dalam posting ini Anda belajar tentang berbagai jenis ikon yang digunakan dalam aplikasi Android, serta semua resolusi layar yang berbeda yang harus dihasilkan untuk setiap ikon. Kemudian Anda belajar tentang alat Image Asset Studio dan bagaimana membuat ikon pembangkit untuk aplikasi Android Anda jauh lebih mudah.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.