Flash/flex Study Notes (51): 3-dimensional rotation and perspective transformation (perspectiveprojection)

Flash/flex Study Notes (49): the basic principles of 3D pivoting have been introduced in 3D basics. However, if you want to write a bunch of code every time, it is estimated that many people do not like it. In fact, the displayobject class of as3 has built-in zcoordinate, rotationx, rotationy, and rotationz attributes, and the perspectiveprojection class is used to process perspective conversion, it can basically meet most 3D requirements.

Import flash. events. event; import flash. display. sprite; import flash. text. textfield; import flash. events. mouseevent; import flash. text. textfieldautosize; var keys = false; var txtx: textfield, txty: textfield, txtz: textfield, txtposz: textfield, struct: textfield, txtinfo: textfield, txtcenter: textfield, txtfocuslength: textfield; txtx = new textfield (); txtx. TEXT = "rotationx:"; txty = new textfield (); Txty. TEXT = "rotationy:"; txtz = new textfield (); txtz. TEXT = "rotationz:"; txtposz = new textfield (); txtposz. TEXT = "Z:"; txtfieldofview = new textfield (); txtfieldofview. TEXT = "Perspective:"; txtcenter = new textfield (); txtcenter. TEXT = "disappear:" txtfocuslength = new textfield (); txtfocuslength. TEXT = "focal length:"; txtx. y = txty. y = txtz. y = 5; txtx. X = txtposz. X = 10; txtposz. y = txtx. Y + 26; txtposz. X + = 40; txty. X = txt X. * + 180; txtz. X = txty. * + 180; txtfieldofview. X = txtposz. * + 160; txtfieldofview. y = txtposz. y; txtcenter. X = txtfieldofview. X + 170; txtcenter. y = txtposz. y; txtinfo = new textfield (); txtinfo. TEXT = ""; txtfocuslength. X = txtx. X + 25; txtfocuslength. y = txtposz. Y + 25; var imgbd: bitmapdata = new imgsample (); var IMG: bitmap = new Bitmap (imgbd); trace ("IMG. width = ", IMG. width, ", IMG. height = ", IMG. height); var im Gsprite: SPRITE = new sprite (); IMG. X =-IMG. width/2; IMG. y =-IMG. height/2; imgsprite. addchild (IMG); trace ("imgsprite. width = ", imgsprite. width, ", imgsprite. height = ", imgsprite. height); var containersprite: SPRITE = new sprite (); containersprite. addchild (imgsprite); imgsprite. X = IMG. width/2; imgsprite. y = IMG. height/2; addchild (containersprite); trace ("containersprite. width = ", containersprite. width, ", c Ontainersprite. height = ", containersprite. height); containersprite. X = stage. stagewidth/2-containersprite. width/2; containersprite. y = stage. stageheight/2-containersprite. height/2; containersprite. z = 50; var silderx: simpleslider = new simpleslider (0,360, 0); silderx. X = txtx. X + 160; silderx. y = txtx. Y + 7; silderx. rotation = 90; var sildery: simpleslider = new simpleslider (0,360, 0); sildery. X = T Xty. X + 160; sildery. y = silderx. y; sildery. rotation = 90; var silderz: simpleslider = new simpleslider (0,360, 0); silderz. X = txtz. X + 160; silderz. y = silderx. y; silderz. rotation = 90; var silderposz: simpleslider = new simpleslider (-200,200, 50); silderposz. X = txtx. X + 160; silderposz. y = silderx. Y + 25; silderposz. rotation = 90; var silderfieldofview: simpleslider = new simpleslider (0.1, 179.9, 90); silderfield Ofview. X = silderposz. X + 180; silderfieldofview. y = silderposz. y; silderfieldofview. rotation = 90; var sildercenterpos: simpleslider = new simpleslider (150,400,275); sildercenterpos. X = silderfieldofview. X + 180; sildercenterpos. y = silderposz. y; sildercenterpos. rotation = 90; var silderfocuslength: simpleslider = new simpleslider (100,500,300); silderfocuslength. X = silderposz. x; silderfocuslength. y = Sild Erposz. Y + 25; silderfocuslength. rotation = 90; addchild (txtx); addchild (txty); addchild (txtz); addchild (txtposz); addchild (txtfieldofview); addchild (txtinfo); addchild (txtcenter ); addchild (txtfocuslength); addchild (silderx); addchild (sildery); addchild (silderz); addchild (silderposz); addchild (region); addchild (sildercenterpos); addchild (silderfocuslength ); silderx. addeventlistener (event. change, silderxc Hangehandler); sildery. addeventlistener (event. change, silderychangehandler); silderz. addeventlistener (event. change, silderzchangehandler); silderposz. addeventlistener (event. change, silderposzchangehandler); silderfieldofview. addeventlistener (event. change, silderfieldofviewchangehandler); silderfieldofview. addeventlistener (mouseevent. mouse_up, function () {isanglechangeing = false}); sildercenterpos. addeventlis Tener (event. change, sildercenterposchangehandler); silderfocuslength. addeventlistener (event. change, silderfocuslengthchangehandler); function showtxtinfo (S: simpleslider) {txtinfo. TEXT = S. value. tostring (). substr (0, 5); txtinfo. X = mousex + 20; txtinfo. y = S. Y + 5;} function silderxchangehandler (E: Event): void {imgsprite. rotationx = silderx. value; showtxtinfo (silderx);} function silderychangehandler (E: Event): V Oid {imgsprite. rotationy = sildery. value; showtxtinfo (sildery);} function silderzchangehandler (E: Event): void {imgsprite. rotationz = silderz. value; showtxtinfo (silderz);} function silderposzchangehandler (E: Event): void {containersprite. z = silderposz. value; showtxtinfo (silderposz);} function silderfieldofviewchangehandler (E: Event): void {doperspectiveprojection (); showtxtinfo (silderfieldofview); isanglechang Eing = true;} function sildercenterposchangehandler (E: Event): void {doperspectiveprojection (); showtxtinfo (sildercenterpos);} function execution (E: Event): void {doperspectiveprojection (); showtxtinfo (silderfocuslength);} function doperspectiveprojection (): void {var PP: perspectiveprojection = new perspectiveprojection (); pp. fieldofview = silderfieldofview. value; If (! Isanglechangeing) {pp. focallength = silderfocuslength. value;} // trace (pp. focallength); pp. projectioncenter = new point (sildercenterpos. value, sildercenterpos. value); containersprite. transform. perspectiveprojection = pp;} doperspectiveprojection (); var txtauthor: textfield = new textfield();txtauthor.html text = "<a href = 'HTTP: // yjmyzz.cnblogs.com/'target = '_ blank'> by Yang Guo under the bodhi tree </a> "; addchild (txtauthor); txtauthor. y = txtfocuslength. y; txtauthor. X = 425; txtauthor. autosize = textfieldautosize. left;

A little explanation:

Zcoordinate: the coordinate of the object on the Z axis. Flash uses the three-dimensional coordinate of the right hand by default. That is to say, the larger the Z value, the smaller the object.

Rotaionx, rotationy, and rotationz: the angle from which an object rotates around the X, Y, and Z axes.

The perspectiveprojection object has three attributes:

1. focallength indicates the focal length. The larger the focal length, the larger the object (? Different from conventional understanding), and according to official help: During the perspective conversion process, the field of view angle and the height-to-width ratio of the stage (the width of the stage divided by the height of the stage) will be used for automatic calculation.focalLength

2. fieldofview is the three-dimensional "Angle of View" of the observation point (value between 0 and 180). I haven't thought about how to understand it, but in terms of the effect, if the Z axis coordinate of an object is not 0, the larger the value, the more exaggerated the distortion and deformation of the object. When the value is dynamically adjusted, the focallength value is automatically recalculated. (If focallength is written in code, no effect will be displayed no matter how fieldofview is adjusted)

3. projectioncenter: The Disappearing point in 3D pivoting. When the Z axis is approaching an infinite number, the object tends to disappear ).

 

Finally, the above Code hides two tips

1. Why do I need to put the image in imgsprite first, and then put imgsprite in containersprite again?

Because there is a center point of rotation when rotating, and Flash defaults to this center is the left vertex of the object, that is, the (0, 0) position, with two sprite nested, and then with the coordinate settings, cleverly move the center point to the image center, such:

2. How to Use code to retrieve an image from the library?

For example, the key is to specify the "class" name when importing images, so that you can use

VaR imgbd: bitmapdata = new imgsample (); // retrieve an image from the library var IMG: bitmap = new Bitmap (imgbd );

Get a bigmap instance of the image