par Salut les loulous, comme promis, voici le tutoriel carrousel. Nous allons donc nous amuser à créer un carrousel 3d où il sera possible de faire pivoter sur l'axe horizontale et verticale.
Pour ce premier tutoriel, j'ai décidé de coder en AS2, mais sachez qu'une version codé en AS3 sera bientôt disponible. Voici donc à quoi ressemblera votre carrousel une fois le tuto terminé:
Voici le fichier source:
Carroussel.fla
Voici le code utilisé:
Le tutoriel:
Pour ce premier tutoriel, j'ai décidé de coder en AS2, mais sachez qu'une version codé en AS3 sera bientôt disponible. Voici donc à quoi ressemblera votre carrousel une fois le tuto terminé:
Voici le fichier source:
Carroussel.fla
Voici le code utilisé:
- Code:
var rotX:Number = 120;
var rotY:Number;
var Centre:Number = Stage.height/2;
var vitesse:Number = 0.4;
var sceneW:Number = Stage.width;
var sceneH:Number = Stage.height;
var nbI:Number = 10;
var angle:Number = 1;
var i:Number;
for(i=0;i<nbI;i++)
{
//_____________________○○○---lier les clips à la scéne____
this.attachMovie('Icone'+i,'Ic'+i,i);
//_____________________○○○---clic sur les images____
this['Ic'+i].onRelease=function(){
trace (this);
}
//_____________________○○○---positionnement des clips au centre de la scéne____
this['Ic'+i]._y = sceneH /2;
}
//_____________________○○○---rotation des clips____
onEnterFrame=function(){
//_____________________○○○---Rayon de rotation de l'axe y (en pixels)
rotY = ( Centre - this._ymouse );
if (rotY <= -5) {
rotY = -5;
}
else if (rotY >= 70) {
rotY = 70;
}
//_____○○○---remise a zero de l'angle aprés tour complet
if (angle > (2*Math.PI))
{
angle = 0;
}else{
for(i=0; i<nbI; i++){
//_____________________○○○---rotation des clips sur l'axe x
this['Ic'+i]._x = rotX*Math.cos(angle+2*Math.PI*i/nbI)+sceneW/2;
//_____________________○○○---angle des clips sur l'axe y
this['Ic'+i]._y = rotY*Math.sin(angle+2*Math.PI*i/nbI)+sceneH/2;
//_____________________○○○---mise a jour de la taille du clip (60%->premier plan, 40%->arriere plan)
this['Ic'+i]._xscale=60/2*(Math.sin(angle+2*Math.PI*i/nbI)+ 1)+50;
this['Ic'+i]._yscale=this['Ic'+i]._xscale;
//_____________________○○○---gestion de la profondeur (en pixels);
this['Ic'+i].swapDepths(rotX*Math.sin(angle+2*Math.PI*i/nbI));
}
//_____________________○○○---Gestion de la rotation en fonction de la souris(x)
if(this._xmouse < (sceneW/2+rotX+120) && this._xmouse > (sceneW/2-rotX-120))
{
//_____________________○○○---Gestion de la rotation en fonction de la souris(y)
if(this._ymouse < sceneH && this._ymouse > 0)
{
//_____________________○○○---Gestion de la vitesse
angle=angle+(this._xmouse-sceneW/2)/sceneH*vitesse;
}
}
}
}
Le tutoriel:
Dernière édition par artkabis le Sam 22 Aoû - 20:49, édité 5 fois
