Away3D : rotations de cubes

Le 3 mai 2011 - 3D, Molehill, Lab  -  2 Commentaires
Rotation 3d avec away3d

J'ai beaucoup aimé le site http://www.momentoftruth.com/ qui avait remporté un FWA il y a quelques temps. L'animation de départ avec la rotation des cubes m'avait particulièrement plu (un ensemble de cubes 3D qui tournent). J'avais voulu testé Away3D pour l'occasion avec une animation sans prétention mais un peu similaire (bon ok c'est beaucoup plus simple) donc voici ce que ça donne (cliquez sur l'objet pour le faire tourner) :

This movie requires Flash Player 9

Le code est vraiment tout simple, le plus long à coder est le placement des cubes.

Pour la création de chaque cube je fais cela :

[Embed(source="../ressource/default.jpg")]
public static var imgdefault:Class;
[Embed(source="../ressource/260_200.jpg")]
public static var img260x200:Class;
[Embed(source="../ressource/380_200.jpg")]
public static var img260x200:Class;
 
var cubeMaterial:CubeMaterialsData = new CubeMaterialsData();
cubeMaterial.right = new BitmapMaterial( Cast.bitmap(img260x200) );
cubeMaterial.front = new BitmapMaterial( Cast.bitmap(img380x200) );
cubeMaterial.bottom = new BitmapMaterial( Cast.bitmap(imgdefault) );
cubeMaterial.left = new BitmapMaterial( Cast.bitmap(imgdefault) );
cubeMaterial.back = new BitmapMaterial( Cast.bitmap(imgdefault) );
cubeMaterial.top = new BitmapMaterial( Cast.bitmap(imgdefault) );
 
var cube1:Cube = new Cube( { cubeMaterials:cube1Material, x:-150, y:20, z:-130, width:380, height:200, depth:260, segmentsW:3, segmentsH:3, segmentsD:3 } );

Ensuite chaque cube est ajouté à un container, et la caméra fixe ce container :

blocContainer = new ObjectContainer3D( { name:"Bloc", visible:true }, cube1);//ajouter les autres cubes à la suite
view.scene.addChild(blocContainer);
camera.target = blocContainer;
view.render();

Pour ce qui est de la rotation, j'utilise la classe TweenMax de Greensock sur l’évènement Click :

TweenMax.to(blocContainer, 0.5, { rotationY:blocContainer.rotationY +90 } );
TweenMax.to(this, 0.3, { blurFilter: { blurX:10 }, onComplete:clearBlur} );
 
private function clearBlur():void
{
	TweenMax.to(this, 0.2, { blurFilter: { blurX:0 } } );
}
Mots-clefs :, , , , ,

Laisser un commentaire