Androidプロパティアニメーションとカスタムプロパティアニメーション
12081 ワード
1.アニメーション分類
補間アニメーション:Tween Animationフレームアニメーション:Frame Animationプロパティアニメーション:Property Animation
2.いつどんなアニメを使いますか.
1.トゥイーンアニメーションとフレームアニメーションの両方がビューに作用するため、両者はビューアニメーションとも呼ばれ、位置、サイズ、回転、透明度など、ビューオブジェクト上で一連の簡単な変換を実行することができます.注意:この2つのアニメーションを実行するとき、Viewの焦点は変わっていません.ビューがクリックイベントなどに関連している場合は、このようなアニメーションを使用するのは適切ではありません.
2.アトリビュートアニメーションの機能は比較的強力で、アニメーションを実行するときのViewの焦点もリアルタイムで変化します.例えば、携帯電話の方向センサーを傍受して設定画面の回転を行う場合は、属性アニメーションを使用するのが適切です.ValueAnimatorによって実行される開始点と終了点、例えばViewオフの効果を制御することもできます.
二.実際のアニメーションの例
1.ObjectAnimator通常のプロパティアニメーションを実現
public static ObjectAnimator ofFloat(Object target,String propertyName,float...values){}通常は静的関数ofFloatを呼び出してObjectAnimatorを初期化します.いくつかのパラメータの意味target:アニメーションを実行するView propertyName:Viewのプロパティを実行するには、setメソッドとgetメソッドが必要です.これは可変パラメータです.いくつかの値、開始値、中間値、終了値を入力できます.注意:入力0はViewが初期位置にあることを示します.
インスタンス1:複数のViewが同時に1つの回転アニメーションを実行する
// View
private fun startRotationAnim(degree: Float) {
val animatorSet = AnimatorSet()
val animatorShotAbumImg = ObjectAnimator.ofFloat(shotAlbumImg, "rotation", degree)
val animatorShotAlbumCardView = ObjectAnimator.ofFloat(cardView, "rotation", degree)
val animatorShotMoreImg = ObjectAnimator.ofFloat(shotMoreImg, "rotation", degree)
val animatorShotSwitchCamera = ObjectAnimator.ofFloat(shotSwitchCamera, "rotation", degree)
val animatorCountDownTv = ObjectAnimator.ofFloat(countDownTv, "rotation", degree)
val animatorShotBeautyImg = ObjectAnimator.ofFloat(shotBeautyImg, "rotation", degree)
animatorSet.play(animatorShotAbumImg)
.with(animatorShotMoreImg)
.with(animatorShotSwitchCamera)
.with(animatorCountDownTv)
.with(animatorShotAlbumCardView)
.with(animatorShotBeautyImg)
animatorSet.duration = 300
animatorSet.start()
}
例2:Viewが回転+パンアニメーションを同時に実行する方法PropertyValuesHolderクラスを使用する
private fun startAnim(degree: Float) {
var videoScaleX: PropertyValuesHolder ?= null
var videoScaleY: PropertyValuesHolder ?=null
var videoRotation: PropertyValuesHolder ?= null
var scale :Float = 0f
val layoutParams = mRootView!!.surfaceView.layoutParams as FrameLayout.LayoutParams
scale = layoutParams.width / layoutParams.height.toFloat()
videoScaleX = PropertyValuesHolder.ofFloat("scaleX", scale)
videoScaleY = PropertyValuesHolder.ofFloat("scaleY", scale)
videoRotation = PropertyValuesHolder.ofFloat("rotation", degree)
val videoAnimation = ObjectAnimator.ofPropertyValuesHolder(mRootView!!.surfaceView, videoScaleX, videoScaleY, videoRotation)
val animatorSet = AnimatorSet()
animatorSet.play(videoAnimation)
animatorSet.duration = 300
animatorSet.start()
}
2.ObjectAnimatorカスタムアニメーションを実現
ObjectAnimatorカスタムアニメーションを実装するには、propertyNameをビューにないプロパティとして定義し、onAnimationUpdateコールバック関数で関連する論理を処理すればよい.アニメーションは3秒または5秒のアニメーションであってもよく、常駐アニメーションであってもよい.
インスタンス1:3秒カスタムアニメーション
mAnimator = ObjectAnimator
.ofFloat(fl_container, "liuxu", 1.0f, 0.0f)
mAnimator!!.duration = 3000
mAnimator!!.start()
CommonPreference.putBoolean(CommonPreference.IS_FIRST_FRAME, true)
mIsFirstFrame = true
mAnimator?.addUpdateListener(object : ValueAnimator.AnimatorUpdateListener {
override fun onAnimationUpdate(p0: ValueAnimator?) {
//do something what you want
//
}
例2:常駐アニメーション
1の上でアニメーションを无限循环のアニメーションmCurrentSelectAnimatorに设定します!!!repeatCount = ValueAnimator.INFINITE
注:アニメーションの停止方法
//
if (mCurrentSelectAnimator != null) {
mCurrentSelectAnimator!!.repeatMode = ValueAnimator.RESTART
mCurrentSelectAnimator!!.end()
// ,
fl_guild_current_select.clearAnimation()
mCurrentSelectAnimator = null
}
3.ValueAnimatorによるアニメーション化
ValueAnimator自体はアニメーションを実行することはできません.彼はただのコントローラで、設定した開始点から終了点まで時間通りに一歩一歩過剰に実行することができます.
//
fun startCloseAnim() {
//
val va = ValueAnimator.ofInt(0, MoliveKit.getPixels(295 / 2f))
val layoutParams = login_collect.fl_login_top.layoutParams
val layoutParams1 = login_collect.fl_login_bottom.layoutParams
va.addUpdateListener { animation ->
//
val h = animation?.animatedValue as Int
// View
layoutParams.height = h + login_collect.fl_login_top.height
login_collect.fl_login_top.layoutParams = layoutParams
login_collect.fl_login_top.requestLayout()
layoutParams1.height = h + login_collect.fl_login_bottom.height
login_collect.fl_login_bottom.layoutParams = layoutParams1
login_collect.fl_login_bottom.requestLayout()
}
va.addListener(object : AnimatorListenerAdapter() {
override fun onAnimationEnd(animation: Animator?) {
super.onAnimationEnd(animation)
mLogInListener?.onCollectEnd()
}
override fun onAnimationStart(animation: Animator?) {
super.onAnimationStart(animation)
}
})
va.duration = 1000
va.start()
}
4.RecyclerView単一Itemのプロパティアニメーション
コールコード
// xml ,
detailRecyclerView.layoutAnimation = AnimationUtils.loadLayoutAnimation(context, R.anim.anim_recyclerview_left)
detailRecyclerView.adapter.notifyDataSetChanged()
detailRecyclerView.scheduleLayoutAnimation()
anim_recyclerview_leftファイル
<layoutAnimation
xmlns:android="http://schemas.android.com/apk/res/android"
android:animation="@anim/item_beauty_detail_left"
android:animationOrder="normal"
android:interpolator="@android:anim/overshoot_interpolator"/>
item_beauty_detail_leftファイル
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="300">
<translate
android:interpolator="@android:anim/decelerate_interpolator"
android:fromXDelta="-100%p"
android:toXDelta="0" />
<alpha
android:fromAlpha="0"
android:toAlpha="1"
android:interpolator="@android:anim/accelerate_decelerate_interpolator" />
set>
三.締めくくり
足りないところは指摘して、みんなが共に学ぶことを望んで、ありがとうございます!もっとクールなアニメがあれば、良いオープンソースライブラリを共有して共同研究することができます!