2D sprite rotation and RotateBy animation

cocos2d-x
#1

Hey,

Since I had issues with using SetRotation3D to be able to use the X,Y and Z axis for a 2D rotation (because it caused sprites being displayed in a perspective instead of orthopgrapihic view)

I tried to use the SetRotationY and X, but is there also a SetRotationZ? i couldn’t find any SetRotationZ function so far.

And for RotateBy i have the issue, that using only X and Y (because the 3 axis verison doesn work with 2d rotation) makes a weired rotation:

//Rotate on Y axis to flip the card to the side
float x = 0.f;
float y = 90.f
RotateBy::create(time,x,y)

this rotates the sprite on the Y and Z axis, seems like it uses SkewY internally which uses a Y_Z axis?

can anyone help for direct rotations on X ,Y or Z and animations with X,Y and/or Z.

In other engines I were always able to just use SetRot(x-axis,y-axis,z-axis), SetRotX,SetRotY,SetRotZ for 2D, but with cocos those only work with 3D, would be great if someone could help.

#2

i still couldn’t find the right rotations and rotation animations.
would still need help on this

#3

One thing to note is that we have always been a 2D game engine with 3D being added just a few years ago. I don’t feel that we have quite as mature 3D support as other engines.

Here is our API Ref: http://www.cocos2d-x.org/docs/api-ref/cplusplus/v3x/

Here is RotateBy: http://www.cocos2d-x.org/docs/api-ref/cplusplus/v3x/d0/d28/classcocos2d_1_1_rotate_by.html

We also have RotateTo: http://www.cocos2d-x.org/docs/api-ref/cplusplus/v3x/d0/d71/classcocos2d_1_1_rotate_to.html

Have you checked cpp-tests to see what it offers for an example?

#4

Oh alright.
I’m already so used to think about x,y,z Rotation even in 2d only.

I’ve checked those links already and and the Ratation Code it self, but still unsure to get the simple Rotation like backwards, and side rotations done.

#5

i am somehow not able to generate a simple left/right rotation with RotateBy or RotateTo, would need help there

#6

post code.

#7 
auto sprite = Sprite::CreateWithSpriteFrameName("back_loader.png");
sprite->setPosition(1920/2, 1080/2);
addChild(sprite);

auto action = Sequence::create(DelayTime::create(0.5f), RotateBy::create(0.4f, 0.f, 180.f), DelayTime::create(0.2f), RotateBy::create(0.4f, 0.f, 180.f), nullptr);
sprite->runAction(RepeatForever::create(action));

This uses Z_X and Z_Y as far as i know,

and the rotation looks still doesn’t look like its fully orthographic

2018-06-12_17-01-27

#8

Still not able to get a real 2d side rotation.
Has anyone any ideas?

#9

Hi, maybe simple scaling will do the trick? SetScaleX(-1) should “rotate” image by 180 degrees around Y.

#10

this could be an option, haven’t tried it though,
I’d be still suprised if there doesn’t exist a real 2d side rotation

#11

Let me know how it works for you. I checked it and it is very similar to 2D “rotation” around Y.

#12

just noticed, there isnt any animation node for scaling just x right?
because currently I’m using RotateBy, there is just a ScaleBy for x & y, so in this case i would have to animate it.

#13

There is :slight_smile:

static ScaleBy* create(float duration, float sx, float sy);
static ScaleBy* create(float duration, float sx, float sy, float sz);

Just set 0 for sy and sz.

#14

http://www.cocos2d-x.org/docs/cocos2d-x/en/actions/basic.html

and

http://www.cocos2d-x.org/docs/api-ref/cplusplus/v3x/d6/d06/classcocos2d_1_1_scale_to.html

and

http://www.cocos2d-x.org/docs/api-ref/cplusplus/v3x/df/d00/classcocos2d_1_1_scale_by.html

#16

ok looks promising, I’m not exactly sure how scaleby is meant to work, but leaving y always on 1.f works for scale to.

auto reveal_rotate_1 = ScaleTo::create(.2f, 0.f, 1.f);
auto reveal_rotate_2 = ScaleTo::create(.2f, 1.f, 1.f);

I actually don’t even need the -1 since i switch textures once the texture reaches 0. therfore i just go back to scale 1. 1.

1 Like
#17

ok using the scale as rotation works fine here the result:

#18

Looks nice :slight_smile:

1 Like
#19

yeah thanks for the help