Android Dev Summit, October 23-24: two days of technical content, directly from the Android team. Sign-up for livestream updates.

Menambahkan grafis vektor multi-kepadatan

Android Studio menyertakan fitur bernama Vector Asset Studio yang membantu Anda menambahkan ikon material dan mengimpor file Scalable Vector Graphic (SVG) dan Adobe Photoshop Document (PSD) ke dalam project sebagai resource vector drawable. Penggunaan vector drawable sebagai ganti bitmap akan mengurangi ukuran APK karena file yang sama dapat diubah ukurannya untuk kepadatan layar yang berbeda tanpa mengurangi kualitas gambar. Untuk Android versi lama yang tidak mendukung vector drawable, Vector Asset Studio dapat, selama proses build, mengubah resource vector drawable menjadi beragam ukuran bitmap untuk setiap kepadatan layar.

Tentang Vector Asset Studio

Vector Asset Studio menambahkan grafis vektor ke project sebagai file XML yang menjelaskan gambar tersebut. Memelihara satu file XML lebih mudah daripada mengupdate beberapa grafis raster pada beragam resolusi.

Android 4.4 (API level 20) dan yang lebih rendah tidak mendukung vector drawable. Jika API level minimum Anda disetel pada salah satu API level ini, Anda memiliki dua opsi saat menggunakan Vector Asset Studio: menghasilkan file Portable Network Graphic (PNG) (default) atau menggunakan Support Library.

Untuk kompatibilitas dengan versi sebelumnya, Vector Asset Studio menghasilkan gambar raster dari vector drawable. Vector dan raster drawable tersebut akan dikemas bersama dalam APK. Anda dapat merujuk ke vector drawable sebagai Drawable dalam kode Java atau @drawable dalam kode XML; saat aplikasi berjalan, gambar vektor atau raster yang sesuai akan ditampilkan secara otomatis, bergantung pada tingkat API.

Jika ingin menggunakan vector drawable saja, Anda dapat menggunakan Android Support Library 23.2 atau yang lebih tinggi. Teknik ini mengharuskan perubahan pada file build.gradle sebelum Anda menjalankan Vector Asset Studio, seperti yang dijelaskan dalam Kompatibilitas Support Library dengan Versi Sebelumnya. Class VectorDrawableCompat dalam Support Library memungkinkan Anda menggunakan VectorDrawable di Android 2.1 (API level 7) dan yang lebih tinggi.

Jenis grafis vektor yang didukung

Spesifikasi Google Material Design menyediakan ikon material yang dapat Anda gunakan dalam aplikasi Android. Vector Asset Studio membantu Anda memilih, mengimpor, dan mengukur ikon material, serta menentukan opasitas dan setelan pencerminan Right-to-Left (RTL).

Vector Asset Studio juga memungkinkan Anda mengimpor file SVG dan PSD milik sendiri. SVG adalah standar terbuka berbasis-XML dari World Wide Web Consortium (W3C). Format file PSD mendukung berbagai fitur Adobe Photoshop. Vector Asset Studio mendukung fitur standar yang penting, namun tidak semua fitur SVG dan PSD. Saat Anda menetapkan file SVG atau PSD, Vector Asset Studio akan memberikan masukan langsung mengenai apakah kode grafis tersebut didukung atau tidak. Vector Asset Studio akan mengonversi file ini menjadi file XML yang berisi kode VectorDrawable. Jika menerima pesan error, sebaiknya Anda memverifikasi apakah vector drawable muncul sebagaimana yang diinginkan. Untuk informasi selengkapnya mengenai fitur PSD yang diperbolehkan, lihat Dukungan dan pembatasan untuk file PSD.

Untuk Android 5.0 (API level 21) dan yang lebih tinggi, Anda dapat menggunakan class AnimatedVectorDrawable untuk menganimasikan properti class VectorDrawable. Dengan Support Library, Anda dapat menggunakan class AnimatedVectorDrawableCompat guna menganimasikan class VectorDrawable untuk Android 3.0 (API level 11) dan lebih tinggi. Untuk informasi selengkapnya, lihat Menganimasikan vector drawable.

Pertimbangan untuk file SVG dan PSD

Vector drawable dapat digunakan untuk ikon sederhana. Ikon material memberikan contoh bagus untuk jenis gambar yang berfungsi dengan baik sebagai vector drawable dalam aplikasi. Sebaliknya, banyak ikon peluncuran aplikasi berisi banyak detail, sehingga ikon aplikasi tersebut akan berfungsi lebih baik sebagai gambar raster.

Pemuatan awal vector drawable dapat menggunakan lebih banyak putaran CPU daripada gambar raster yang terkait. Selain itu, penggunaan dan performa memori keduanya akan serupa. Kami menyarankan agar Anda membatasi gambar vektor ke maksimum 200 x 200 dp; jika tidak, proses menggambar akan memerlukan waktu terlalu lama.

Meskipun vector drawable mendukung satu atau beberapa warna, dalam banyak kasus, akan lebih baik jika warna ikon ditetapkan ke hitam (android:fillColor="#FF000000"). Dengan menggunakan pendekatan ini, Anda dapat menambahkan tint ke vector drawable yang ditempatkan di tata letak, dan warna ikon akan berubah sesuai warna tint. Jika warna ikon bukan hitam, maka sebaliknya warna ikon akan menyatu dengan warna tint.

Solusi kompatibilitas vector drawable dengan versi sebelumnya

Tabel berikut merangkum dua teknik yang dapat Anda gunakan untuk kompatibilitas dengan versi sebelumnya:

Teknik Drawable di APK Elemen XML VectorDrawable Versi Build flag Kode aplikasi
Pembuatan PNG Vektor dan raster Didukung subset

SVG: Android Plugin untuk Gradle 1.5.0 atau yang lebih tinggi

PSD: Android Studio 2.2 atau yang lebih tinggi

Default Mendukung berbagai teknik coding
Support Library 23.2 atau yang lebih tinggi Vektor Dukungan penuh Android Plugin untuk Gradle 2.0 atau yang lebih tinggi Diperlukan pernyataan Support Library Mendukung berbagai teknik coding

Penggunaan vector drawable dapat menghasilkan ukuran APK yang lebih kecil, tetapi pemuatan awal vector drawbale dapat memerlukan waktu lebih lama.

Pembuatan PNG

Android 5.0 (API level 21) dan yang lebih tinggi menyediakan dukungan vector drawable. Jika aplikasi Anda memiliki level API minimum yang lebih rendah, Vector Asset Studio akan menambahkan file vector drawable ke project; dan, pada waktu pembuatan, Gradle akan membuat gambar raster PNG dengan beragam resolusi. Gradle menghasilkan kepadatan PNG yang ditentukan oleh properti generatedDensities Domain Specific Language (DSL) dalam file build.gradle.

Untuk Android 5.0 (API level 21) dan yang lebih tinggi, Vector Asset Studio mendukung semua elemen VectorDrawable. Untuk kompatibilitas dengan Android 4.4 (API level 20) dan yang lebih rendah, Vector Asset Studio mendukung elemen XML berikut:

<vector>

  • android:width
  • android:height
  • android:viewportWidth
  • android:viewportHeight
  • android:alpha

<group>

  • android:rotation
  • android:pivotX
  • android:pivotY
  • android:scaleX
  • android:scaleY
  • android:translateX
  • android:translateY

<path>

  • android:pathData
  • android:fillColor
  • android:strokeColor
  • android:strokeWidth
  • android:strokeAlpha
  • android:fillAlpha
  • android:strokeLineCap
  • android:strokeLineJoin
  • android:strokeMiterLimit

Anda dapat mengubah kode XML yang dihasilkan Vector Asset Studio, walaupun kode XML tersebut bukan praktik terbaik. Mengubah nilai dalam kode seharusnya tidak menyebabkan masalah apa pun, asalkan nilai dalam kode valid dan statis. Jika Anda ingin menambahkan elemen XML, Anda perlu memastikan elemen XML tersebut didukung berdasarkan level API minimum.

Support Library

Teknik ini memerlukan Android Support Library 23.2 atau yang lebih tinggi dan Android Plugin untuk Gradle 2.0 atau yang lebih tinggi, serta hanya menggunakan vector drawable. Class VectorDrawableCompat dalam Support Library memungkinkan Anda mendukung VectorDrawable di Android 2.1 (API level 7) dan yang lebih tinggi.

Sebelum menggunakan Vector Asset Studio, Anda harus menambahkan pernyataan ke file build.gradle:

    android {
      defaultConfig {
        vectorDrawables.useSupportLibrary = true
      }
    }

    dependencies {
      compile 'com.android.support:appcompat-v7:23.2.0'
    }
    

Anda juga harus menggunakan teknik coding yang kompatibel dengan Support Library, seperti menggunakan atribut app:srcCompat daripada atribut android:src untuk vector drawable. Untuk informasi selengkapnya, lihat Android Support Library 23.2.

Menjalankan Vector Asset Studio

Untuk memulai Vector Asset Studio:

  1. Di Android Studio, buka project aplikasi Android.
  2. Di jendela Project, pilih tampilan Android.
  3. Klik-kanan pada folder res dan pilih New > Vector Asset.
  4. Beberapa tampilan project dan folder lainnya juga memiliki tampilan item menu seperti ini.

    Vector Asset Studio akan muncul.

    Gambar 1. Vector Asset Studio.

  5. Jika yang muncul justru dialog Need Newer Android Plugin for Gradle, betulkan versi Gradle Anda seperti berikut:
    1. Pilih File > Project Structure.
    2. Pada dialog Project Structure, pilih Project.
    3. Pada kolom Android Plugin Version, ubah versi Android Plugin untuk Gradle ke 1.5.0 atau yang lebih tinggi, lalu klik OK.
    4. Gradle akan menyinkronkan project.

    5. Dalam tampilan Android di jendela Project, klik kanan pada folder res dan pilih New > Vector Asset.
    6. Vector Asset Studio akan muncul.

  6. Lanjutkan dengan Mengimpor Grafis Vektor.

Mengimpor Grafis Vektor

Vector Asset Studio membantu Anda mengimpor grafis vektor ke dalam project aplikasi. Ikuti salah satu dari prosedur berikut:

Menambahkan ikon material

Setelah membuka Vector Asset Studio, Anda dapat menambahkan ikon material seperti berikut:

  1. Di Vector Asset Studio, pilih Material Icon.
  2. Di kolom Icon, klik tombol Icon.
  3. Dialog Select Icon akan muncul. Anda dapat memfilter ikon yang terlihat dengan memilih kategori ikon dari daftar di sebelah kiri atau mengetik di kolom penelusuran seperti yang ditunjukkan pada gambar 2.

    Gambar 2. Memfilter ikon material di Vector Asset Studio.

  4. Pilih ikon material lalu klik OK. Ikon tersebut muncul di Vector Drawable Preview.

  5. Anda memiliki pilihan untuk mengubah nama resource, ukuran, opasitas, dan setelan pencerminan Right-To-Left (RTL):
    • Name - Ketik nama baru jika Anda tidak ingin menggunakan nama default. Vector Asset Studio secara otomatis membuat sebuah nama unik (menambahkan angka pada akhir nama) jika nama resource sudah ada dalam project. Nama hanya boleh berisi karakter huruf kecil, garis bawah, dan angka.
    • Override - Pilih opsi ini jika Anda ingin menyesuaikan ukuran gambar. Saat Anda mengetik ukuran baru, perubahan tersebut akan muncul di area pratinjau.
    • Default gambar adalah 24 x 24 dp, yang ditentukan dalam spesifikasi desain material Batalkan pilihan kotak centang untuk mengembalikan ke nilai default.

    • Opacity - Gunakan penggeser untuk menyesuaikan opasitas gambar. Perubahan akan muncul di area pratinjau.
    • Enable auto mirroring for RTL layout - Pilih opsi ini jika Anda ingin gambar pencerminan ditampilkan saat tata letak disetel kanan ke kiri, sebagai ganti kiri ke kanan. Misalnya, beberapa bahasa dibaca dari kanan ke kiri; jika Anda menggunakan ikon panah, maka dalam hal ini Anda mungkin perlu menampilkan gambar hasil pencerminannya. Perhatikan bahwa jika Anda bekerja dengan project lama, Anda mungkin juga perlu menambahkan android:supportsRtl="true" ke manifes aplikasi. Auto-mirroring didukung di Android 5.0 (API level 21) dan lebih tinggi, serta dengan Support Library.
  6. Klik Next.
  7. Anda memiliki pilihan untuk mengubah modul dan direktori resource:
    • Res Directory - Pilih kumpulan sumber untuk resource yang ingin Anda tambah dengan vector drawable: src/main/res, src/debug/res, src/release/res, atau kumpulan sumber yang ditentukan pengguna. Kumpulan sumber utama diterapkan ke semua varian build, termasuk debug dan rilis. Kumpulan sumber debug dan rilis akan menggantikan kumpulan sumber utama dan diterapkan ke satu versi build. Kumpulan sumber debug hanya untuk men-debug. Untuk menentukan kumpulan sumber baru, pilih File > Project Structure > app > Build Types. Misalnya, Anda dapat menentukan kumpulan sumber beta dan membuat versi ikon yang menyertakan teks "BETA” di sudut kanan bawah. Untuk informasi selengkapnya, lihat Mengonfigurasi Varian Build.

    Area Output Directories menampilkan vector drawable dan direktori tempat munculnya.

  8. Klik Finish.
  9. Vector Asset Studio menambahkan file XML yang mendefinisikan vector drawable ke project di folder app/src/main/res/drawable/. Dari tampilan Android di jendela Project, Anda dapat menampilkan file XML vektor yang dihasilkan dalam folder drawable.

  10. Buat project.
  11. Jika level API minimum adalah Android 4.4 (API level 20) dan yang lebih rendah, dan Anda belum mengaktifkan teknik Support Library, Vector Asset Studio akan menghasilkan file PNG. Dari tampilan File Project di jendela Project, Anda dapat menampilkan file PNG and XML yang dihasilkan di folder app/build/generated/res/pngs/debug/.

    Anda tidak boleh mengedit file raster yang dihasilkan ini, melainkan mengunakan file XML vektor sebagai gantinya. Sistem build akan menghasilkan kembali file raster secara otomatis jika diperlukan, jadi Anda tidak perlu mengelolanya.

Mengimpor file SVG atau PSD

Setelah membuka Vector Asset Studio, Anda dapat mengimpor file SVG atau PSD seperti berikut:

  1. Di Vector Asset Studio, pilih Local file.
  2. File tersebut harus berada di drive lokal. Jika terletak di jaringan, misalnya, Anda perlu mendownloadnya ke drive lokal terlebih dahulu.

  3. Tetapkan Image file dengan mengklik .
  4. Gambar akan muncul di Vector Drawable Preview.

    Jika file SVG atau PSD berisi fitur yang tidak didukung, pesan error akan muncul di bagian bawah Vector Asset Studio, seperti yang ditampilkan dalam gambar 2.

    Gambar 3. Vector Asset Studio menampilkan beberapa error.

    Jika melihat error, Anda perlu memastikan bahwa vector drawable yang telah diimpor telah dirender dengan benar. Scroll daftar untuk melihat error.

    Untuk daftar elemen yang didukung, lihat Solusi Kompatibilitas Vector Drawable dengan versi sebelumnya. Untuk informasi selengkapnya tentang file PSD yang diizinkan, lihat Dukungan dan Pembatasan untuk File PSD.

  5. Anda memiliki pilihan untuk mengubah nama resource, ukuran, opasitas, dan setelan pencerminan Right-To-Left (RTL):
    • Name - Ketik nama baru jika Anda tidak ingin menggunakan nama default. Vector Asset Studio secara otomatis membuat nama unik (menambahkan angka pada akhir nama) jika nama resource sudah ada dalam project. Nama hanya boleh berisi karakter huruf kecil, garis bawah, dan angka.
    • Override - Pilih opsi ini jika Anda ingin menyesuaikan ukuran gambar. Setelah memilih opsi tersebut, ukuran akan berubah ke ukuran asli gambar. Setiap kali Anda mengubah ukuran, perubahan tersebut akan muncul di area pratinjau. Default ukuran gambar adalah 24 x 24 dp, yang didefinisikan dalam spesifikasi desain material.
    • Opacity - Gunakan penggeser untuk menyesuaikan opasitas gambar. Perubahan akan muncul di area pratinjau.
    • Enable auto mirroring for RTL layout - Pilih opsi ini jika Anda ingin gambar pencerminan ditampilkan saat tata letak disetel kanan ke kiri, sebagai ganti kiri ke kanan. Misalnya, beberapa bahasa dibaca dari kanan ke kiri; jika Anda menggunakan ikon panah, maka dalam hal ini Anda mungkin perlu menampilkan gambar hasil pencerminannya. Perhatikan bahwa jika Anda mengerjakan project lama, mungkin Anda perlu menambahkan android:supportsRtl="true" ke manifes aplikasi Anda. Auto-mirroring didukung oleh Android 5.0 (API level 21) dan yang lebih tinggi, serta Support Library.
  6. Klik Next.
  7. Anda memiliki pilihan untuk mengubah direktori resource:
    • Res Directory - Pilih kumpulan sumber untuk resource yang ingin Anda tambah dengan vector drawable: src/main/res, src/debug/res, src/release/res, atau kumpulan sumber yang ditentukan pengguna. Kumpulan sumber utama diterapkan ke semua varian build, termasuk debug dan rilis. Kumpulan sumber debug dan rilis akan menggantikan kumpulan sumber utama dan diterapkan ke satu versi build. Kumpulan sumber debug hanya untuk men-debug. Untuk menentukan kumpulan sumber baru, pilih File > Project Structure > app > Build Types. Misalnya, Anda dapat menentukan kumpulan sumber beta dan membuat versi ikon yang menyertakan teks "BETA” di sudut kanan bawah. Untuk informasi selengkapnya, lihat Mengonfigurasi Varian Build.

    Area Output Directories menampilkan vector drawable dan direktori tempat munculnya.

  8. Klik Finish.
  9. Vector Asset Studio menambahkan file XML yang mendefinisikan vector drawable ke project di folder app/src/main/res/drawable/. Dari tampilan Android di jendela Project, Anda dapat menampilkan file XML vektor yang dihasilkan dalam folder drawable.

  10. Buat project.
  11. Jika level API minimum adalah Android 4.4 (API level 20) dan yang lebih rendah, dan Anda belum mengaktifkan teknik Support Library, Vector Asset Studio akan menghasilkan file PNG. Dari tampilan File Project di jendela Project, Anda dapat menampilkan file PNG and XML yang dihasilkan di folder app/build/generated/res/pngs/debug/.

    Anda tidak boleh mengedit file raster yang dihasilkan ini, melainkan mengunakan file XML vektor sebagai gantinya. Sistem build akan menghasilkan kembali file raster secara otomatis jika diperlukan, jadi Anda tidak perlu mengelolanya.

Menambahkan vector drawable ke tata letak

Dalam file tata letak, Anda dapat mengatur widget terkait ikon apa pun, seperti ImageButton, ImageView, dan sebagainya, untuk menunjuk ke gambar vektor. Misalnya, tata letak berikut menampilkan vector drawable yang ditampilkan pada tombol:

Gambar 4. Vector drawable yang ditampilkan pada tombol dalam tata letak.

Untuk menampilkan vector drawable pada widget, seperti yang ditampilkan dalam gambar:

  1. Buka project dan impor vector drawable.
  2. Contoh ini menggunakan project Ponsel/Tablet yang dihasilkan dengan New Project Wizard.

  3. Pada tampilan Android dari jendela Project, klik dua kali file XML tata letak, seperti content_main.xml.
  4. Klik tab Design untuk menampilkan Layout Editor.
  5. Tarik widget ImageButton dari jendela Palette ke Layout Editor.
  6. Pada dialog Resources, pilih Drawable di panel kiri, lalu pilih vector drawable yang telah Anda impor. Klik OK.
  7. Vector drawable akan muncul di ImageButton pada tata letak.

  8. Untuk mengubah warna gambar menjadi warna aksen yang didefinisikan dalam tema, pada jendela Properties, temukan properti tint lalu klik .
  9. Pada dialog Resources, pilih Color di panel kiri, lalu pilih colorAccent. Klik OK.
  10. Warna gambar akan berubah menjadi warna aksen di tata letak.

Jika project menggunakan Support Library, kode ImageButton harus sama dengan berikut ini:

    <ImageButton
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      app:srcCompat="@drawable/ic_build_black_24dp"
      tools:layout_editor_absoluteX="11dp"
      tools:layout_editor_absoluteY="225dp"
      android:id="@+id/imageButton"
      android:tint="@color/colorAccent" />
    

Jika project tidak menggunakan Support Library, kode vector drawable akan menjadi android:src="@drawable/ic_build_black_24dp".

Merujuk ke vector drawable dalam kode

Biasanya, Anda dapat merujuk ke vector drawable dengan cara biasa dalam kode Anda, dan saat aplikasi dijalankan, gambar vektor atau raster yang terkait akan otomatis ditampilkan, bergantung pada level API-nya:

  • Secara umum, Anda dapat merujuk ke vector drawable sebagai @drawable dalam kode XML atau Drawable dalam kode Java.
  • Misalnya, kode XML layout berikut akan menerapkan gambar ke tampilan:

        <ImageView
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:src="@drawable/myimage" />
        

    Kode Java berikut mengambil gambar sebagai Drawable:

    Kotlin

        val drawable = resources.getDrawable(R.drawable.myimage, theme)

    Java

        Resources res = getResources();
        Drawable drawable = res.getDrawable(R.drawable.myimage, getTheme());
        

    Metode getResources() berada di class Context, yang diterapkan untuk objek UI, seperti aktivitas, fragmen, tata letak, tampilan, dan seterusnya.

  • Jika aplikasi Anda menggunakan Support Library (bahkan jika Anda tidak memiliki pernyataan vectorDrawables.useSupportLibrary = true dalam file build.gradle), Anda juga dapat merujuk ke vector drawable dengan pernyataan app:srcCompat. Contoh:
  •     <ImageView
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            app:srcCompat="@drawable/myimage" />
        
  • Terkadang, Anda mungkin perlu menetapkan drawable resource ke class yang tepat, seperti saat Anda perlu menggunakan fitur spesifik dari class VectorDrawable. Caranya, Anda dapat menggunakan kode Java seperti berikut ini:
  • Kotlin

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            val vectorDrawable = drawable as VectorDrawable
        } else {
            val bitmapDrawable = drawable as BitmapDrawable
        }
        

    Java

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
           VectorDrawable vectorDrawable = (VectorDrawable) drawable;
        } else {
           BitmapDrawable bitmapDrawable = (BitmapDrawable) drawable;
        }
        

Anda hanya dapat mengakses resource vector drawable dari thread utama.

Untuk teknik Support Library, Anda harus menggunakan teknik coding yang kompatibel dengan Support Library. Untuk informasi selengkapnya, lihat Android Support Library 23.2.

Memodifikasi kode XML yang dihasilkan oleh Vector Asset Studio

Anda dapat memodifikasi kode XML drawable resource, tetapi tidak PNG dan kode XML yang sama dengan yang dihasilkan pada waktu pembuatan. Akan tetapi, kami tidak menyarankannya.

Saat menggunakan teknik pembuatan PNG, Vector Asset Studio akan memastikan bahwa vector drawable dan PNG sesuai, dan manifes berisi kode yang tepat. Jika Anda menambahkan kode yang tidak didukung pada Android 4.4 (API level 20) dan yang lebih rendah, gambar vektor dan PNG mungkin akan berbeda. Anda juga harus memastikan bahwa manifes berisi kode untuk mendukung perubahan Anda.

Untuk memodifikasi file XML vektor ketika Anda tidak menggunakan teknik Support Library:

  1. Di jendela Project, klik dua kali file XML vektor yang dihasilkan dalam folder drawable.
  2. File XML akan muncul di editor dan jendela Preview.

    Gambar 5. File XML vektor yang ditampilkan di Code Editor dan jendela Preview.

  3. Edit kode XML berdasarkan versi Android yang didukung pada level API minimum:
  4. Buat project dan periksa apakah vector drawable dan gambar raster yang terkait terlihat sama.
  5. Perlu diingat bahwa PNG yang dihasilkan dapat ditampilkan berbeda di jendela Preview daripada di aplikasi karena mesin rendering yang berbeda dan segala perubahan yang dibuat pada vector drawable sebelum pembuatan. Jika Anda menambahkan kode ke file XML vektor yang dibuat oleh Vector Asset Studio, semua fitur yang tidak didukung di Android 4.4 (API level 20) dan yang lebih rendah tidak akan muncul di file PNG yang dihasilkan. Oleh karena itu, ketika menambahkan kode, Anda harus selalu memeriksa apakah PNG yang dihasilkan sesuai dengan vector drawable. Caranya, Anda dapat mengklik dua kali PNG di tampilan Project Files pada jendela Project; margin kiri Code Editor juga menampilkan gambar PNG saat kode Anda merujuk ke resource drawable, seperti yang ditampilkan dalam gambar 6.

    Gambar 6. Gambar PNG ditampilkan di margin kiri Code Editor.

Menghapus vector drawable dari project

Untuk menghapus vector drawable dari project:

  1. Pada jendela Project, hapus file XML vektor yang dihasilkan dengan memilih file dan menekan tombol Delete (atau pilih Edit > Delete).
  2. Dialog Safe Delete akan muncul.

  3. Jika ingin, pilih opsi untuk mencari tahu tempat project digunakan, lalu klik OK.
  4. Android Studio akan menghapus file tersebut dari project dan drive. Akan tetapi, jika Anda memutuskan untuk mencari tempat dalam project di mana file tersebut digunakan dan menemukan beberapa penggunaan, Anda dapat menampilkannya dan memutuskan untuk menghapusnya atau tidak.

  5. Pilih Build > Clean Project.
  6. Semua file PNG dan XML yang dihasilkan secara otomatis yang terkait dengan vector drawable yang dihapus akan dihapus dari project dan drive.

Menghasilkan Aplikasi yang Berisi vector drawable

Jika Anda menggunakan teknik Support Library atau level minimum API Anda adalah Android 5.0 (API level 21) atau yang lebih tinggi, APK akan berisi vector drawable yang Anda tambahkan dengan Vector Asset Studio. Semua APK ini akan lebih kecil dibandingkan jika gambar vektor dikonversi ke PNG.

Saat level minimum API Anda menyertakan Android 4.4 (API level 20) atau yang lebih rendah, dan Anda memiliki vector drawable dan gambar raster yang sama di project, Anda memiliki dua opsi untuk menghasilkan file APK:

  • Buat satu APK yang menyertakan vector drawable dan representasi raster yang sama. Inilah solusi paling sederhana untuk diimplementasikan.
  • Buat APK terpisah untuk level API yang berbeda. Ketika Anda tidak menyertakan gambar raster yang sama dalam APK untuk Android 5.0 (API level 21) dan yang lebih tinggi, maka ukuran APK dapat menjadi jauh lebih kecil. Untuk informasi selengkapnya, lihat Dukungan Beberapa APK.

Dukungan dan pembatasan untuk file PSD

Tidak semua fitur file PSD didukung oleh Vector Asset Studio. Daftar berikut merangkum karakteristik PSD yang didukung dan yang tidak didukung, serta beberapa detail konversi.

Dokumen

Didukung:

  • Mode warna PSD untuk bitmap, hitam putih, indexed, RGB, Lab, atau CMYK.
  • Kedalaman warna 8, 16, atau 32 bit.

Detail konversi:

  • Dimensi dokumen PSD menjadi dimensi vector drawable dan area pandang.

Tidak didukung:

  • Mode warna PSD untuk duotone atau multisaluran.

Bentuk

Didukung:

  • Clipping mask, jika dasar klipping adalah bentuk lain.
  • Operasi bentuk, meliputi merge/add, intersect, subtract, dan exclude.

Tidak didukung:

  • Aturan pengisian ganjil-genap yang digunakan oleh bentuk-bentuk Photoshop. Di Android 6.0 (API level 23) dan yang lebih rendah, vector drawable hanya mendukung aturan pengisian nonzero. Pada bentuk-bentuk yang saling berpotongan sendiri, pembatasan ini bisa mengakibatkan perbedaan rendering antara PSD dan vector drawable yang dihasilkan. Untuk memperbaiki masalah ini, tambahkan android:fillType="evenOdd" pada bentuk dalam vector drawable. Contoh:
        <vector xmlns:android="https://schemas.android.com/apk/res/android"
            android:viewportHeight="168"
            android:height="24dp"
            android:viewportWidth="209"
            android:width="24dp">
    
            <path
                android:fillAlpha="1.0"
                android:fillColor="#000000"
                android:fillType="evenOdd"
                android:pathData="M24,58 L24,167 L114,167 L114,66 M64,1 L64,96 L208,96 L208,8 M1,97 L146,139 L172,47"/>
        </vector>
        

Bentuk garis dan isian

Didukung:

  • Bentuk garis, termasuk warna, opasitas, lebar, sambungan, penutup, garis putus-putus, dan kesejajaran.
  • Garis dan isian warna solid.
  • Warna isian dan garis ditetapkan sebagai RGB, Lab, atau CMYK.

Detail konversi:

  • Jika garis putus-putus, dipangkas menggunakan basis pemangkasan, atau menggunakan penyejajaran yang berbeda dengan bagian tengah, Vector Asset Studio akan mengonversinya menjadi bentuk isian di vector drawable.

Tidak didukung:

  • Garis dan isian warna selain solid, seperti gradien.

Opasitas

Didukung:

  • Layer bentuk dengan opasitas 0.

Detail konversi:

  • Vector Asset Studio melipatgandakan opasitas isian dengan opasitas layer untuk menghitung alfa isian.
  • Fitur ini melipatgandakan opasitas basis pemangkasan (jika ada) dengan alfa isian untuk menghitung alfa isian akhir.
  • Fitur ini melipatgandakan opasitas garis dengan opasitas layer untuk menghitung alfa garis.
  • Fitur ini melipatgandakan opasitas basis pemangkasan (jika ada) dengan alfa garis untuk menghitung alfa garis akhir.

Layer

Didukung:

  • Semua layer bentuk yang visible.

Detail konversi:

  • Vector Asset Studio menyimpan nama layer di vector drawable.

Tidak didukung:

  • Efek layer.
  • Layer teks dan penyesuaian.
  • Mode Blending (diabaikan).

Dukungan dan pembatasan untuk file SVG

Vector Asset Studio tidak mendukung semua fitur file SVG. Bagian berikut ini merangkum fitur yang didukung dan tidak didukung saat fitur mengkonversi file SVG menjadi VectorDrawable, beserta detail tambahan tentang proses konversi.

Fitur yang didukung

VectorDrawable mendukung semua fitur dari Tiny SVG 1.2 kecuali untuk teks.

Bentuk

VectorDrawable mendukung jalur SVG.

Fitur ini mengonversi bentuk dasar seperti lingkaran, persegi, dan poligon menjadi jalur.

Transformasi

Fitur ini mendukung matriks transformasi dan menerapkannya langsung ke jalur turunan.

Grup

Fitur ini mendukung elemen grup untuk penerjemahan, penskalaan, dan rotasi. Grup tidak mendukung properti opasitas.

Fitur ini juga menerapkan penataan grup atau opasitas ke jalur turunan.

Isian dan garis

Jalur dapat diisi dan diberi garis menggunakan warna solid atau gradien (linier, radial, atau sudut). Hanya garis terpusat yang didukung. Mode campuran tidak didukung. Jalur putus-putus tidak didukung.

Mask

Fitur ini mendukung satu mask pemangkasan per grup.

Fitur yang tidak didukung oleh pengimpor SVG

Semua fitur yang tidak tercantum di bagian Fitur yang didukung di atas tidak didukung. Fitur penting yang tidak didukung antara lain:

  • Efek filter: efek seperti drop shadow, blur, dan matriks warna tidak didukung.
  • Teks: konversi teks menjadi bentuk menggunakan fitur lain sangat disarankan.
  • Pola isian