Gallerie cubique utilisant papervision et caurina

Bonjour à tous, j'étais en quête d'un bon tutoriel flash utilisant le moteur Papervison 3D allié à la classe Caurina, malheureusement je n'ai pas trouvé mon bonheur sur les sites français. Par contre, en cherchant sur les sites anglophones, j'ai pu enfin trouver ce dont j'étais venu chercher. Je ne sais pas si vous avez remarqué, mais je vous ai présenté le moteur pv3d et aussi préparé un tutoriel sur les Tweens. Je pense qu'avec ce qui a déjà été présenté, vous êtes maintenant capable d'utiliser concrètement les derniers tutoriaux. Pour les anglophones, vous pouvez visiter le site qui propose ce tutoriel sur cette page:

http://www.flashperfection.com/tutorials/3D-Cube-Gallery-70735.html

Sinon, voici un tutoriel vidéo, bien sûr vous verrez quelques différences entre le tutoriel du site flashperfection et le mien, mais dans l'ensemble vous retrouverez les mêmes fonctionnalités, seul les parties graphiques et une petite partie du code ont été modifiés.


Voici le résultat du tutoriel:


Les sources:
(essayez quand même de faire le tutoriel avant de télécharger la source, je rappelle qu'à la base il a été réalisé dans le but de mieux comprendre l'utilisation de papervision3d :D )
Galerie3D.zip

Le code:

Code:


//papervision
import org.papervision3d.scenes.*;
import org.papervision3d.cameras.*;
import org.papervision3d.objects.*;
import org.papervision3d.objects.special.*;
import org.papervision3d.objects.primitives.*;
import org.papervision3d.materials.*;
import org.papervision3d.materials.special.*;
import org.papervision3d.materials.shaders.*;
import org.papervision3d.materials.utils.*;
import org.papervision3d.lights.*;
import org.papervision3d.render.*;
import org.papervision3d.view.*;
import org.papervision3d.events.*;
import org.papervision3d.view.*;
import org.papervision3d.core.utils.*;
import org.papervision3d.core.utils.virtualmouse.VirtualMouse;

//caurina
import caurina.transitions.Tweener;

var viewport:Viewport3D = new Viewport3D(0,0,true,true);
addChild(viewport);

var render:BasicRenderEngine = new BasicRenderEngine ();
var scene:Scene3D = new Scene3D();
var camera:Camera3D = new Camera3D;
camera.zoom = 11;
camera.focus = 100;

var material1:MovieMaterial = new MovieMaterial (face1);
material1.interactive = true;
material1.animated =true;
material1.smooth =true;

var material2:MovieMaterial = new MovieMaterial (face2);
material2.interactive = true;
material2.animated =true;
material2.smooth =true;

var material3:MovieMaterial = new MovieMaterial (face3);
material3.interactive = true;
material3.animated =true;
material3.smooth =true;

var material4:MovieMaterial = new MovieMaterial (face4);
material4.interactive = true;
material4.animated =true;
material4.smooth =true;

var cube:Cube =new Cube (new MaterialsList({front:material1,left:material2,right:material3,back:material4}),250,250,250,10,10,10);
scene.addChild(cube);

addEventListener(Event.ENTER_FRAME,placement);
suite_mc.addEventListener(MouseEvent.CLICK, suite);
retour_mc.addEventListener(MouseEvent.CLICK, retour);

suite_mc.buttonMode = true;
retour_mc.buttonMode = true;


function placement (pEvt:Event){
   render.renderScene(scene, camera, viewport);
}
function suite (pEvt:MouseEvent){
   var newY = cube.rotationY +89;
   Tweener.addTween(cube, {rotationY:newY, time:1, transition:"easeoutexpo"});
}
function retour (pEvt:MouseEvent){
   var newY = cube.rotationY -89;
   Tweener.addTween(cube, {rotationY:newY, time:1, transition:"easeoutexpo"});
}


Le tutoriel:

:::::::::::::::::::::::::::::::::::::::::::::Partie1::::::::::::::::::::::::::::::::::::::::::


:::::::::::::::::::::::::::::::::::::::::::::Partie2::::::::::::::::::::::::::::::::::::::::::

rien a voir avec ce tutoriel
mais je voulais juste dire que tu es vraiment doué sur flash et que tu devrais en faire un métier
j'en suis raide dingue de tes tutoriels !!! et j'espere un jour être aussi douée que toi !!
fin de la parenthèse

Ton tutoriel est vraiment pratique et je voudrais savoir si on peut intégrer ce flash dans un site html ???

pourquoi ne pourrait on pas? c'est un swf, donc y a pas de probleme^^, du moment que y a un player chez le visiteur :D...tout a fait dac', artka realise de beau boulot, et le peu le temps utilisé pour attraper cette maitrise y a pas a dire, t'es doue...la je dois me cacher avec mes 4 ans de flash x)...mais bon, il investit beaucoup de temp dans le forum donc je ne peux etre qu'heureu qu'il travail pour^^...jviens de me rappeler que j'ai toujours un menu glow a faire pour toi, haaaan, au boulot flemmard^^

Bon et bien darkrat à encore une fois était plus rapide que moi et il a encore raison, car en effet, comme cette animation est un SWF, il est tout à fait possible de m'intégrer sur un site.

Pour les compliments et bien ça fait plaisir que mes efforts soient récompensés par vos paroles élogieuses. Merci à vous, car le forum ne serait pas grand-chose sans votre participation. En espèrent que le prochain tutoriel vous plaise autant, je vous dis, bonne soirée. Allez hop, je décolle car je suis en train de me taper les doigts :D

salut dans ta premeire vidéo, tu parle d un autre tuto, pour charger la bibliotèque papervision, et pour la télécharger....
mais j'ai beau chercher comme un fou sur ce forum je ne trouve pas....

peut tu m'aider stp, car j'essaye de faire un site pour mon frere, et la je vai bruler ma maison dans peu de temps...lol. merci

Oui bien sûr, voici le lien qui t'emmèneras sur la page des meilleurs sites pour installer et utiliser papervision 3d (à mon avis)


http://www.artkabis.net/tutos-autres-sites-f64/telecharger-installer-et-utiliser-papervision3d-t297.htm

Merci beaucoup, j y suis enfin arriver, il auras fallu le temps mais là c pas trop mal

par contre je me demandais si il etait possible de rajouter plus de face au "cube" ?

ce qui me permetrait de fr une petite gallerie de présentation de 8/10 images si c possible

merci pour tes réponse ainsi que du temps consacrés à ce site que je découvre de jour en jour et qui trés trés bien expliquer

Pour répondre à ta question, il est en effet possible d'utiliser toutes les faces du cube (donc 6) . Par contre, pour avoir comme toi tu le souhaites, c'est-à-dire 8/10 images, il faut revoir tout le concept, car tu seras obligé :

soit de modifier les images non visible, pour quelle apparaissent une fois la rotation effectuée.

Soit de créer une autre forme, personnellement la première solution me paraît la plus envisageable.

Mais je pense qu'il faut déjà bien maitriser pv3d sans oublier d'être assidu au niveau du code, car à mon avis ceci demandera pas mal de compétences.

Sinon merci pour le petit message de fin, cela fait toujours plaisir de voir que les membre se rendent compte du temps passé pour mettre en place tous ces tutoriels.

Si je trouve une solution pouvant t'aider à réaliser ce que tu cherches à faire, je te le ferais savoir.

merci pour ta réponse

une chose est sur c est que ça m as l air encore bien trop complexe pour le moment vu que je débute en flash :p

mais surement un jour à force je finirais par tout bien comprendre xD

merci encore ^^

Oui en effet tu as raison, commence par des tutos qui te semblent plus simples et de toute façon au bout d'un certain temps, tu reviendras ici en comprennent la totalité du tuto