[Aide] Flash carrousel AVEC rotation par controle de bouton

Bonjour bonjour,

Voilà j'ai récupéré ces 2 codes-ci :
http://www.flashkod.com/codes/CARROUSEL-VRAI-3D-SOUS-CS4_48562.aspx
http://www.flashkod.com/codes/MENU-CARROUSSEL-3D_46489.aspx

Et en fait je voudrais reproduire l'effet comme sur ce prochain site :
http://www.one.com/fr/  (en haut du contenu)

Comme vous pouvez le constater, il y a un effet de flou de direction et une bonne dynamique pour une impression de vitesse.
Ce qui compte surtout pour moi aussi est le contrôle par bouton gauche droite pour faire les rotations (et pas avec les simples mouvements de souris).


Voilà merci d'avance pour votre aide.

salut
et c'est quoi la question ??
tu bloques sur quel point precis ??
tu en es ou avec ton code ??
on peut voir ??
a+

Bonsoir,

Déjà flash ne peut pas gérer le bouton de droite en Natif (hors AIR), ensuite tu as tout ce qu'il te faut pour faire cet Effet, si ce n'est l'ajout du filtre Blur (dont je doute de la réelle utilisation dans ton exemple) qui est trés simple à faire ...

Quel est effectivement le problème ?

Peg'

Bonjour et désolé pour la mauvaise formulation.

Je vai essayer de faire au plus simple.

 Voici le code (en AS2) que je voudrais modifier :

//Rayon de rotation (en pixels) autour de l'axe y
var Rx:Number=120;

//Nombre d'icones (pas plus que 10, quoique...)
var N:Number=10;

//Attachement des icones
var i:Number;
for(i=0;i<N;i++)
{
    //Attache le ieme clip a la scene
    _root.attachMovie('MonClip'+i,'ID'+i,i);
   
    //click
    _root['ID'+i].onPress=function(){trace('salut');}

   
    //position initial du ieme clip en y (milieu de scene)
    _root['ID'+i]._y=80/2;
   
}

//rotation des clips
 var angle:Number=0;
_root.onEnterFrame=function(){
     
     //si l'angle a fait un tour alors remise a zero de l'angle
     if (angle>2*Math.PI)
     {
         angle=0;
     }
     else
     {             
         for(i=0;i<N;i++)
         {

            //rotation du i_eme clip sur x
            _root['ID'+i]._x=Rx*Math.cos(angle+2*Math.PI*i/N)+480/2;

            //mise a jour de la taille du clip (60%->premier plan, 40%->arriere plan)
            _root['ID'+i]._xscale=60/2*(Math.sin(angle+2*Math.PI*i/N)+ 1)+40;
            _root['ID'+i]._yscale=_root['ID'+i]._xscale;
   
            //mise a jour de z (profondeur en pixels);
            _root['ID'+i].swapDepths(Rx*Math.sin(angle+2*Math.PI*i/N));
         }
       
        //rotation normale sans souris
        //0.1 correspond a la vitesse (-0.1 selon le sens)
        //angle=angle+0.1;
       
        //rotation commandée par la position de la souris
        //conditions sur x
        if(_root._xmouse<(480/2+Rx) && _root._xmouse>(480/2-Rx))
        {
            //conditions sur y
            if(_root._ymouse<80 && _root._ymouse>0)
            {
                //0.7 correspond a la vitesse
                angle=angle+(_root._xmouse-480/2)/480*0.7;
            }
        }
   
     }
 }


Alors je comprend quasiment tout à part les calculs de mouvements (pas très fort en math avec les cossinus-sinus, ...)

Mon premier objectif à atteindre :
- créer deux boutons (une bouton flèche gauche et un bouton flèche droite)
- sur chaque bouton, appliquer une fonction 'onRelease' qui permet de faire une rotation des éléments dans le sens de chaque flèche
- modifier le calcul du mouvement pour donner un effet plus dynamique (accélération au départ et ralentissement à la fin)

Je pense que dans un premier temps, ce sera suffisant.

Avant de finir, voici un screen d'une maquette faites en photoshop sur ce que je voudrais appliquer.


Merci d'avance

Salut,

Pour l'effet de flou, Pegase31, a deja repondu a ton problème.

Par contre pour le contrôle du déplacement avec les boutons, c'est assez simple :
- tu n'as pas besoin de toucher au code de la rotation (cosinus, sinus)
- tu modifie juste le contrôle de la rotation en jouant sur la variable angle, qui est une variable d'incrementation. Donc tu supprime ça (c'est le code pour l'incrementation de angle) :
//rotation commandée par la position de la souris
        //conditions sur x
        if(_root._xmouse<(480/2+Rx) && _root._xmouse>(480/2-Rx))
        {
            //conditions sur y
            if(_root._ymouse<80 && _root._ymouse>0)
            {
                //0.7 correspond a la vitesse
                angle=angle+(_root._xmouse-480/2)/480*0.7;
            }
        }
Et tu le remplace par ton code d'acceleration/deceleration dans ton boutons. L'acceleration se traduisant par une incrementation plus rapide de la variable angle, la deceleration une incrementation plus lente. Et pour stopper le carrousel, ben ... angle+=0;

J'ai un peu chipoté mais je dois mal m'y prendre car quand je clique sur un bouton, ça fait une rotation (très bien jusque là) mais ça le fait par un seul petit 'accoup' donc sans animation (difficile à expliquer par écrit alors voici le lien vers mon fla ICI), je n'arrive pas du tout à faire "l'animation" de rotation... Je voudrais que ce soit fluide.

sinon voici le code pour les faignasses (mais c'est une toute autre scène que celle du tuto).

Un autre petit objectif que j'ai essayé de faire, mais en vain, est de disposé la première vignette en face de la caméra lors de l'ouverture du swf.


//Rayon de rotation (en pixels) autour de l'axe y
var Rx:Number=300;

//Nombre d'icones (pas plus que 10, quoique...)
var N:Number=5;

//Attachement des icones
var i:Number;
for(i=0;i<N;i++)
{
    //Attache le ieme clip a la scene
    _root.attachMovie('MonClip'+i,'ID'+i,i);
    
    //click
    /*_root['ID'+i].onPress=function(){
        trace('salut');
    }*/
    
    //position initial du ieme clip en y (milieu de scene)
    _root['ID'+i]._y=280/2;
    
}

//rotation des clips
 var angle:Number=0;
_root.onEnterFrame=function(){
    
     //si l'angle a fait un tour alors remise a zero de l'angle
     if (angle>2*Math.PI)
     {
         angle=0;
     }
     else
     {            
         for(i=0;i<N;i++)
         {
            //rotation du i_eme clip sur x
            _root['ID'+i]._x=Rx*Math.cos(angle+2*Math.PI*i/N)+900/2;

            //mise a jour de la taille du clip (60%->premier plan, 40%->arriere plan)
            _root['ID'+i]._xscale=60/2*(Math.sin(angle+2*Math.PI*i/N)+ 1)+40;
            _root['ID'+i]._yscale=_root['ID'+i]._xscale;
    
            //mise a jour de z (profondeur en pixels);
            _root['ID'+i].swapDepths(Rx*Math.sin(angle+2*Math.PI*i/N));
         }
        
        //rotation normale sans souris
        //0.1 correspond a la vitesse (-0.1 selon le sens)
        //angle=angle+0.01;
        
        //rotation commandée par la position de la souris
        //conditions sur x
        /*if(_root._xmouse<(900/2+Rx) && _root._xmouse>(900/2-Rx))
        {
            //conditions sur y
            if(_root._ymouse<280 && _root._ymouse>0)
            {
                //0.7 correspond a la vitesse
                angle=angle+(_root._xmouse-900/2)/900*0.7;
            }
        }*/
        
        
    
     }
 }
 
 //rotation commandée par le clic sur les boutons
_root.bouton_rotation_1.onRelease=function() {
    angle = angle+0.01;
}

_root.bouton_rotation_2.onRelease=function() {
    angle = angle-0.01;
}

Re, ben oui c'est normal que ca n'avance que "d'un petit coup" puisque tu as mis
_root.bouton_rotation_1.onRelease=function() {
    angle = angle+0.01;
}
le petit coup vaut exactement 0.01 radians.

Il faut que tu programme une loi d'acceleration et/ou de deceleration. C'est a dire que lorsque tu cliques sur le bouton. Ca provoque plusieurs fois l'incrementation et pas seulement une fois.
Pour le faire plusiseurs fois une seule solution : comme la fonction onenterframe est appellée a chaque affichage, il faut incrementer la variable sur plusieur appels successive de la fonction enterframe. Pour cela tu utilise une variable intermediaire ex Nombre_de_petit_coup=10. Puis dans le code du bouton: tant qu'il reste des petits coups a faire, avancer d'un petit coup, decrementer le Nombre_de_petit_coup.
Enfin, pour positioner le clips au bon endroit cad au milieu, il y a un nombre de coups exact a faire.

Pour le placement au debut (ton autre objectif), si tu avait pris le temps de regarder les autres codes que j'ai mis avec le menu carrousel 3D que tu a downloader, tu aurais vu qu'il y a la réponse.

Voila tu as tout pour t'en sortir.

Grems

bonjour,

ce petit problème m'intéresse aussi. Mais étant encore qu'un amateur je galère à mort sur la dernière partie de ton explication. Je voudrais reprendre le même principe du bouton (sauf que moi j'utilise onRollOver, mais là n'est pas le problème).
Sa serait sympa de poster une solution concrète au problème pour tous les "galériens de la vie" comme moi.^^

merci d'avance pour votre aide.

Salut,
poster une solution "concrète" (entendez plutot toute faite) me prendrais du temps que je n'ai pas et il me faudrait egalement une motivation que je n'ai pas non plus. Personne sur ce site n'est là pour reflechir à votre place...
En revanche, si toi tu poste une solution, une idée de solution, un debut de code ...enfin quelquechose qui montre que tu à reflechi et que tu n'est pas la juste à attendre que ça tombe tout cuit dans le bec, alors oui, je corrigerai volontier ce que tu propose, et je t'apporterai mon aide.
Encore une fois, on est pas la pour le faire a votre place, mais juste pour vous aiguiller dans votre demarche.

Salutations
Grems

re grems,

je ne voulais absolument pas te manquer de respect c'est juste que je galère à mort. je voudrais juste un peu d'aide et quelques conseils pour faire des boutons qui gère la rotation du carrousel qui marche avec onRollOver. j'ai essayé de reprendre l'idée du onPress mais j'ai quelque problème au niveau de la syntaxe. le système d'incrémentation est-il incontournable ou peut-on avoir une autre technique étant donner qu'avec onrollover on est pas obliger d'avoir une image qui s'arette pile poils au milieu de la scène.

j'ai un autre probleme que je ne comprend pas et qui vient surment aussi de mon probleme de syntaxe. j'ai sur l'image une de la scene principale le code qui créer le carrousel à partir de la biblioteque. quand je clique sur un clip du carrousel je vau que sa m'envoye sur l'image 2 ou un lecteur vidéo est présent. sa m'y envoi bien mais i reste toujours les clip du carrousel qui se balade devant mon lecteur vidéo. comment fait-on pour supprimer le carrousel de l'image 2?
j'ai essayé diverse combinaison avec attachMovie et delete ou false mais comme je disais i doit i avoir un probleme de syntaxe dans mon code.

si tu pouvais me filer un coup de main Grems sa serait simpa