我正在尝试对沿贝塞尔曲线路径移动的UIImageView对象的位置进行关键帧动画处理。此图片显示了动画之前的初始状态。蓝线是路径-最初是直线向上移动,浅绿色的框是初始边界框或图像,而深绿色的“鬼影”是我要移动的图像:
当我将rotationMode设置为nil
时启动动画时,图像将一直沿预期的方向保持相同的方向。
但是,当我在rotationMode设置为kCAAnimationRotateAuto
的情况下启动动画时,图像立即沿逆时针方向旋转90度,并一直沿路径保持此方向。当到达路径的末尾时,它将以正确的方向重新绘制(实际上,它显示了我在最终位置重新定位的UIImageView)
我很天真地希望rotationMode将图像定向到路径的切线而不是法线,尤其是当Apple文档 CAKeyframeAnimation rotationMode状态时
那么这里的解决方案是什么?我是否必须将图像顺时针预旋转90度?还是我想念的东西?
谢谢你的帮助。
编辑3月2日
我在使用Affine旋转的路径动画之前添加了一个旋转步骤,如下所示:
theImage.transform = CGAffineTransformRotate(theImage.transform,90.0*M_PI/180);
然后在路径动画之后,通过以下方式重置旋转:
theImage.transform = CGAffineTransformIdentity;
这使图像以预期的方式遵循路径。但是,我现在遇到了图像闪烁的另一个问题。我已经在这个SO问题中寻找闪烁的问题的解决方案:
iOS CAKeyFrameAnimation scaling flickers at animation end
所以现在我不知道我的情况是好是坏!
编辑3月12日
尽管Caleb指出是的,但我确实必须预先旋转图像,Rob提供了一个很棒的功能
几乎完全解决了我的问题的代码包。 Rob唯一没有做的就是补偿我的 Assets 以垂直而非水平方向进行绘制,因此仍然需要在制作动画之前将它们预旋转90度。但是,嘿,我必须做一些工作才能使事情顺利进行,这是唯一的公平。
因此,我对Rob对套件的解决方案的轻微更改是我对的要求:
rotationMode
添加的固有旋转:theImage.transform = CGAffineTransformMakeRotation(90 * M_PI/180.0);
theImage.transform = CGAffineTransformScale(theImage.transform,scaleFactor,scaleFactor);
我要做的就是让我的图像按照我的预期去做!
编辑3月22日
我刚刚将一个演示项目上传到GitHub,该演示项目展示了对象沿贝塞尔曲线移动的过程。该代码可以在PathMove中找到
我也在Moving objects along a bezier path in iOS的博客中写过
最佳答案
这里的问题是,Core Animation的自动旋转使 View 的水平轴与路径的切线保持平行。这就是它的工作原理。
如果您希望 View 的垂直轴遵循路径的切线,则按当前操作旋转 View 的内容是合理的做法。