【问题标题】:Mimic Apple's UIViewAnimationOptionCurveEaseInOut math equation?模仿苹果的 UIViewAnimationOptionCurveEaseInOut 数学方程?
【发布时间】:2019-03-29 01:02:42
【问题描述】:

我想创建一个看起来像 Apple 的 CurveEaseInOut 一样的动画,以便我的应用程序看起来一致。问题是这个特定的动画不能使用 UIView animate 方法。我必须在每一帧手动操作位置。例如,我得到一个时间 T,我需要输出当时该点的中心 C。我不想使用线性关系(例如 C = T),而是希望它像 Apple 那样缓进缓出。

Apple 为该动画选项使用了哪个曲线方程?

我假设曲线看起来类似于:(取自this question

如果是这样的话,看起来我应该能够用正确的常数调整 Cubic Hermite spline 方程并获得相同的结果。问题是 Apple 使用哪些常量?

【问题讨论】:

  • 你见过this answer吗?这就是你要找的吗?
  • @DavidRönnqvist 我认为这个概念对 OP 来说很清楚。他正在寻找 Apple 默认使用的特定值。
  • @H2CO3 哦,在那种情况下...假设它们与计时函数相同: "kCAMediaTimingFunctionDefault 指定大多数动画默认使用的计时函数。它近似于贝塞尔计时函数使用控制点 [(0.0,0.0), (0.25,0.1), (0.25,0.1), (1.0,1.0)]。通过使用这个常数,您可以确保您的动画将使用当前的默认时间。 @Senseful 这就是你要找的答案吗?
  • @DavidRönnqvist 我认为您应该将其发布为答案。

标签: ios math animation uiviewanimation


【解决方案1】:

正如碳酸 (H2CO3) 所指出的,问题在于 Apple 使用了哪些控制点。

假设它与 Core Animation 中的默认计时功能相同,您可以从文档中获取控制点:

kCAMediaTimingFunctionDefault 指定大多数动画默认使用的计时函数。它使用控制点 [(0.0,0.0), (0.25,0.1), (0.25,0.1), (1.0,1.0)] 逼近贝塞尔计时函数。通过使用这个常量,您可以确保您的动画将使用当前的默认时间。


编辑

既然您提到了自定义动画,我非常建议您观看Animation Custom Layer Properties presentation by Rob Napier。您可以从 Core Animation 中受益,同时仍然可以进行自定义动画。 (观看整个演示文稿。它有助于理解核心动画的大部分内容)

【讨论】:

  • 感谢您的回答。有没有办法直接调用 kCAMediaTimingFunctionDefault 函数?或者模仿相同行为的最佳方法是什么?您是否可以将 other answer 中的数学方程式与上面的常量一起使用?
  • @Senseful 不能直接调用计时函数。根据您想要对计时函数/插值执行的操作,您可以自己进行数学运算(就像我链接到的其他答案一样),但是由于您提到了自定义动画,我非常建议您观看 Animation Custom Layer Properties presentation by Rob Napier。您可以从 Core Animation 中受益,同时仍然可以进行自定义动画。 (观看整个演示文稿。它有助于理解核心动画的大部分内容)
  • Apple 的文档在这里似乎不正确。 neoneye 的回答是正确的。
【解决方案2】:

Simon Whitaker 为CAMediaTimingFunction 提供了一个online javascript configurator

他的代码转储了这些控制点:

linear        (0.00, 0.00), (0.00, 0.00), (1.00, 1.00), (1.00, 1.00)
easeIn        (0.00, 0.00), (0.42, 0.00), (1.00, 1.00), (1.00, 1.00)
easeOut       (0.00, 0.00), (0.00, 0.00), (0.58, 1.00), (1.00, 1.00)
easeInEaseOut (0.00, 0.00), (0.42, 0.00), (0.58, 1.00), (1.00, 1.00)
default       (0.00, 0.00), (0.25, 0.10), (0.25, 1.00), (1.00, 1.00)

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-11-28
    • 1970-01-01
    • 1970-01-01
    • 2023-03-28
    • 1970-01-01
    • 1970-01-01
    • 2015-09-21
    • 2017-09-19
    相关资源
    最近更新 更多