Android基礎動畫之alpha透明度/translate平移/rotate旋轉
小菜最近在學習 Android 基本動畫,前兩天整理了一下相對複雜的 Android 基礎動畫之 scale 漸變縮放,今天繼續學習整理其他三種基本動畫。
公共屬性:
1. android:duration=”3500″
duration 代表動畫過程中持續時常;所有的動畫均有該屬性;
2. android:fillAfter=”true”
fillAfter 代表動畫結束後是否儲存在最後位置,true 為結束位置,false 為返回開始位置。
動畫的繫結方式可以參考上一篇部落格,下面直接介紹各動畫詳細屬性。
Alpha 透明度
anim_alpha.xml
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3500"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
1. android:fromAlpha=”0.0″
fromAlpha 代表 View 的初始透明度;
2. android:toAlpha=”1.0″
toAlpha 代表 View 的終止透明度;
Tips: 透明度設定的範圍並非只是在 0.0~1.0 之間,<= 0.0 不可見,>= 1.0 為可見,設定在初始值小於 0.0 或終止值大於 1.0 時顯示是有區別的。例:fromAlpha=”-2.5″ 和 toAlpha=”1.0″,動畫時間前 2.5s 均不可見,最後 1s 出現由 0.0->1.0 的透明變化,建議大家多多嘗試。
Translate 平移
anim_translate.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3500"
android:fillAfter="true"
android:fromXDelta="0"
android:fromYDelta="0"
android:toXDelta="50%"
android:toYDelta="50%p" />
1. android:fromXDelta=”0″
fromXDelta 代表水平方向平移的初始位置;
2. android:toXDelta=”50%”
toXDelta 代表水平方向平移的終止位置;
3. android:fromYDelta=”0″
fromYDelta 代表豎直方向平移的初始位置;
4. android:toYDelta=”50%”
toYDelta 代表豎直方向平移的終止位置;
Tips: 平移的值與 scale 縮放時類似,分為整數值,百分比/小數點值,百分比 + p 方式,使用方法與 scale 中一致,請參照上一篇部落格介紹。
Rotate 旋轉
anim_rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3500"
android:fillAfter="true"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="0%"
android:toDegrees="360" />
1. android:fromDegrees=”0″
fromDegrees 代表 View 旋轉時初始角度,角度正負均可;
2. android:toDegrees=”0″
toDegrees 代表 View 旋轉時終止角度;
3. android:pivotX=”50%”
pivotX 代表 View 旋轉時圓心 (pivotX, y);
4. android:pivotY=”0%”
pivotY 代表 View 旋轉時圓心 (x, pivotY);
Tips:
- pivotX 和 pivotY 代表的圓心座標點值與 scale 縮放時類似,分為整數值,百分比/小數點值,百分比 + p 方式;
- 若不設定 pivotX 和 pivotY 預設代表 (0, 0),若不設定 fromDegrees 和 toDegrees 預設沒有反應,因為旋轉角度為 0,若不設定 duration 則沒有旋轉效果,預設時間為 0。
小菜的動畫部分是短板,正在從零學習,不對的請多多指正。
相關文章
- Qt 從 QTransform 逆向解出 Translate/Scale/Rotate(平移/縮放/旋轉)分析QTORM
- iOS動畫系列之四:基礎動畫之平移篇iOS動畫
- CSS屬性transform之旋轉:rotate,縮放:scale,傾斜:skew,移動:translateCSSORM
- CSS3 skew傾斜、rotate旋轉動畫CSSS3動畫
- Android 可平移,縮放,旋轉的ImageViewAndroidView
- iOS動畫系列之五:基礎動畫之縮放篇&旋轉篇Swift+OCiOS動畫Swift
- 【Android動畫】之Tween動畫 (漸變、縮放、位移、旋轉)Android動畫
- Canvas之translate、scale、rotate、skew方法講解!Canvas
- CSS動畫之旋轉魔方輪播CSS動畫
- Android 中實現圖片平移、縮放、旋轉同步進行Android
- ARFoundation - 實現物體旋轉, 平移,縮放
- 旋轉矩陣(Rotate Matrix)的性質分析矩陣
- Android基礎動畫之Tween Animation和Frame AnimationAndroid動畫
- SVG矩形旋轉動畫SVG動畫
- 卡片旋轉動畫效果動畫
- Android SeekBar 自定義thumb,thumb旋轉動畫效果Android動畫
- 圖解:什麼是旋轉陣列(Rotate Array)?圖解陣列
- canvas translate()、scale()和rotate()方法程式碼例項Canvas
- 每週一個前端動畫之四:掘金頭像旋轉動畫前端動畫
- C# 簡易影像處理(包括平移,旋轉,翻轉, 裁切)C#
- Android過場動畫基礎教程Android動畫
- Android基礎夯實--重溫動畫(四)之屬性動畫 ValueAnimator詳解Android動畫
- THREE 矩陣優先原則和平移旋轉矩陣矩陣
- C#+OpenCV基礎(四)_旋轉翻轉透視C#OpenCV
- CSS3動畫(360度旋轉、旋轉放大、放大、移動)CSSS3動畫
- CSS動畫:animation、transition、transform、translateCSS動畫ORM
- 【 開源計劃 - 元件包 】 旋轉切換 toggle_rotate元件
- 三維重建學習(1):基礎知識:旋轉矩陣與旋轉向量矩陣
- CGAffineTransform二維檢視旋轉、縮放、平移變換詳解ORM
- Android 動畫基礎知識學習(下)Android動畫
- 《HTML5+JavaScript動畫基礎》——第2章 動畫的JavaScript基礎2.1動畫基礎HTMLJavaScript動畫
- Android 基礎之 HandlerAndroid
- [Python影象處理] 六.影象縮放、影象旋轉、影象翻轉與影象平移Python
- Android開發之Activity轉場動畫Android動畫
- ios UIButton一直旋轉動畫iOSUI動畫
- Flutter——動畫基礎(補間動畫)Flutter動畫
- Android之動畫Android動畫
- Android 動畫之屬性動畫Android動畫