1. 程式人生 > >Android利用vectordrawable實現軌跡動畫

Android利用vectordrawable實現軌跡動畫

Google終於在Android5.0中引入了向量圖,向量圖的特點很多,比如不管怎麼放大都不會變形,大小也比png小很多,而且利用向量圖我們可以很簡單的實現一些看似很複雜的動畫效果

雖然動畫看著挺複雜,但有了vectordrawable,在使用svg圖片的情況下,用兩個xml檔案就能實現這種效果

第一步:

更改app內的build.gradle檔案:

然後在你drawable資料夾下引入你想用的svg圖片,這個是我準備使用的一張svg圖片

第二步:

在res資料夾下新建“animator”資料夾,記住,是“animator”,不是“anim”

第三步:

在“animator”資料夾下新建一個objectAnimator

屬性動畫xml檔案,我取名為“anim_path.xml”

關鍵就是android:propertyName="trimPathStart"屬性

第四步:

在drawable資料夾下新建animated-vector屬性的xml檔案

animated-vector就相當於粘合劑,將svg圖片和你編寫的屬性動畫,粘合在一起

紅框標出來的drawable,引用的就是你匯入的svg圖片

name:就是svg圖片中定義的name

animation:引用的就是在animator資料夾下新建的屬性動畫檔案

第五步:

怎樣使用呢?看程式碼

看紅框標出的部分,這裡引用的是drawable檔案,就是第四步說的那個粘合劑animated-vector

,而且這裡用的是srcCompat,不是background,也不是src,是“srcCompat”

然後,在class中給這張圖片一個點選事件,啟動動畫

    /**
     * 啟動動畫
     *
     * @param imageView
     */
    private void startAnim(ImageView imageView) {
        drawable = imageView.getDrawable();
        if (drawable instanceof Animatable) {
            ((Animatable) drawable).start();
        }
    }


其他的效果,具體看原始碼吧