将UILabel位置更改为CGPath的strokeEnd

问题描述:

我正在尝试实现与所附图像类似的效果,其中圆会根据您的关卡进度进行动画处理,然后在动画路径的末尾附加一个标签以显示获得的经验以及未绘制的部分显示剩余的经验。我可以根据需要设置动画圆环,但是在找到正确的标签解决方案时遇到了麻烦。
我尝试将标签的位置设置为path.currentPoint,但这似乎始终是绘制路径的开始而不是结束。

I'm trying to achieve something similar to the attached image, where the circle is animated depending on your level progress and then a label is attached to both the end of the animated path to show the gained experience and also the undrawn part of the circle to show the remaining experience. I have the circle animating as wanted but am having trouble coming up with a solution to the labels to appear in the right spot. I've tried setting the position of the label to the path.currentPoint but that always seems to be the start of the drawn path and not the end.

关于如何实现此目标的任何指针都是很棒的!

Any pointers on how to achieve this would be great!

我一直在研究您的问题,首先要实现这一点,您必须为路径真实路径设置动画,如果您只对的进行动画,则不仅对进行动画处理, c $ c>将始终返回路径的圆端点,为了使路径动起来,您需要制作一个KeyFramed Animation,将路径动画为 keyPath 并传递从当前角度到所需角度的路径数组,然后为了为标签设置正确的位置,您需要获取所有这些路径值的de currentPoint并使用 position keyPath制作另一个keyFramed动画,并将所有收集到的这些点作为值传递来自路径数组

I had been working on your question, first of all to achieve this you must animate the path the real path, not only the strokeEnd, if you animate only the strokeEnd your path.currentPoint will always return the circle endPoint of the path, in order to animate the path you need to make a KeyFramed Animation animating the "path" as keyPath and passing an array of paths from current angle to desired one, then in order to set the correct position for your label you need to get de currentPoint of all this paths values and making another keyFramed animation with "position" keyPath and passing as values all this points collected from paths array

这是工作的基本示例

This is a basic example working

代码在GitHub中的 Repo $ b中$ b 您还有很多工作要做,但这可能是最终解决方案的起点

The code is in GitHub in this Repo You have a lot of work to do yet but, this can be an starting point for your final solution

希望这会有所帮助,最好问候

Hope this helps, best regards