先看效果
20161204_151318.gif
這個demo是仿照極客學院某個2D卡片翻轉(zhuǎn)的效果做的管跺。原來的demo是使用了補間動畫床蜘, 我這里改用了屬性動畫(我更喜歡用屬性動畫)悠垛。
首先在布局的frameLayout里放兩個imagView, 就是兩張圖片。將下面一張圖片的rotationY改為90度
<ImageView
android:id="@+id/iv_b"
android:rotationY="90"
android:src="@drawable/image_b"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
然后在activity中
// 翻過去的動畫
mAnimatorA1 = ObjectAnimator.ofFloat(mIvA, View.ROTATION_Y, 0, 90).setDuration(500);
mAnimatorB1 = ObjectAnimator.ofFloat(mIvB, View.ROTATION_Y, 90, 180).setDuration(500);
mAnimatorA1.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationStart(Animator animation) {
mActivityMain.setClickable(false);
}
@Override
public void onAnimationEnd(Animator animation) {
mActivityMain.setClickable(true);
mAnimatorB1.start();
}
});
mAnimatorB1.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationStart(Animator animation) {
mActivityMain.setClickable(false);
}
@Override
public void onAnimationEnd(Animator animation) {
mActivityMain.setClickable(true);
}
});
動畫過程是這樣的:圖片A繞著最中間的Y軸旋轉(zhuǎn)90度但荤, 結(jié)束時讓圖片B繞著最中間的Y軸從90度旋轉(zhuǎn)到180。這樣看起來就像是圖片A的反面就是圖片B一樣涧至。關(guān)于屬性動畫如果不熟可以使用搜索引擎看看腹躁, 我就這么干的。
記得給兩個動畫都設(shè)置監(jiān)聽南蓬, 在動畫開始的時候讓布局可以不可點擊纺非, 在動畫結(jié)束的時候讓布局可以點擊。這個細節(jié)非常重要赘方。
demo我已經(jīng)上傳到github了烧颖, 有興趣的可以看看。
demo地址