Android高級動畫篇之SVG矢量動畫范例
更新時間：2021年11月11日 15:02:26 作者：FranzLiszt1847
矢量動畫即是在計算機中使用數(shù)學方程來描述屏幕上復雜的曲線，利用圖形的抽象運動特征來記錄變化的畫面信息的動畫，本篇帶你了解在Android中的矢量動畫
效果視頻
目錄結(jié)構(gòu)
SVG常用指令
L ：為從當前點繪制到直線給定的點，后面跟著的為x,y坐標
M ：為將畫筆移動到某一點，但只是移動畫筆，并沒有繪制過程，所有沒有產(chǎn)生繪制動作
A ：為繪制一段弧線，允許弧線不閉合
初始化狀態(tài)
效果圖
制作靜態(tài)SVG圖型
首先在drawablw目錄中建立一個svg_pic.xml文件夾
分別給兩條直線名為Path1和Path2
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="200dp"
android:height="200dp"
android:viewportHeight="100"
android:viewportWidth="100">
<group>
<path
android:name="path1"
android:pathData="
M 20,80
L 50,80 80,80"
android:strokeColor="#cc0099"
android:strokeLineCap="round"
android:strokeWidth="5"/>
<path
android:name="path2"
android:pathData="
M 20,20
L 50,20 80,20"
android:strokeColor="#cc0099"
android:strokeLineCap="round"
android:strokeWidth="5"/>
</group>
</vector>
動畫變換
在res目錄下建立一個anim文件，在anim文件建立兩個動畫變化文件，分別為cross_anim1.xml和cross_anim2.xml
其中的valueFrom與valueTo屬性分別對應了變換的起始坐標
cross_anim1.xml
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="sequentially">
<objectAnimator
android:duration="500"
android:propertyName="pathData"
android:valueFrom="M 20,80 L 50,80 80,80"
android:valueTo="M 20,80 L 50,50 80,80"
android:valueType="pathType"
android:interpolator="@android:anim/bounce_interpolator">
</objectAnimator>
</set>
cross_anim2.xml
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="sequentially">
<objectAnimator
android:duration="500"
android:interpolator="@android:anim/bounce_interpolator"
android:propertyName="pathData"
android:valueFrom="
M 20,20
L 50,20 80,20"
android:valueTo="
M 20,20
L 50,50 80,20"
android:valueType="pathType"/>
</set>
動畫黏合
最好通過animated-vector進行粘合，在drawable目錄下創(chuàng)建link_anim.xml文件
drawable綁定svg靜態(tài)圖型的初始狀態(tài)
target將兩條直線的樣式與變換進行綁定
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/svg_pic">
<target android:name="path1" android:animation="@anim/cross_anim1"/>
<target android:name="path2" android:animation="@anim/cross_anim2"/>
</animated-vector>
引用
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ImageView
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="@drawable/link_anim"
android:onClick="anim"/>
</LinearLayout>
public void anim(View view) {
ImageView imageView = (ImageView)view;
Drawable drawable = imageView.getDrawable();
if (drawable instanceof Animatable){
((Animatable)drawable).start();
}
}
解決低版本異常問題
在build.gradle文件的defaultConfig中添加如下語句
vectorDrawables.useSupportLibrary = true
到此這篇關(guān)于Android高級動畫篇之SVG矢量動畫范例的文章就介紹到這了,更多相關(guān)Android 矢量動畫內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
關(guān)于Android Studio封裝SDK的那些事兒
這篇文章主要給大家介紹了關(guān)于Android Studio封裝SDK的那些事兒，文中通過圖文以及示例代碼介紹的非常詳細，需要的朋友可以參考借鑒，下面隨著小編來一起學習學習吧2018-09-09
Android實現(xiàn)系統(tǒng)狀態(tài)欄的隱藏和顯示功能
這篇文章主要介紹了Android實現(xiàn)系統(tǒng)狀態(tài)欄的隱藏和顯示功能，文中還給大家?guī)硭姆N方法，大家可以根據(jù)自己需要參考下2018-07-07
這篇文章主要給大家介紹了關(guān)于Android APK反編譯技巧的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對各位Android開發(fā)者們具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧2019-05-05
Android實現(xiàn)右邊抽屜Drawerlayout效果
這篇文章主要為大家詳細介紹了Android實現(xiàn)右邊抽屜Drawerlayout效果,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-11-11
本文主要介紹 Android View進行手勢識別，這里整理了相關(guān)資料和簡單示例，有興趣的小伙伴可以參考下2016-08-08
Android應用程序的安裝和卸載事件，是由系統(tǒng)進行監(jiān)聽并全局廣播的，支持1.5（android 3）以上，因此，如果想要監(jiān)聽獲取應用的安裝和卸載事件，只需要自定義一個BroadcastReceiver，來對系統(tǒng)廣播進行監(jiān)聽和處理2014-02-02
這篇文章主要介紹了Android 使用Zbar實現(xiàn)掃一掃功能,本文用的是Zbar實現(xiàn)掃一掃,因為根據(jù)本人對兩個庫的使用比較,發(fā)現(xiàn)Zbar解碼比Zxing速度要快,實現(xiàn)方式也簡單，需要的朋友可以參考下2023-03-03
這篇文章主要為大家詳細介紹了Android控件CardView實現(xiàn)卡片效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-02-02
SQLite是一個輕量級數(shù)據(jù)庫，它設計目標是嵌入式的，而且占用資源非常低，本文重點給大家介紹android中SQLite使用及特點，感興趣的朋友跟隨小編一起看看吧2021-04-04
詳細分析android的MessageQueue.IdleHandler
這篇文章主要介紹了android的MessageQueue.IdleHandler用法，很有參考價值，歡迎大家在下方留言區(qū)討論。2017-11-11