如何解决此动画中当前的不透明度?

Posted

技术标签:

【中文标题】如何解决此动画中当前的不透明度?【英文标题】:How can I solve for current opacity in this animation? 【发布时间】:2021-11-09 03:36:10 【问题描述】:

我正在尝试在 Lua 中做一个简单的淡入/淡出动画。

我觉得这些变量应该足以解决我想在每一帧设置框的 alpha/opacity,但是我在淡出方面遇到了很多麻烦,因为alpha = targetAlpha * animationPos 总是返回 0 而乘以 0 的目标 alpha。

所有这些变量都是 0-1 之间的十进制值,代表 alpha 或 %time completed。

    targetAlpha - 动画结束时的 alpha 值。 initialAlpha - 动画初始化时盒子开始的 alpha。 animationPos - 动画的当前位置(完成时间百分比) currentAlpha - 盒子的当前 alpha。

也许我今天只是超级油炸,但我一直在尝试这些 vars 的十亿组合以找到有效的方程,但没有运气。

感谢任何帮助!

【问题讨论】:

【参考方案1】:

你想要的是一个linear interpolation,它有两个值ab,以及一个介于0和1之间的插值f

function lerp(a, b, f)
    return a * (1 - f) + b * f
end

现在您可以使用当前动画进度在初始 alpha 和目标 alpha 之间进行插值:

alpha = lerp(initialAlpha, targetAlpha, animationPos)

【讨论】:

非常感谢!

以上是关于如何解决此动画中当前的不透明度?的主要内容,如果未能解决你的问题,请参考以下文章

如何降低左右图像的不透明度?

创建动画SVG路径

Safari不尊重@Keyframes的不透明度/填充

CSS/JS:改变滑动时的不透明度

如何设置绘图的不透明度?

设置Highcharts饼图的不透明度