當(dāng)前位置：首頁 > 人文社科 > 生活经验 >内容正文

生活经验

Android 补间动画(Tween Animation)

發(fā)布時(shí)間：2023/11/27 生活经验 27 豆豆

生活随笔收集整理的這篇文章主要介紹了 Android 补间动画(Tween Animation) 小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

Tween Animation（補(bǔ)間動(dòng)畫）：

? ? Tween動(dòng)畫，通過對(duì)View的內(nèi)容進(jìn)行一系列的圖形變換 (包括平移、縮放、旋轉(zhuǎn)、改變透明度)來實(shí)現(xiàn)動(dòng)畫效果。動(dòng)畫效果的定義可以采用XML來做也可以采用編碼來做。

動(dòng)畫類型	XML配置方式	Java代碼實(shí)現(xiàn)方式
漸變透明度動(dòng)畫效果	<alpha/>	AlphaAnimation
漸變尺寸縮放動(dòng)畫效果	<scale/>	ScaleAnimation
畫面旋轉(zhuǎn)動(dòng)畫效果	<rotate/>	RotateAnimation
畫面位置移動(dòng)動(dòng)畫效果	<translate/>	TranslateAnimation
組合動(dòng)畫效果	<set/>	AnimationSet

?下面以java 和 xml 的方式具體說下使用

1 平移動(dòng)畫

'效果圖如下

? 1.1?java的方法實(shí)現(xiàn)

 //平移動(dòng)畫/*** java代碼實(shí)現(xiàn)*/TranslateAnimation translateAnimation = new TranslateAnimation(0, 0, 0, 600);translateAnimation.setRepeatMode(Animation.REVERSE);// 設(shè)置動(dòng)畫模式 這里是動(dòng)畫重復(fù)translateAnimation.setRepeatCount(5); // 設(shè)置動(dòng)畫的次數(shù) 當(dāng)為-1的時(shí)候重復(fù)動(dòng)畫translateAnimation.setFillAfter(true); // 設(shè)置為false的時(shí)候動(dòng)畫走走完回到原來的位置，true是動(dòng)畫結(jié)束之后位置不會(huì)改變translateAnimation.setDuration(2000); // 動(dòng)畫持續(xù)時(shí)間img.startAnimation(translateAnimation); // 開始動(dòng)畫

這樣就實(shí)現(xiàn)了上下移動(dòng)的動(dòng)畫，其他的移動(dòng)設(shè)置參數(shù)即可

1.2 以xml 的方法實(shí)現(xiàn)

首先在res 目錄下創(chuàng)建一個(gè)anim 目錄然后在創(chuàng)建一個(gè)xx.xml 的文件里面內(nèi)容如下

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"android:duration="2000"android:fillBefore="true"android:fromXDelta="0"android:fromYDelta="0"android:toXDelta="0"android:toYDelta="600" />

當(dāng)然最外層也可以添加一個(gè)set 這個(gè)看個(gè)人習(xí)慣把

android:duration="2000" ---->動(dòng)畫持續(xù)時(shí)間 android:fillBefore="true" ---> 如果fillBefore的值為true，則動(dòng)畫執(zhí)行后，控件將回到動(dòng)畫執(zhí)行之前的狀態(tài) 和fillAfter類似不過true和false 功能卻相反的 android:fromXDelta="0" ---->起始時(shí)X座標(biāo) android:fromYDelta="0"---->起始時(shí)Y座標(biāo) android:toXDelta="0"---->結(jié)束時(shí)X座標(biāo) android:toYDelta="600"---->結(jié)束時(shí)Y座標(biāo)

然后java 內(nèi)容

 TranslateAnimation translateAnimation = (TranslateAnimation) AnimationUtils.loadAnimation(TweenActivity.this, R.anim.translate);translateAnimation.setFillAfter(true);img.startAnimation(translateAnimation);

2? 漸變透明度動(dòng)畫

效果如下

2.1 以java 實(shí)現(xiàn)

  //透明度動(dòng)畫AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0.5f);alphaAnimation.setRepeatMode(Animation.REVERSE); // 設(shè)置動(dòng)畫的次數(shù) 當(dāng)為-1的時(shí)候重復(fù)動(dòng)畫alphaAnimation.setFillAfter(true); // 設(shè)置為false的時(shí)候動(dòng)畫走走完回到原來的位置，true是動(dòng)畫結(jié)束之后位置不會(huì)改變alphaAnimation.setDuration(2000); // 動(dòng)畫持續(xù)時(shí)間img.startAnimation(alphaAnimation);

2.2 以xml 方式實(shí)現(xiàn)

首先在res 目錄下創(chuàng)建一個(gè)anim 目錄然后在創(chuàng)建一個(gè)xx.xml 的文件里面內(nèi)容如下

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"android:duration="3000"android:fillBefore="true"android:fromAlpha="1.0"android:toAlpha="0.1"/>

android:duration="3000"  ---->動(dòng)畫持續(xù)時(shí)間
android:fillBefore="true" ----->如果fillBefore的值為true，則動(dòng)畫執(zhí)行后，控件將回到動(dòng)畫執(zhí)行之前的狀態(tài) 和fillAfter類似不過true和false 功能卻相反的
android:fromAlpha="1.0"------>開始時(shí)透明度
android:toAlpha="0.1"------->結(jié)束時(shí)透明度

java 代碼

 AlphaAnimation alphaAnimation = (AlphaAnimation) AnimationUtils.loadAnimation(TweenActivity.this, R.anim.alpha);img.startAnimation(alphaAnimation);

3 縮放動(dòng)畫

效果如下

3.1 以java 代碼實(shí)現(xiàn)

 //縮放動(dòng)畫ScaleAnimation scaleAnimation = new ScaleAnimation(1, 2, 1, 2, Animation.RELATIVE_TO_SELF, Animation.RELATIVE_TO_SELF);scaleAnimation.setRepeatMode(Animation.REVERSE); // 設(shè)置動(dòng)畫模式 這里是動(dòng)畫重復(fù)scaleAnimation.setRepeatCount(5); // 設(shè)置動(dòng)畫的次數(shù) 當(dāng)為-1的時(shí)候重復(fù)動(dòng)畫scaleAnimation.setFillAfter(true); // 設(shè)置為false的時(shí)候動(dòng)畫走走完回到原來的位置，true是動(dòng)畫結(jié)束之后位置不會(huì)改變scaleAnimation.setDuration(2000); // 動(dòng)畫持續(xù)時(shí)間img.startAnimation(scaleAnimation);

3.2 以xml 代碼實(shí)現(xiàn)

首先在res 目錄下創(chuàng)建一個(gè)anim 目錄然后在創(chuàng)建一個(gè)xx.xml 的文件里面內(nèi)容如下

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"android:duration="700"android:fromXScale="1.0"android:fromYScale="1.0"android:pivotX="50"android:pivotY="50"android:toXScale="0.0"android:toYScale="0.0" />

android:duration="700" ---->動(dòng)畫持續(xù)時(shí)間
android:fromXScale="1.0" --->開始前X的縮放，0.0為不顯示， 1.0為正常大小
android:fromYScale="1.0"--->開始前Y的縮放，0.0為不顯示， 1.0為正常大小
android:pivotX="50"  --->?動(dòng)畫起始位置，相對(duì)于屏幕的百分比,兩個(gè)都為50%表示動(dòng)畫從自身中間開始
android:pivotY="50"
android:toXScale="0.0" --->動(dòng)畫最終縮放的倍數(shù)， 1.0為正常大小，大于1.0放大
android:toYScale="0.0"

java 代碼調(diào)用

   ScaleAnimation scaleAnimation = (ScaleAnimation) AnimationUtils.loadAnimation(TweenActivity.this, R.anim.scale);img.startAnimation(scaleAnimation);

?4 旋轉(zhuǎn)動(dòng)畫

效果如下

4.1 以java 代碼實(shí)現(xiàn)

  RotateAnimation rotateAnimation = new RotateAnimation(0, 180, Animation.RELATIVE_TO_SELF, Animation.RELATIVE_TO_SELF);rotateAnimation.setRepeatMode(Animation.REVERSE); // 設(shè)置動(dòng)畫模式 這里是動(dòng)畫重復(fù)rotateAnimation.setRepeatCount(5); // 設(shè)置動(dòng)畫的次數(shù) 當(dāng)為-1的時(shí)候重復(fù)動(dòng)畫rotateAnimation.setRepeatMode(Animation.REVERSE); // 設(shè)置動(dòng)畫的次數(shù) 當(dāng)為-1的時(shí)候重復(fù)動(dòng)畫rotateAnimation.setFillAfter(true); // 設(shè)置為false的時(shí)候動(dòng)畫走走完回到原來的位置，true是動(dòng)畫結(jié)束之后位置不會(huì)改變r(jià)otateAnimation.setDuration(2000); // 動(dòng)畫持續(xù)時(shí)間img.startAnimation(rotateAnimation);

4.2 以xml 代碼實(shí)現(xiàn)

首先在res 目錄下創(chuàng)建一個(gè)anim 目錄然后在創(chuàng)建一個(gè)xx.xml 的文件里面內(nèi)容如下

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"android:duration="3000"android:fillAfter="true"android:fromDegrees="0"android:pivotX="50%"android:pivotY="50%"android:toDegrees="-650"/>

android:duration="3000" ---->動(dòng)畫持續(xù)時(shí)間
android:fillAfter="true"
android:fromDegrees="0" ----->動(dòng)畫開始時(shí)的角度
android:pivotX="50%" ----->屬性為動(dòng)畫相對(duì)于物件的X坐標(biāo)的開始位置
android:pivotY="50%"----->屬性為動(dòng)畫相對(duì)于物件的Y坐標(biāo)的開始位置
android:toDegrees="-650" ---->動(dòng)畫結(jié)束時(shí)物件的旋轉(zhuǎn)角度,正代表順時(shí)針 負(fù)代表逆時(shí)針

java 代碼調(diào)用xml

 RotateAnimation rotateAnimation = (RotateAnimation) AnimationUtils.loadAnimation(TweenActivity.this, R.anim.rotate);img.startAnimation(rotateAnimation);

5 上面的幾個(gè)屬性可以合在一起實(shí)現(xiàn)效果

?5.1 java 代碼

 ScaleAnimation scaleAnim = new ScaleAnimation(1, 2, 1, 2, Animation.RELATIVE_TO_SELF, Animation.RELATIVE_TO_SELF);scaleAnim.setRepeatMode(Animation.REVERSE);scaleAnim.setFillAfter(true);scaleAnim.setDuration(2000);scaleAnim.setRepeatCount(1);AlphaAnimation alphaAnim = new AlphaAnimation(1, 0.5f);alphaAnim.setRepeatMode(Animation.REVERSE);alphaAnim.setFillAfter(true);alphaAnim.setDuration(2000);alphaAnim.setRepeatCount(1);AnimationSet set = new AnimationSet(true);set.addAnimation(scaleAnim);set.addAnimation(alphaAnim);img.startAnimation(set);

5.2 以xml 代碼實(shí)現(xiàn)

首先在res 目錄下創(chuàng)建一個(gè)anim 目錄然后在創(chuàng)建一個(gè)xx.xml 的文件里面內(nèi)容如下

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"android:fillAfter="true"><!-- 各種單獨(dú)特效的雜糅 --><alphaandroid:duration="1000"android:fromAlpha="0.1"android:toAlpha="1" /><rotateandroid:duration="1000"android:fromDegrees="0"android:pivotX="50%"android:pivotY="50%"android:toDegrees="720" /><scaleandroid:duration="1000"android:fromXScale="0.1"android:fromYScale="0.1"android:toXScale="1.0"android:toYScale="1.0" /><translateandroid:duration="1000"android:fillAfter="true"android:fromXDelta="0"android:fromYDelta="0"android:toXDelta="0"android:toYDelta="600" />
</set>

java 代碼調(diào)用xml

 Animation mutipleAnimation = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.set);img.startAnimation(mutipleAnimation);

具體的可以看下demo github 鏈接地址點(diǎn)擊查看

總結(jié)

以上是生活随笔為你收集整理的Android 补间动画(Tween Animation)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。

上一篇： qq个性签名友情伤感
下一篇： RecyclerView 刷新的时候出现