Tag: 3D

Fuzzy graphics after rotations

Fuzzy graphics after rotations

If you’ve ever set the martix3D & Z position for a flex object you’ll have noticed that as soon as you do it loses its sharpness.  This is especially noticeable if you’re container/object has text in it.

 

Well here are the few simple steps to make sure that when you need you’re object to get its ‘sharpness’ back you can.

  1. Before you set the Z property and while the matrix3D is null take a copy of the objects matrix.  You can do this by accessing object.transform.matrix, note as soon as you set the Z property the matrix3D will go from being null to being set and the matrix value will end up becoming null.
  2. If using a tween or similar to go between a certain value (rotation) and 0 then I found that unless you explicitly use the value 0 in the end tween function that it may set the end value as 0.0001 or something very close to 0.  This will not be enough, so in the end tween function I always explicitly set the value to whatever I want it to be at the end.  e.g. if my tween was something like Tween(this , 90, 0) then in the onTweenEnd() I make sure that the value is 0 (rather than just using the value passed into the end function – which may or may not be exaclty 0).
  3. As soon as the rotation value is 0, then I set the Z property to NaN, then set the object.transform.martrix3D to null and finally I make the object.transform.matrix = the previously copied matrix.
  4. As soon as you copy the matrix to the transform.matrix property you should see your object become sharp again.
  5. Thats it 🙂 .

Hope this helps a bit.

[ad]

Side effect from cube effect

Side effect from cube effect

Well I’ve been working on creating some cube style effects at my work and in particular an actionscript project that will take any number of containers and then rotate them in a cube style using the new flash 10 libaries.

Anyway I got a Sin() mixed up for a Cos() and the following effect happened which I thought was quite a cool effect. Ignore the colours and its roughness it’s just a prototype swf but I thought I stick it up just to show the side effect that I never expected 🙂

Not Expected

[kml_flashembed movie=”/flex/3d_experiment_wrong/WrongWay.swf” height=”500″ width=”600″ /]

 

 

Expected

[kml_flashembed movie=”/flex/3d_experiment_wrong/CorrectWay.swf” height=”500″ width=”600″ /]

 

[ad]

Flex / Flash 10 3D examples

Flex / Flash 10 3D examples

I’ve been doing a bit of R&D around the new 3D features in flash 10 for my work recently and seeing as there is very little info/tutorials out there on the subject I thought I’d add what I’ve found out.

Firstly I’ll just post some of the examples I’ve done and I’ll create a step by step guide next.

Example 1 is a simple VBox that rotates on its Z-axis (if you try to just rotate a container or similar in flex 3 it will rotate around the registration point, which isn’t exactly very useful in most circumstances). So you have to use the new Matrix3D class.
Should you come across this post before I create the tutorial, key points to note
You must translate the object in reference to its parent container
Take a copy of its 3D matrix before you do anything, then only apply transformations on that matrix.

Example 2, the obligatory spinning cube without textures.

Example 3, the obligatory spinning cube with textures. Again if you’re looking at this before I do a tutorial on the subject take note
You must add 24 vertexes (4 for each side) for the bitmap textures to map properly using the uvt data. This caught me out for ages as a cube really has 8 vertexes and I was reusing the same points when building the cube!

 

[ad]