Question

我试图在我的ViewPager上实现转换。我想添加一个动画，就像我翻书的页面一样简单。我看过一些有卷曲动画的帖子，但我不需要这样的东西。

有人可以帮我实现吗？

Answer 1

您可以使用此库here来实现所需的动画。

Answer 2

我创建了这个PageTransformer：

public class PageCurlTransformer extends BaseTransformer {

    private final Matrix OFFSET_MATRIX = new Matrix();
    private final Camera OFFSET_CAMERA = new Camera();
    private final float[] OFFSET_TEMP_FLOAT = new float[2];

    public static final String TYPE_CURL_CENTERED = "CENTERD";
    public static final String TYPE_CURL_TOP = "TOP";
    public static final String TYPE_CURL_BOTTOM = "BOTTOM";

    private boolean mRotation;
    private float mRotationCurlType = 0.5f;

    public PageCurlTransformer(boolean rotation) {
        mRotation = rotation;
        mRotationCurlType = 0.5f;
    }

    public PageCurlTransformer(String curlType) {
        mRotation = true;

        if (curlType.equals(TYPE_CURL_CENTERED))
            mRotationCurlType = 0.5f;
        else if (curlType.equals(TYPE_CURL_TOP))
            mRotationCurlType = 1.5f;
        else if (curlType.equals(TYPE_CURL_BOTTOM))
            mRotationCurlType = -0.5f;
    }

    @Override
    protected void onTransform(View view, float position) {
        //view.setTranslationX(position < 0 ? 0f : -view.getWidth() * position);

        if (position <= 0f) {

            view.setPivotX(position < 0 ? 0 : view.getWidth());
            view.setScaleX(position < 0 ? 1f + position : 1f - position);

            if (mRotation) {
                final float rotation = (position < 0 ? 30f : -30f) * Math.abs(position);

                view.setTranslationX(getOffsetXForRotation(rotation, view.getWidth(), view.getHeight()));

                view.setPivotY(view.getHeight() * mRotationCurlType);
                view.setRotationY(-rotation);
            }
        } else if (position <= 1f) {
            view.setTranslationX(position < 0 ? 0f : -view.getWidth() * position);
        }
    }

    protected final float getOffsetXForRotation(float degrees, int width, int height) {
        OFFSET_MATRIX.reset();
        OFFSET_CAMERA.save();
        OFFSET_CAMERA.rotateY(Math.abs(degrees));
        OFFSET_CAMERA.getMatrix(OFFSET_MATRIX);
        OFFSET_CAMERA.restore();

        OFFSET_MATRIX.preTranslate(-width * 0.5f, -height * 0.5f);
        OFFSET_MATRIX.postTranslate(width * 0.5f, height * 0.5f);
        OFFSET_TEMP_FLOAT[0] = width;
        OFFSET_TEMP_FLOAT[1] = height;
        OFFSET_MATRIX.mapPoints(OFFSET_TEMP_FLOAT);
        return (width - OFFSET_TEMP_FLOAT[0]) * (degrees > 0.0f ? 1.0f : -1.0f);
    }
}

BaseTransformer的位置是：

public abstract class BaseTransformer implements PageTransformer {

    protected abstract void onTransform(View view, float position);

    @Override
    public void transformPage(View view, float position) {
        onPreTransform(view, position);
        onTransform(view, position);
    }

    protected boolean hideOffscreenPages() {
        return true;
    }

    protected boolean isPagingEnabled() {
        return false;
    }

    protected void onPreTransform(View view, float position) {
        final float width = view.getWidth();

        view.setRotationX(0);
        view.setRotationY(0);
        view.setRotation(0);
        view.setScaleX(1);
        view.setScaleY(1);
        view.setPivotX(0);
        view.setPivotY(0);
        view.setTranslationY(0);
        view.setTranslationX(isPagingEnabled() ? 0f : -width * position);

        if (hideOffscreenPages()) {
            view.setAlpha(position <= -1f || position >= 1f ? 0f : 1f);
        } else {
            view.setAlpha(1f);
        }
    }
}

我希望它可以帮到你。

ViewPager PageTransformer（将页面翻为书）

2 个答案: