如何围绕节点的Y轴旋转SKSpriteNode？

I'm trying to rotate an SKSpriteNode node around it's Y-axis. I know there's the zRotation property and that will rotate the node clockwise or counter-clockwise; however, I'd like to rotate the node around it's own Y axis (like a dancing ballerina for instance), and I can't seem to find any functionality to do so. What is the best recommended way of doing this?

我正在尝试围绕它的Y轴旋转SKSpriteNode节点。我知道有zRotation属性,它将顺时针或逆时针旋转节点;但是,我想围绕它自己的Y轴旋转节点(例如舞蹈芭蕾舞女演员),我似乎无法找到任何功能。这样做的最佳推荐方法是什么?

4 个解决方案

#1

Typically if I am wanting to rotate something like you seem to be describing, and want it to look good, I will do it via sprite frames depicting different degrees of rotation.

通常情况下,如果我想旋转你似乎在描述的东西,并希望它看起来很好,我会通过描绘不同旋转度的精灵帧来实现。

You can indeed fake it a little by tweening your xScale property from 1 to -1 , and visa versa.

您可以通过将xScale属性从1补间到-1来伪造它,反之亦然。

The xScale trick is feasible for cards maybe (or paper mario), but for a ballerina, not so much. You are looking for 3D rotation of a 2D object, and that's not going to happen via that method.

xScale技巧对于卡片(或纸质马里奥)是可行的,但对于芭蕾舞女演员而言,并非如此。您正在寻找2D对象的3D旋转,而这不会通过该方法发生。

So if the xScale trick is not feasible for your needs, you'll need to handle it via sprite frames.

因此,如果xScale技巧不能满足您的需求,您需要通过精灵帧处理它。

Here's an example of a 3d SpriteSheet that would allow you to achieve the rotation you desire :

这是一个3d SpriteSheet的例子,它可以让你实现你想要的旋转:

This animated gif is an example of sprite frames to get that y rotation :

这个动画gif是用于获得y旋转的精灵帧的示例:

#2

    SKSpriteNode *sprite = [SKSpriteNode spriteNodeWithImageNamed:@"Spaceship"];
    sprite.position = location;
    SKAction* action0 = [SKAction scaleXTo:1.0 duration:0.5];
    SKAction* action1 = [SKAction scaleXTo:0.1 duration:0.5];
    SKAction* action2 = [SKAction scaleXTo:-0.1 duration:0.5];
    SKAction* action3 = [SKAction scaleXTo:-1.0 duration:0.5];

    SKAction* action = [SKAction sequence:@[action0, action1, action2, action3]];
    [sprite runAction:[SKAction repeatActionForever:action]];

    [self addChild:sprite];

This will get you what looks like a 3D card flip, but obviously if you're expecting an object to have depth you wont get that programatically with scaling.

这将使你看起来像3D卡片翻转,但显然如果你期望一个对象有深度,你不会以缩放方式编程。

Or well less animations (As LearnCocos2D suggested):

或者更少的动画(如LearnCocos2D建议):

    SKSpriteNode *sprite = [SKSpriteNode spriteNodeWithImageNamed:@"Spaceship"];
    sprite.position = location;
    SKAction* action0 = [SKAction scaleXTo:1.0 duration:0.5];
    SKAction* action1 = [SKAction scaleXTo:-1.0 duration:0.5];

    SKAction* action = [SKAction sequence:@[action0, action1]];
    [sprite runAction:[SKAction repeatActionForever:action]];

    [self addChild:sprite];

#3

SpriteNode *spriteNode = [SKSpriteNode spriteNodeWithImageNamed@"Sprite"];
spriteNode.position = position;

SKAction *action = [SKAction repeatActionForever:[SKAction customActionWithDuration:duration actionBlock:^(SKNode *node, CGFloat elapsedTime) {
    node.xScale = sin(2 * M_PI * elapsedTime / duration);
}]];

[self addChild:spriteNode];

However, the sprite looks like having no thickness.

但是,精灵看起来没有厚度。

#4

Although SpriteKit doesn't have full 2.5D capabilities (rotating and transforming along X, Y and Z axes), I've developed a work around for rotating SKSpriteNodes around either the X or Y axes. Because SKView is a subclass of UIView, we can rotate it in 3D space the same way we rotate a UIView, using CATransform3D.

虽然SpriteKit没有完整的2.5D功能(沿X,Y和Z轴旋转和变换),但我开发了一种绕X轴或Y轴旋转SKSpriteNodes的方法。因为SKView是UIView的子类,所以我们可以使用CATransform3D以与旋转UIView相同的方式在3D空间中旋转它。

The main point is that the sprite that needs to be rotated on the Y axis lives in its own scene, which is presented in its own SKView.

重点是需要在Y轴上旋转的精灵存在于自己的场景中,该场景在自己的SKView中呈现。

Triggering the following code on in a loop will animate your SKView (containing the SKScene and the SKSpriteNode) on the y axis. You can still have your main scene running at the same time in the background and swap in the sprites that need to be animated on the y axis and then swap them out when animation complete, and remove Y rotation scene. It's not a pretty solution, but it's all there is until Apple adds better 2.5D capabilities.

在循环中触发以下代码将在y轴上为SKView(包含SKScene和SKSpriteNode)设置动画。您仍然可以在后台同时运行主场景并交换需要在y轴上设置动画的精灵,然后在动画完成时将它们交换出来,并移除Y旋转场景。这不是一个漂亮的解决方案,但是直到Apple增加了更好的2.5D功能才能实现这一切。

I've written a tutorial on SpriteKit and 2.5D with sample code if you need more info. http://www.sdkboy.com/?p=283

如果您需要更多信息,我已经编写了一个关于SpriteKit和2.5D的教程和示例代码。 http://www.sdkboy.com/?p=283

self.rotAngle -= 10;

float angle = (M_PI / 180.0f) * self.rotAngle/10;

CATransform3D transform3DRotation = CATransform3DMakeRotation(1.0, angle, 0.0, 0.0);

self.mySKView.layer.transform = transform3DRotation;