Android PNG画像をVectorに変換する

2017年以降 ブログ更新が停滞していたので、シンプル単語帳のアップデートを進める中での課題から。

アプリ内で使う小さい画像ファイルは DPI ごとに用意していて、より大きな解像度が登場すると作り直すようなことをしていたが、これをやらなくて済むようにするのと、アプリのサイズを少しでも減らせたらという思いで、今さらながら VectorDrawable を試した。

対象としたのは「↓」という感じの画像で、以下のようなXMLで簡単につくれる。

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="48dp"
    android:width="48dp"
    android:viewportHeight="100"
    android:viewportWidth="100" >
    <group
        android:name="arrow">
        <path
            android:name="line"
            android:fillColor="#ffffa713"
            android:pathData="m 25,0 l 0,50 50,0 0,-50 z" />
        <path
            android:name="triangle"
            android:fillColor="#ffffa713"
            android:pathData="m 0,50 l 100,0 -50,50 z" />
    </group>
</vector>

結果は以下のような画像になる。

アニメーションを取り入れるのがより良い使い方と思われるが、目的は達成できた。

パスの編集には以下が参考になる。

Understanding VectorDrawable pathData commands in Android