Just Tilt Your Head! (Flex 3.2 & 3D, Getting It Right!)

by admin on Feb.05, 2009, under 3D

So if you have tried to rotate things in the new Flex 3.2, you have noticed that thing are a bit askew by default.

Check this demo here…

You can either set your applications width and height to something static (PLEH!), or you can do something like this:

<?xml version="1.0" encoding="utf-8"?>
 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*"
 
width="100%" height="100%"
 
xmlns:geom="flash.geom.*"
 
creationComplete="setVanishingPoint()"
 
resize="setVanishingPoint()"
 
>

<mx:Script>
 
<![CDATA[
 
private function setVanishingPoint():void
 
{
 
var mainTrans:Transform = new Transform( DisplayObject( this ) );
 
var mainPersp:PerspectiveProjection = new PerspectiveProjection();
 
mainPersp.projectionCenter = new Point( this.width/2, this.height/2 );
 
mainTrans.perspectiveProjection = mainPersp;
 
this.transform = mainTrans;
 
}
 
]]>
 
</mx:Script>

 
<mx:Button id="btn" label="Button" width="100" height="100"
 
horizontalCenter="0" verticalCenter="0"
 
rotationX="35"
 
/>
 
</mx:Application>

:3D, fix, flex 3.2, skewed, vanishing point

6 comments for this entry:

Shawn
March 13th, 2009 on 2:41 pm
Hey check out wp-syntax, really easy to use and does code highlighting automatically for you.

http://wordpress.org/extend/plugins/wp-syntax/
admin
March 13th, 2009 on 3:41 pm
Just installed it, thanks man!
Shawn
March 13th, 2009 on 4:28 pm
Why is it in 3 different blocks?
admin
March 14th, 2009 on 12:33 am
Well, it’s two types of code, AS3 and MXML, so I did multiple pre tags, is there a better way?
Shawn
March 14th, 2009 on 3:35 am
*shrugs*

idk if you can nest the tags, give it a shot.
admin
March 16th, 2009 on 1:24 am
Nope, nesting just makes a mess of things