Introduction
Papervision3D, ou PV3D, est un moteur 3D open-source pour Flash. Il permet de simuler un environnement en 3 dimensions à partir d'une animation Flash et de tout ce qu'elle comporte (clips, boutons, photos, vidéos, etc). Il existe deux versions, l'une en ActionScript 3.0 et l'autre en ActionScript 2.0, mais il est fortement recommandé d'utiliser la version AS3 qui est plus stable et plus avancée. L'utilisation de PV3D dans vos animations les rend gourmandes en ressources et sachez que tous vos visiteurs n'ont pas la chance d'avoir un ordinateur un peu puissant. Aussi, si d'aventure vous profitez de l'occasion pour apprendre l'ActionScript 3.0, lisez attentivement le premier point de ce tutoriel.
Dernière modification : 24 Janvier 2009.
Sommaire
-
Les classes de Papervision3D
-
La scène
-
Le caméraman
-
Les acteurs et les costumes
-
Création d'un environnement 3D
1. Les classes de Papervision3D
Papervision3D n'est autre qu'un ensemble de classes, des plans utiles à Flash pour représenter un environnement en 3 dimensions. Comme pour les classes Sprite et MovieClip de Flash, il suffit d'importer les classes Papervision3D dans vos animations (dans lesdites classe du document) afin de les utiliser.
Ainsi, vos animations nécessitent l'importation d'un certain nombre de classes Papervision3D :
package
{
import flash.display.Sprite;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.cameras.Camera3D;
import org.papervision3d.objects.Plane;
import org.papervision3d.materials.ColorMaterial;
...
Chacune d'elles crée un objet utile à un environnement 3D.
Et comme un réalisateur qui définit les éléments essentiels de son film...
- la scène
- le caméraman
- les acteurs
- les costumes
...un environnement Papervision3D nécessite au moins une scène, un caméraman, un acteur et des costumes :
- la scène : les classes de type scenes
- le caméraman : les classes de type cameras
- les acteurs : les classes de type objects
- les costumes : les classes de type materials
Chacun de ces types contient une série de classes pour générer des objets :
- la scène : les classes de type scenes : Scene3D, MovieScene3D, InteractiveScene3D
- le caméraman : les classes de type cameras : Camera3D, FreeCamera3D
- les acteurs : les classes de type objects : Plane, Cube, Sphere
- les costumes : les classes de type materials : BitmapMaterial, MovieMaterial, ColorMaterial
2. La scène
Une animation Flash classique peut être classifiée comme étant une animation en 2D, c'est-à-dire comme ayant des objets animés par rapport à deux axes, X et Y. L'axe X représentant l'horizontal et l'axe Y la verticale. Ainsi chacune de vos interpolations de mouvement font jouer les coordonnées de vos clips sur ces deux axes. Une animation 3D comporte aussi les axes X et Y, auxquels on ajoute un troisième axe Z pour représenter la 3ème dimension, ou la profondeur. C'est ainsi que l'on obtient un effet de perspective et de 3D :
Une scène Papervision3D agît comme un repère à trois dimensions. C'est un objet destiné à contenir d'autres objets (les acteurs) afin de les positionner sur trois axes X, Y, et Z. Mais pour fonctionner une scène a besoin d'un conteneur, un objet qui va lui permettre d'accueillir des acteurs. Cet objet doit être de la classe Sprite.
Voici donc comment se définissent une scène Papervision3D et son conteneur Sprite :
// Création d'un conteneur Sprite
var container :Sprite;
container = new Sprite();
// Ajout du conteneur sur la scène de l'animation Flash
addChild( container );
container.x = stage.stageWidth / 2;
container.y = stage.stageHeight / 2;
// Création d'une scène Scene3D à partir du conteneur
var scene :Scene3D;
scene = new Scene3D( container );
3. Le caméraman
Pour se représenter une scène, Papervision3D ou pas, vous devez définir un observateur, l'endroit où il se situe et dans quelle direction il regarde. Ce sont les objets de type cameras qui remplissent cette fonction. Il en existe deux différents, Camera3D et FreeCamera3D :
L'objet FreeCamera3D se définit avec 6 propriétés principales : les coordonnées x, y et z de la caméra, ainsi que les rotations sur les axes X, Y et Z. Le paramétrage d'un tel objet est assez complexe lorsque l'on débute, c'est pourquoi nous utiliserons plutot l'objet Camera3D.
L'objet Camera3D se définit aussi avec 6 propriétés principales : les coordonnées x, y et z des deux objets goto et target. Ce sont des objets de la classe DisplayObject3D qui n'ont pour fonction que de représenter la position d'un point dans la scène 3D. En l'occurence la position de la caméra et celle de sa cible. Les rotations de la caméra sont calculées automatiquement.
Voici donc comment se définit un objet Camera3D :
// Création d'un objet Camera3D
var camera :Camera3D;
camera = new Camera3D();
// Définition des objets goto et target
var gotoObject :DisplayObject3D = new DisplayObject3D();
gotoObject.x = 0;
gotoObject.y = 0;
gotoObject.z = 0;
var targetObject :DisplayObject3D = new DisplayObject3D();
targetObject.x = 200;
targetObject.y = 200;
targetObject.z = 200;
// Paramétrage de l'objet Camera3D
camera.extra =
{
goPosition: gotoObject,
goTarget: targetObject
};
3. Les acteurs et les costumes
Voici venus les objets de type objects : Plane, Cube et Sphere. Ce sont les acteurs d'une scène Papervision3D. Comme leur nom l'indique, ils vous permettent de créer des surfaces, des cubes ou encore des sphères.
Pour les personnaliser et leur donner des textures, on les utilise conjointement avec des objets de type materials, les costumes. Par exemple, pour donner de la couleur à une surface on utilise l'objet ColorMaterial. Ou encore pour afficher le contenu d'un clip MovieClip on utilise l'objet MovieMaterial.
Ainsi, une surface Plane de couleur 0x0000FF et de dimensions 480x320px se définit comme suit :
// Création d'un objet de texture ColorMaterial
var color :ColorMaterial;
color = new ColorMaterial( 0x0000FF );
// Création de l'objet Plane
var plane :Plane = new Plane( color, 480, 320 );
// Ajout de l'objet Plane dans une scène Papervision3D
scene.addChild( plane, "myPlane" );
4. Création d'un environnement 3D