CODEWITHSUNDEEP
actionscript-3flash
Vukašin Petrović
Vukašin Petrović

Reputation: 165

as3 3D global transform / rotation

I have a little problem. I have 2D image of roulette wheel on the stage and used 3D rotation tool to get a little 3D effect (Image 1). Now I want to rotate it on it's Z axis so that I can get spining effect of wheel. I tried to use rotationZ += ... but it doesn't rotate it the way I want. I saw one tool in flash toolbar called "Global transform" (Image 2). When I click it I see transformation lines for image (Image 3), that I need for rotation, the blue line is one I need (Z axis). But I don't know how to use that kind of transformation via code. I don't even know if that is local or global rotation. I hope you understand me, maybe pictures will help you! Thanks!

HERE IS DROPBOX LINK FOR IMAGES --> Dropbox Images

Upvotes: 0

Views: 620

Answers (2)

jauboux
jauboux

Reputation: 888

There is actually some math involved in understanding 3D transformations - including rotations - and how they combine with each other. If your are interested in further explanations, and have a bit of math background, have a look at the theory

otherwise, the first thing you should remember is that rotation/scaling/translations may be composed (combined) but that the order is very important. rotationX, rotationY, rotationZ are sort of "coordinates" that enable to describe any orientation in the vector space, like x,y,z describe any position. But they are not sufficient to allow to do any rotation around any axis from any current orientation. In your case, what you want is to combine a rotation around it's own local z (blue) axis, which means before the initial rotation you have already applied. ex:

roulette.transform.matrix3D.prependRotation(10, new Vector3D(0,0,1));

where 10 would be the angle you chose for the rotation, and the pivot of your object would be the pivot of the rotation (ohterwise, specify your own pivot by passing an additional Vector3D

To complete the picture, if you use appendRotation() instead of prependRotation(), you will rotate your object in the z axis of the world (global) coordinates (after it's current trnasformation).

You may also as already suggested create a Symbol to use as a container, and rotate you object inside it's container, but messing with Matrix3D will give you more control in the end, often with just one line of code like in this case.

Upvotes: 0

Anil
Anil

Reputation: 2553

What you are trying to do is simply an issue of nesting elements and applying effects on them in certain ways.

To accomplish the rotation as you want, you'll want to create your roulette wheel image in 2D as if you were looking at from a birds eye view. I highly recommend creating this graphic in vector format. Import this graphic into Flash and turn it into a movieclip. For arguments sake, I'm going to give this movieclip an instance name of wheel so it is easy for us to follow along with these instructions. Now, within the wheel instance, you'll want to apply a rotation to the roulette wheel. You can accomplish this either by using a Motion tween on the timeline, but the best way would probably be to use a programmatic approach so you can randomize the rotation in some way.

Now, place the 'wheel' instance on the stage and use the 3D Rotation Tool and rotate the wheel on it's X axis, this will make the wheel look like one in your image.

Now if you have performed the rotation within the wheel instance properly, you will have your spinning wheel.

I've created a sample of what you want with the following files using Flash CC 2014 that you can download here:

  1. FLA File
  2. Sample compiled SWF FILE

Upvotes: 1

Related Questions