Android MotionLayout可以应用弹簧动画吗?

huangapple go评论54阅读模式
英文:

Can't android MotionLayout apply Spring animation?

问题

我想使用MotionLayout实现弹簧动画。
同时,我想自定义刚度和阻尼值。

顺便说一下,我看到了一些示例,其中需要使用OnSwipe标签来在MotionLayout中使用弹簧动画。

我希望动画可以在没有用户触摸的情况下工作。

有什么办法吗?

英文:

I want to implement Spring animation using MotionLayout.
Also, I want to give stiffness and damping as custom values.

By the way, I saw examples where you need to use the OnSwipe tag to use Spring animation in MotionLayout.

What I want is for animation to work without user's touch.

Is there any way?

答案1

得分: 1

关于"spring animation"的含义有点不太清楚。
如果你想要以弹簧的形式移动进度。
通常你可以这样做:

progress.animateTo(
            1f,
            animationSpec = tween(800)
        )
         MotionLayout(
            ...
            progress = progress.value
        ) 

这可以改为

    val progress by animateFloatAsState(
        targetValue = 1f,
        animationSpec = spring(
            dampingRatio = Spring.DampingRatioHighBouncy,
            stiffness = Spring.StiffnessMedium
        )
    )
    MotionLayout(
            ...
            progress = progress.value
    ) 

你可以通过创建自定义插值曲线在MotionLayout内部实现类似弹簧的效果。

英文:

It is a little unclear what you mean by spring animation.
If you want the progress to move in the form of a Spring.
So typically you do:

progress.animateTo(
            1f,
            animationSpec = tween(800)
        )
         MotionLayout(
            ...
            progress = progress.value
        ) 

This can be changed to

    val progress by animateFloatAsState(
        targetValue = 1f,
        animationSpec = spring(
            dampingRatio = Spring.DampingRatioHighBouncy,
            stiffness = Spring.StiffnessMedium
        )
    )
    MotionLayout(
            ...
            progress = progress.value
    ) 

You can achieve spring like effects inside of MotionLayout by creating custom interpolation curves.

huangapple
  • 本文由 发表于 2023年2月14日 08:42:07
  • 转载请务必保留本文链接:https://go.coder-hub.com/75442490.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定