Skip to content

Most visited

Recently visited

navigation

Membuat Ikon Aplikasi dengan Image Asset Studio

Video

Piksel yang Tidak Bergantung Kepadatan

Android Studio menyertakan alat bantu bernama Image Asset Studio yang membantu Anda membuat ikon aplikasi sendiri dari ikon material, gambar khusus, dan string teks. Alat ini menghasilkan serangkaian ikon dengan resolusi yang sesuai untuk setiap kepadatan layar umum yang didukung aplikasi Anda. Image Asset Studio menempatkan ikon yang baru dihasilkan dalam folder kepadatan-khusus pada direktori res/ dalam proyek Anda. Pada waktu proses, Android menggunakan sumber daya yang sesuai berdasarkan kepadatan layar perangkat tempat aplikasi Anda berjalan.

Image Asset Studio membantu Anda menghasilkan tipe ikon berikut:

Tentang Image Asset Studio

Image Asset Studio membantu Anda membuat berbagai tipe ikon pada kepadatan berbeda dan menampilkan secara tepat kepada Anda di mana mereka ditempatkan dalam proyek Anda. Image Asset Studio menyertakan alat untuk menyesuaikan ikon Anda dan menambahkan backdrop, semuanya selagi menampilkan hasil dalam panel pratinjau, sehingga mereka akan muncul persis seperti yang Anda inginkan. Alat ini bisa secara dramatis menyederhanakan desain ikon dan proses impor. Bagian berikut menjelaskan tipe ikon yang bisa Anda buat serta masukan gambar dan teks yang dapat Anda gunakan.

Ikon Peluncur

Ikon peluncur adalah grafis yang menunjukkan aplikasi Anda kepada pengguna. Ikon bisa:

Image Asset Studio secara otomatis membuat ikon terpisah untuk kepadatan layar umum, termasuk mdpi, hdpi, xhdpi, xxhdpi, dan xxxhdpi. Ini memastikan bahwa ikon Anda ditampilkan dengan baik di berbagai layar dan perangkat. Ini menempatkan ikon di lokasi yang tepat dalam direktori res/mipmap-density/. Ini juga membuat gambar berukuran 512 x 512 piksel yang tepat untuk Google Play Store.

Kami merekomendasikan agar Anda menggunakan gaya desain material untuk ikon peluncur, meski Anda mendukung versi Android lama.

Lihat Ikon Peluncur dan Product Icons - Material Design untuk informasi selengkapnya.

Bilah aksi dan ikon tab

Ikon Bilah Aksi adalah elemen grafis yang diletakkan dalam Bilah Aksi dan mewakili item aksi individu. Lihat Menambahkan dan Menangani Tindakan, App Bar - Material Design, dan Desain Bilah Aksi untuk informasi selengkapnya.

Ikon tab adalah elemen grafis yang digunakan untuk mewakili tab individu dalam antarmuka multi-tab. Setiap ikon tab memiliki dua status: tidak dipilih dan dipilih. Lihat Membuat Tampilan Gesek dengan Tab dan Tabs - Material Design untuk informasi selengkapnya.

Image Asset Studio secara otomatis membuat ikon terpisah untuk kepadatan layar umum yang direkomendasikan, termasuk mdpi, hdpi, xhdpi, dan xxhdpi. Ini menempatkan ikon di lokasi yang tepat dalam direktori res/drawable-density/.

Kami menyarankan agar Anda menggunakan gaya desain material untuk bilah aksi dan ikon tab, bahkan jika Anda mendukung versi Android lama. Gunakan appcompat dan pustaka dukungan lainnya untuk memberikan UI desain material pada versi platform lama.

Sebagai alternatif untuk Image Asset Studio, Anda bisa menggunakan Vector Asset Studio untuk membuat bilah aksi dan ikon tab. Drawable vektor sesuai untuk ikon sederhana dan bisa memperkecil ukuran APK Anda.

Ikon pemberitahuan

Pemberitahuan adalah pesan yang bisa ditampilkan kepada pengguna di luar UI normal aplikasi Anda. Bila Anda memberi tahu sistem untuk menerbitkannya, pemberitahuan akan muncul lebih dahulu sebagai ikon dalam area pemberitahuan. Untuk melihat detail pemberitahuan, pengguna membuka panel samping pemberitahuan. Baik area pemberitahuan maupun panel samping pemberitahuan adalah area dikontrol-sistem yang bisa dilihat pengguna kapan saja.

Image Asset Studio secara otomatis membuat ikon terpisah untuk kepadatan layar umum yang direkomendasikan, termasuk mdpi, hdpi, xhdpi, dan xxhdpi. Ini menempatkan ikon di lokasi yang tepat dalam direktori res/drawable-density/:

Jika aplikasi Anda mendukung Android 2.3 sampai 2.3.7 (API level 9 sampai 10), Image Asset Studio menghasilkan versi ikon abu-abu. Versi Android yang lebih baru menggunakan ikon putih yang dihasilkan Image Asset Studio.

Lihat Notifikasi; Notifications Material Design; Notifikasi, Perubahan Android 5.0; Notifikasi, Android 4.4 dan yang Lebih Rendah; dan Ikon Bilah Status, Android 3.0 dan yang Lebih Rendah untuk informasi selengkapnya.

Clip art

Image Asset Studio memudahkan Anda dalam mengimpor ikon material Google dalam bentuk PNG: cukup memilih sebuah ikon dari dialog. Untuk informasi selengkapnya, lihat Material Icons.

Gambar

Anda bisa mengimpor gambar Anda sendiri dan menyesuaikannya dengan tipe ikon. Image Asset Studio mendukung jenis file berikut: PNG (disarankan), JPG (diterima), dan GIF (tidak disarankan).

String teks

Image Asset Studio memungkinkan Anda mengetik string teks dalam berbagai font, dan menempatkannya pada sebuah ikon. Image Asset Studio mengubah ikon berbasis teks menjadi file PNG untuk kepadatan yang berbeda. Anda bisa menggunakan font yang terpasang di komputer.

Menjalankan Image Asset Studio

Untuk memulai Image Asset Studio, ikuti langkah-langkah berikut:

  1. Di Android Studio, buka sebuah proyek aplikasi Android.
  2. Di jendela Project, pilih Android view.
  3. Pilih folder res, kemudian pilih File > New > Image Asset.
  4. Sebagai alternatif, klik-kanan folder res dan pilih New > Image Asset.

    Beberapa tampilan proyek dan folder lainnya juga memiliki item menu ini.

    Image Asset Studio muncul.

  5. Lanjutkan dengan Membuat Ikon Peluncur, Membuat Bilah Aksi atau Ikon Tab, atau Membuat Ikon Pemberitahuan.

Membuat Ikon Peluncur

Setelah Anda membuka Image Asset Studio, Anda bisa menambahkan ikon peluncur dengan melakukan langkah-langkah ini:

  1. Dalam bidang Icon Type, pilih Launcher Icons.
  2. Pilih Asset Type, lalu tetapkan aset dalam bidang di bawahnya:
    • Dalam bidang Clip Art, klik tombol tersebut.
    • Dalam dialog Select Icon, pilih material icon dan kemudian klik OK.

    • Dalam bidang Path, tentukan jalur dan nama file gambar. Klik ... untuk menggunakan dialog.
    • Dalam bidang Text, ketik string teks dan pilih sebuah font.

    Ikon akan muncul di area Source Asset di sebelah kanan, dan area pratinjau di bagian bawah wizard.

  3. Anda memiliki pilihan untuk mengubah nama dan setelan tampilan:
    • Name - Jika Anda tidak ingin menggunakan nama default, ketik nama baru. Jika nama sumber daya sudah ada dalam proyek, seperti yang ditunjukkan oleh kesalahan di bagian bawah wizard, itu akan ditimpa. Nama hanya boleh berisi karakter huruf kecil, setrip bawah, dan angka.
    • Trim - Untuk menyesuaikan batas antara grafis ikon dan batas dalam aset sumber, pilih Yes. Operasi ini membuang ruang transparan, sembari mempertahankan rasio aspek. Bila tidak ingin mengubah aset sumber, pilih No. Default: No
    • Padding - Jika Anda ingin menyesuaikan pengisi aset sumber pada keempat sisinya, geser slider. Pilih nilai antara -10% sampai 50%. Jika Anda memilih Trim, pemangkasan akan terjadi terlebih dahulu. Default: 0%
    • Foreground - Untuk mengubah warna latar depan ikon Clip Art atau Text, klik bidang tersebut. Dalam dialog Select Color, tentukan warna kemudian klik Choose. Nilai baru akan muncul dalam bidang. Default: 000000
    • Background - Untuk mengubah warna latar belakang, klik bidang tersebut. Dalam dialog Select Color, tentukan warna kemudian klik Choose. Nilai baru akan muncul dalam bidang. Default: FFFFFF
    • Scaling - Untuk menyesuaikan ukuran ikon, pilih Crop atau Shrink to Fit. Dengan crop, tepi gambar bisa terpotong, namun dengan shrink, tepi gambar tidak terpotong. Anda bisa menyesuaikan pengisi, bila diperlukan, jika aset sumber tetap tidak bisa pas. Default: Shrink to Fit
    • Shape - Untuk meletakkan latar di belakang aset sumber, pilih sebuah bentuk, circle, square, vertical rectangle, atau horizontal rectangle. Untuk latar belakang transparan, pilih None. Default: Square
    • Effect - Jika Anda ingin menambahkan efek dog-ear pada bentuk persegi atau persegi panjang, pilih DogEar. Jika tidak, pilih None. Default: None

    Image Asset Studio menempatkan ikon dalam persegi transparan sehingga ada suatu pengisi di bagian tepinya. Pengisi memberikan ruang yang mencukupi untuk efek ikon drop-shadow standar.

  4. Klik Next.
  5. Anda memiliki pilihan untuk mengubah direktori sumber daya:
    • Res Directory - Pilih set sumber daya yang ingin Anda tambahkan dengan aset gambar: src/main/res, src/debug/res, src/release/res, atau set sumber yang ditetapkan pengguna. Set sumber utama diterapkan ke semua varian versi, termasuk debug dan rilis. Set sumber debug dan rilis akan menggantikan set sumber utama dan diterapkan untuk satu versi pembangunan. Set sumber debug hanya untuk men-debug. Untuk mendefinisikan set sumber baru, pilih File > Project Structure > app > Build Types. Misalnya, Anda bisa mendefinisikan set sumber beta dan membuat versi ikon yang menyertakan teks "BETA” di sudut kanan bawah. Untuk informasi selengkapnya, lihat Mengonfigurasi Varian Pembangunan.

    Area Output Directories menampilkan gambar dan folder tempat direktori akan muncul dalam tampilan File Proyek dari jendela Project.

  6. Klik Finish.
  7. Image Asset Studio menambahkan gambar ke dalam folder mipmap untuk kepadatan berbeda.

Membuat Bilah Aksi atau Ikon Tab

Setelah Anda membuka Image Asset Studio, Anda bisa menambahkan bilah aksi atau ikon tab dengan mengikuti langkah-langkah berikut:

  1. Dalam bidang Icon Type, pilih Action Bar and Tab Icons.
  2. Pilih Asset Type, lalu tetapkan aset dalam bidang di bawahnya:
    • Dalam bidang Clip Art, klik tombol tersebut.
    • Dalam dialog Select Icon, pilih material icon dan kemudian klik OK.

    • Dalam bidang Path, tentukan jalur dan nama file gambar. Klik ... untuk menggunakan dialog.
    • Dalam bidang Text, ketik string teks dan pilih sebuah font.

    Ikon akan muncul di area Source Asset di sebelah kanan, dan area pratinjau di bagian bawah wizard.

  3. Anda memiliki pilihan untuk mengubah nama dan opsi tampilan:
    • Name - Jika Anda tidak ingin menggunakan nama default, ketik nama baru. Jika nama sumber daya sudah ada dalam proyek, seperti yang ditunjukkan oleh kesalahan di bagian bawah wizard, itu akan ditimpa. Nama hanya boleh berisi karakter huruf kecil, setrip bawah, dan angka.
    • Trim - Untuk menyesuaikan batas antara grafis ikon dan batas dalam aset sumber, pilih Yes. Operasi ini membuang ruang transparan, sembari mempertahankan rasio aspek. Bila tidak ingin mengubah aset sumber, pilih No. Default: No
    • Padding - Jika Anda ingin menyesuaikan pengisi aset sumber pada keempat sisinya, geser slider. Pilih nilai antara -10% sampai 50%. Jika Anda memilih Trim, pemangkasan akan terjadi terlebih dahulu. Default: 0%
    • Theme - Pilih HOLO_LIGHT atau HOLO_DARK. Atau, untuk memilih warna dalam dialog Select Color, pilih CUSTOM kemudian klik bidang Custom color. Default: None

    Image Asset Studio membuat ikon dalam persegi transparan sehingga ada suatu pengisi di bagian tepinya. Pengisi memberikan ruang yang mencukupi untuk efek ikon drop-shadow standar.

  4. Klik Next.
  5. Anda memiliki pilihan untuk mengubah direktori sumber daya:
    • Res Directory - Pilih set sumber daya yang ingin Anda tambahkan dengan aset gambar: src/main/res, src/debug/res, src/release/res, atau set sumber yang ditetapkan pengguna. Set sumber utama diterapkan ke semua varian versi, termasuk debug dan rilis. Set sumber debug dan rilis akan menggantikan set sumber utama dan diterapkan untuk satu versi pembangunan. Set sumber debug hanya untuk men-debug. Untuk mendefinisikan set sumber baru, pilih File > Project Structure > app > Build Types. Misalnya, Anda bisa mendefinisikan set sumber beta dan membuat versi ikon yang menyertakan teks "BETA” di sudut kanan bawah. Untuk informasi selengkapnya, lihat Mengonfigurasi Varian Pembangunan.

    Area Output Directories menampilkan gambar dan folder tempat direktori akan muncul dalam tampilan File Proyek dari jendela Project.

  6. Klik Finish.
  7. Image Asset Studio menambahkan gambar dalam folder drawable untuk kepadatan berbeda.

Membuat Ikon Pemberitahuan

Setelah Anda membuka Image Asset Studio, Anda bisa menambahkan ikon pemberitahuan dengan mengikuti langkah-langkah berikut:

  1. Dalam bidang Icon Type, pilih Notification Icons.
  2. Pilih Asset Type, lalu tetapkan aset dalam bidang di bawahnya:
    • Dalam bidang Clip Art, klik tombol tersebut.
    • Dalam dialog Select Icon, pilih material icon dan kemudian klik OK.

    • Dalam bidang Path, tentukan jalur dan nama file gambar. Klik ... untuk menggunakan dialog.
    • Dalam bidang Text, ketik string teks dan pilih sebuah font.

    Ikon akan muncul di area Source Asset di sebelah kanan, dan area pratinjau di bagian bawah wizard.

  3. Anda memiliki pilihan untuk mengubah nama dan opsi tampilan:
    • Name - Jika Anda tidak ingin menggunakan nama default, ketik nama baru. Jika nama sumber daya sudah ada dalam proyek, seperti yang ditunjukkan oleh kesalahan di bagian bawah wizard, itu akan ditimpa. Nama hanya boleh berisi karakter huruf kecil, setrip bawah, dan angka.
    • Trim - Untuk menyesuaikan batas antara grafis ikon dan batas dalam aset sumber, pilih Yes. Operasi ini membuang ruang transparan, sembari mempertahankan rasio aspek. Bila tidak ingin mengubah aset sumber, pilih No. Default: No
    • Padding - Jika Anda ingin menyesuaikan pengisi aset sumber pada keempat sisinya, geser slider. Pilih nilai antara -10% sampai 50%. Jika Anda memilih Trim, pemangkasan akan terjadi terlebih dahulu. Default: 0%

    Image Asset Studio membuat ikon dalam persegi transparan sehingga ada suatu pengisi di bagian tepinya. Pengisi memberikan ruang yang mencukupi untuk efek ikon drop-shadow standar.

  4. Klik Next.
  5. Anda memiliki pilihan untuk mengubah direktori sumber daya:
    • Res Directory - Pilih set sumber daya yang ingin Anda tambahkan dengan aset gambar: src/main/res, src/debug/res, src/release/res, atau set sumber yang ditetapkan pengguna. Set sumber utama diterapkan ke semua varian versi, termasuk debug dan rilis. Set sumber debug dan rilis akan menggantikan set sumber utama dan diterapkan untuk satu versi pembangunan. Set sumber debug hanya untuk men-debug. Untuk mendefinisikan set sumber baru, pilih File > Project Structure > app > Build Types. Misalnya, Anda bisa mendefinisikan set sumber beta dan membuat versi ikon yang menyertakan teks "BETA” di sudut kanan bawah. Untuk informasi selengkapnya, lihat Mengonfigurasi Varian Pembangunan.

    Area Output Directories menampilkan gambar dan folder tempat direktori akan muncul dalam tampilan File Proyek dari jendela Project.

  6. Klik Finish.
  7. Image Asset Studio menambahkan gambar dalam folder drawable untuk kepadatan dan versi yang berbeda.

Merujuk ke Sumber Daya Gambar dalam Kode

Biasanya Anda bisa merujuk sumber daya gambar secara biasa dalam kode, dan ketika aplikasi dijalankan, gambar yang bersesuaian akan ditampilkan secara otomatis tergantung pada perangkat:

Anda hanya bisa mengakses sumber daya gambar dari thread utama.

Setelah Anda memiliki sumber daya gambar dalam direktori res/ dari proyek, Anda bisa merujuknya dari kode Java atau layout XML menggunakan ID sumber daya. Kode Java berikut menyetel ImageView untuk menggunakan sumber daya drawable/myimage.png:

ImageView imageView = (ImageView) findViewById(R.id.myimageview);
imageView.setImageResource(R.drawable.myimage);

Lihat Mengakses Sumber Daya untuk informasi selengkapnya.

Untuk ikon peluncur, file AndroidManifest.xml harus mereferensikan lokasi mipmap/. Image Asset Studio menambahkan kode ini secara otomatis. Kode file manifes berikut mereferensikan ikon ic_launcher dalam direktori mipmap/:

<application android:name="ApplicationTitle"
         android:label="@string/app_label"
         android:icon="@mipmap/ic_launcher" >

Menghapus Ikon dari Proyek

Untuk membuang ikon dari sebuah proyek:

  1. Di jendela Project, pilih Android view.
  2. Luaskan folder res/mipmap untuk ikon peluncur, atau folder res/drawable untuk tipe ikon lain.
  3. Temukan subfolder dengan nama ikon yang ingin Anda hapus.
  4. Folder ini berisi ikon dengan kepadatan berbeda.

  5. Pilih folder dan tekan tombol Delete.
  6. Atau, pilih Edit > Delete. Atau klik-kanan file dan pilih Delete.

    Dialog Safe Delete akan muncul.

  7. Secara opsional pilih opsi untuk menemukan lokasi ikon digunakan dalam proyek, lalu klik OK.
  8. Android Studio menghapus file dari proyek dan drive. Akan tetapi, jika Anda memutuskan untuk menelusuri proyek yang menggunakan file tersebut dan menemukan beberapa penggunaannya, Anda bisa menampilkannya dan memutuskan apakah akan menghapusnya. Anda harus menghapus atau mengganti referensinya agar bisa mengompilasikan proyek dengan sukses.

  9. Pilih Build > Clean Project.
  10. Android Studio membuang file gambar apa pun yang dihasilkan terkait sumber daya gambar yang dihapus. Android Studio menghapusnya dari proyek dan drive.

  11. Jika diperlukan, perbaiki kesalahan yang masih ada karena bagian kode yang merujuk ke sumber daya tersebut.
  12. Android Studio menyorot kesalahan ini dalam kode Anda. Bila Anda telah membuang semua referensi dari kode, Anda bisa membangun proyek Anda lagi.

This site uses cookies to store your preferences for site-specific language and display options.

Get the latest Android developer news and tips that will help you find success on Google Play.

* Required Fields

Hooray!

Follow Google Developers on WeChat

Browse this site in ?

You requested a page in , but your language preference for this site is .

Would you like to change your language preference and browse this site in ? If you want to change your language preference later, use the language menu at the bottom of each page.

This class requires API level or higher

This doc is hidden because your selected API level for the documentation is . You can change the documentation API level with the selector above the left navigation.

For more information about specifying the API level your app requires, read Supporting Different Platform Versions.

Take a short survey?
Help us improve the Android developer experience.
(Sep 2017 survey)