android - 如何将曲线运动应用于过渡？

Question

正在关注 this教程我能够实现 fragment 之间的共享元素转换。现在我想通过改变共享元素的运动路径来让它变甜。更具体地说，我希望共享元素在弯曲的路径上移动。

根据文档，我可以将 ArcMotion 添加到我的转换中，但据我所知 - 使用 ArcMotion。我无法控制曲线弯曲的方向。它在圆形路径上移动，但以逆时针方向移动。现在我的 TransitionSet 如下所示:

<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="500">
    <changeBounds/>
    <changeTransform/>
    <changeImageTransform/>
    <arcMotion 
        android:minimumHorizontalAngle="90" 
        android:minimumVerticalAngle="90" 
        android:maximumAngle="15"/>
</transitionSet>

我可以用什么替换 ArcMotion 来更好地控制曲线？除了圆弧运动，还有其他方法可以实现吗？

Answer 1

为了实现它，我必须创建 PathMotion。例如像这样:

@TargetApi(Build.VERSION_CODES.LOLLIPOP)
public class TransitionArcMotion extends PathMotion {
    private static int DEFAULT_RADIUS = 500;
    private float curveRadius;

    public TransitionArcMotion() {

    }

    public TransitionArcMotion(Context context, AttributeSet attrs) {
        super(context, attrs);
        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.TransitionArcMotion);
        curveRadius = a.getInteger(R.styleable.TransitionArcMotion_arcRadius, DEFAULT_RADIUS);
        a.recycle();
    }

    @Override
    public Path getPath(float startX, float startY, float endX, float endY) {
        Path arcPath = new Path();

        float midX = startX + ((endX - startX) / 2);
        float midY = startY + ((endY - startY) / 2);
        float xDiff = midX - startX;
        float yDiff = midY - startY;

        double angle = (Math.atan2(yDiff, xDiff) * (180 / Math.PI)) - 90;
        double angleRadians = Math.toRadians(angle);

        float pointX = (float) (midX + curveRadius * Math.cos(angleRadians));
        float pointY = (float) (midY + curveRadius * Math.sin(angleRadians));

        arcPath.moveTo(startX, startY);
        arcPath.cubicTo(startX,startY,pointX, pointY, endX, endY);
        return arcPath;
    }
}

然后我必须将我的路径运动传递给 TransitionSet 资源:

<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"
           xmlns:app="http://schemas.android.com/apk/res-auto"
           android:duration="250">
<changeBounds>
    <pathMotion class="com.sony.songpal.app.view.motion.TransitionArcMotion" app:arcRadius="250"/>
</changeBounds>
<changeTransform/>
<changeImageTransform/>