Question

在this教程之后，我能够实现片段之间的共享元素转换。现在我想通过改变共享元素的运动路径来使它变甜。更具体地说，我喜欢共享元素在弯曲的路径上行走。

根据文档，我可以在unlink(2)向我的过渡添加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>代替什么来更好地控制曲线？除了弧形运动，还有其他方法可以达到这个目的吗？

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/>

Answer 2

刚刚完成Booyaches的答案。要声明您的Styleable，您需要进入

RES /值/风格

并在你的样式文件中添加：

<resources>
  // others styles .....

  <declare-styleable name="TransitionArcMotion">
    <attr name="arcRadius" format="integer" />
  </declare-styleable>

</resources>

或其他选项您可以在attrs.xml文件夹中创建名为res/values的新文件，为您留下下一条路径：

RES /值/ ATTRS

并在此文件中添加相同的代码：

<resources>
  // others styles .....

  <declare-styleable name="TransitionArcMotion">
    <attr name="arcRadius" format="integer" />
  </declare-styleable>

</resources>

如何将弯曲运动应用于过渡？

2 个答案: