可以用SpriteKit绘制一条动画线吗？ [英] Is it possible to draw a line with SpriteKit animated?

问题描述

我想用苹果SpriteKit框架从A（100,50）到B（250,450）画一条线。

I want to draw a line from lets say A(100,50) to B(250,450) with Apples SpriteKit Framework.

到目前为止，我能画画这一行使用 SKShapeNode 并设置其路径属性。

So far I am able to draw this line using a SKShapeNode and set its path property.

我想要实现的是绘制这条动画线。让我们说从A点到B点划线需要2秒。

What I want to achieve is to draw this line animated. Lets say it should take 2 seconds to draw the line from point A to B.

我查看了 SKAction class但是似乎没有默认支持此功能的方法。

I looked into the SKAction class but there seems to be no method that supports this functionality by default.

这是我用来创建该行的代码：

This is the code i use to create the line:

CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, NULL, 100, 50);
CGPathAddLineToPoint(path, NULL, 250.0, 450.0);

SKShapeNode *line = [SKShapeNode node];
line.path = path;
[line setStrokeColor:[UIColor whiteColor]];
[self addChild:line];

有人能指出我正确的方向吗？

Can anyone point me in the right direction?

推荐答案

你有一些SKAction方法可能达到你想要的效果：

You have a few methods with SKAction that could likely achieve what you want :

SKAction performSelector：onTarget：

和

SKAction waitForDuration：

如果您继承SKShapeNode，则可以在<$中使用这两种方法c $ c> SKAction序列随着时间的推移绘制线。

If you subclass a SKShapeNode you can utilize those two methods in a SKAction sequence to draw the line over time.

您当然需要手动计算要绘制到每个线的新位置迭代并确定线是否完成并结束绘图随时间的过程。

You will of course need to manually calculate the new location to draw to each iteration and determine if the line is completed and end the drawing over time process.

如果有人有其他方法通过SpriteKit实现此功能，那肯定感兴趣，但如果没有，这个应该工作。

Definitely interested if anyone has another way to achieve this functionality via SpriteKit, but if not, this should work.

抱歉，没有时间对此进行编码，但逻辑应该可以帮助你。

Sorry, don't have time to code this, but the logic should get you there.

更新：

我想到了另一种我个人认为更容易的选择。

I thought of another option which I personally think is a bit easier.

1. 计算th原点和终点之间的角度。


2. 计算原点和终点的距离。


3. 创建圆形或像素的形状节点甚至。把它想象成你将要绘制的铅笔点。


4. 旋转形状节点，使其朝向终点倾斜 - 使用你计算的角度。


5. 创建一个SKAction，根据您计算的距离缩放形状节点的宽度。


6. 运行SKAction。

1. Calculate the angle between origin point and end point.
2. Calculate the distance from origin point and end point.
3. create a shape node of circle or a pixel even. Think of it as your pencil point you will be drawing with.
4. rotate the shape node so that it is angled towards the end point - using the angle you calculated.
5. Create a SKAction that scales the width of your shape node based on the distance you calculated.
6. run the SKAction.

这看起来相对简单，但如果你想让它更灵活，你可以继承子类，比如添加颜色参数等。

This seems relatively easy, but you could still subclass if you wanted to make it more flexible, like adding color parameters etc.

这篇关于可以用SpriteKit绘制一条动画线吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！