打开:书本(MainActivity称作scene1) -->打开书动画-->展示书本内容(MainActivity2称作scene2)
关闭:scene2 -->合上书本-->scene1
打开书动画部分:
BookOpenViewValue:book的view的坐标信息。
BookOpenView:打开book动画view
把book分为两部分:封面(page_cover)和内容(page_content)
scene1布局-->bookopen布局-->scene2布局
AnimatorSet来实现组合动画playTogether同时执行反转、缩放、平移动画就实现了open book效果。伪代码如下:
// 首先确定翻页的坐标(默认是以view的中心为坐标原点的。修改为以书边为轴,进行 x 轴方向反转)
page_cover.setPivotX(0);
page_cover.setPivotY(y1);
ObjectAnimator rotationY = ObjectAnimator.ofFloat(page_cover, "rotationY", 0, -150);
rotationY.setDuration(600);
// 对 封面进行缩放
ObjectAnimator scaleX = ObjectAnimator.ofFloat(page_cover, "scaleX", 1.0f, sX * 0.8f);
scaleX.setDuration(1000);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(page_cover, "scaleY", 1.0f, sY);
scaleY.setDuration(1000);
从scene2返回到scene1中实现关闭书本部分代码:
@Override
protected void onResume() {
super.onResume();
if (mBookOpenView != null) {
mBookOpenView.closeAnim();
}
}
// 封面进行平移到屏幕外
ObjectAnimator translationLine = ObjectAnimator.ofFloat(page_cover, "translationX", startValue.getLeft(), 0);
translationLine.setDuration(1000);
当然在执行完上面动画后跳转到scene2(过度渐变)
```java
MainActivity.this.startActivity(new Intent(MainActivity.this, Main2Activity.class));
overridePendingTransition(R.anim.read_fade_in, R.anim.read_fade_out);
在scene2中主要是渐变显示内容,代码如下:
@Override
public void finish() {
ObjectAnimator alpha = ObjectAnimator.ofFloat(picTop, "alpha", 0, 1);
alpha.setDuration(500);
mAnimatorSet1 = new AnimatorSet();
mAnimatorSet1.playTogether(alpha);
mAnimatorSet1.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
Main2Activity.super.finish();
overridePendingTransition(0, 0);
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
mAnimatorSet1.start();
}
@Override
protected void onResume() {
super.onResume();
ObjectAnimator alpha = ObjectAnimator.ofFloat(picTop, "alpha", 1, 0);
alpha.setDuration(200);
mAnimatorSet1 = new AnimatorSet();
mAnimatorSet1.playTogether(alpha);
mAnimatorSet1.start();
}
BookOpenView--->BookOpenView3不同层级的变形
demo












网友评论