Android 实现酷炫的卡片交换效果

效果图

效果实现

Paste_Image.png

图中所示,当page1向左滑动的时候page1 y轴瞬时针进行旋转 x轴进行旋转,page2 则相反,(x y轴角度旋转差 可以实现z轴旋转的效果).

code

    viewPager.setPageTransformer(true, new ViewPager.PageTransformer() {
      @Override public void transformPage(View view, float position) {
        float mRot = (15.0f * position);
        if (position < -1) {
          ViewCompat.setRotationX(view, 0);
          ViewCompat.setRotationY(view, 0);
          ViewCompat.setRotation(view, 0);
        } else if (position >= 1) {
          ViewCompat.setRotationX(view, 0);
          ViewCompat.setRotationY(view, 0);
          ViewCompat.setRotation(view, 0);
        } else if (position > 0) {//->[0,1] 向左滑动时候page2 postion的偏移值 从0到1变化过程 
          ViewCompat.setPivotX(view, view.getMeasuredWidth() / 3);
          ViewCompat.setPivotY(view, view.getMeasuredHeight());
          ViewCompat.setRotationY(view, -mRot / 2);
          ViewCompat.setRotationX(view, mRot / 3);
        } else if (position < 0) {//[<- [0,-1]]向左滑动时候page1 postion的偏移值 从0到0-1变化过程
          ViewCompat.setPivotX(view, view.getMeasuredWidth() / 3);
          ViewCompat.setPivotY(view, view.getMeasuredHeight());
          ViewCompat.setRotationY(view, -mRot / 2);
          ViewCompat.setRotationX(view, -mRot / 3);
        }
      }
    });