Artkabis

Salut !!!
Si vous êtes membre du forum, vous pouvez vous connecter.
Au cas contraire vous avez la possibilité de créer gratuitement un compte...

Forum d'entraide en graphisme et webdesign. Formation pour Flash, Photoshop et les langages: as2, as3, html, php, javascript, etc.


    Des interpolations complexes grâce à la classe TransitionManager

    Partagez

    artkabis
    Fondateur
    Fondateur

    Messages : : 4545
    Age : : 32
    Logiciels : Logiciels : : Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription : 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Des interpolations complexes grâce à la classe TransitionManager

    Message par artkabis le Lun 27 Avr - 12:47

    Bonjour à tous, aujourd'hui je souhaitais vous parler d'une Classe plutôt sympa, puisqu'elle permet de créer des transitions plutôt complexes avec très peu de code, il faut savoir qu'il est tout à fait possible de créer des transitions sur des clips contenant par exemple des images, imaginez alors les possibilités, pour vous démonter la puissance de cette classe, voici deux exemples. Le premier utilise les dix types de transition possible et le second nous montre une transition sur une image:

    Exemple1: (passez sur les cubes)


    Exemple2:


    Le code (exemple1):
    Code:

    import fl.transitions.*;
    import fl.transitions.easing.*;
     
    var transitions:Array = new Array();

    //ecoute de chacun des cubes au rollOver
    cube1.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube2.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube3.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube4.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube5.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube6.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube7.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube8.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube9.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    cube10.addEventListener (MouseEvent.MOUSE_OVER, overCube);
     
    //Assignation des transitions pour chacun des cubes
    cube1.transition = Blinds;
    cube2.transition = Fade;
    cube3.transition = Fly;
    cube4.transition = Iris;
    cube5.transition = Photo;
    cube6.transition = Rotate;
    cube7.transition = Squeeze;
    cube8.transition = Wipe;
    cube9.transition = PixelDissolve;
    cube10.transition = Zoom;
     
    //fonction lié à l'enssemble des cubes au rollOver
    function overCube (e:Event):void {
     
       var cubeSelectionne:MovieClip = MovieClip(e.target);
     
       cubeSelectionne.removeEventListener (MouseEvent.MOUSE_OVER, overCube);
     
       var maTransitionManager:TransitionManager = new TransitionManager(cubeSelectionne);
       maTransitionManager.startTransition ({type:cubeSelectionne.transition,
        direction:Transition.IN, duration:1.5, easing:Regular.easeOut, shape:Iris.SQUARE});
     
       //ajout des transition dans un tableau
       transitions.push(maTransitionManager);
     
       //création d'un écouteur pour lmiter la relecture pendant la Transition
       maTransitionManager.addEventListener ("allTransitionsInDone", animationComplete);
     
    }
     
    //fonction uniquement joué si la transition du cube est terminé
    function animationComplete (e:Event):void {
     
       //Remise en place de la fonction over pour l'objet avec transition terminé
       e.target.content.addEventListener (MouseEvent.MOUSE_OVER, overCube);
    }

    Le code (exemple2):
    Code:

    import fl.transitions.*
    import fl.transitions.easing.*;
    /*-----------------------------TransitionManager:: Type--------------------------------
                            Blinds   >>   Rotate
                            Fade   >>   Squeeze
                            Fly      >>   Wipe
                            Iris   >>   PixelDissolve
                            Photo   >>   Zoom
    --------------------------------------------------------------------------------------*/
    img.addEventListener("mouseOver", over);

    function over (e:MouseEvent):void{
       img.removeEventListener("mouseOver", over);
       var maTransitionManager:TransitionManager = new TransitionManager (img);
       maTransitionManager.startTransition({type:PixelDissolve, direction:Transition.IN,
       duration:2, ease:Regular.easeIn,shap:Iris.SQUARE});
       maTransitionManager.addEventListener("allTransitionsInDone",transitionComplete);
    }
    function transitionComplete (e:Event):void{
       img.addEventListener("mouseOver", over);
    }

    Le tutoriel:


    Dernière édition par artkabis le Lun 25 Mai - 10:01, édité 1 fois

    artkabis
    Fondateur
    Fondateur

    Messages : : 4545
    Age : : 32
    Logiciels : Logiciels : : Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription : 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Re: Des interpolations complexes grâce à la classe TransitionManager

    Message par artkabis le Mar 28 Avr - 9:23

    Le tuto est arrivé !!!!!


    _________________
    J'me fais de la pub et na tongue

    artkabis
    Fondateur
    Fondateur

    Messages : : 4545
    Age : : 32
    Logiciels : Logiciels : : Photoshop CS4, Flash CS4, Indesign CS4, After Effects CS4, Illustrator CS4, Premier Pro CS4, Encore CS4, Flexbuilder 3, Papervision 3D, Camtasia, Captivate, InDesign, Swift 3d, Illustrator, Dreamweaver CS3, Blender, Swift 3D, WampServer.
    Date d'inscription : 11/09/2008

    Capacités en graphisme
    Capacité graph:
    9/10  (9/10)

    Re: Des interpolations complexes grâce à la classe TransitionManager

    Message par artkabis le Dim 31 Mai - 3:25

    J'ai remis le code à jour, car il y avait quelques petites choses qui n'allaient pas...


    _________________
    J'me fais de la pub et na tongue

    claxie2001
    Nouveau membre
    Nouveau membre

    Messages : : 26
    Age : : 34
    Logiciels : Logiciels : : J'utilise essentiellement les logiciels : photoshop, illustrator, indesign, flash, dreamweaver.
    Cependant, par le passé j'ai pas mal touché à la vidéo : première, combustion, elastic reality, cooledit (depuis racheté par adobe).
    Et ai vécu une grande immersion dans second life (de près d'un an), où j'ai eu l'occasion de builder et d'apprendre (modestement) le script lsl.
    Je souhaite me spécialiser en développement flash, après une pratique de l'as2, je cherche à apprendre l'as3, et l'approche de la POO.
    Date d'inscription : 23/02/2010

    Capacités en graphisme
    Capacité graph:
    0/0  (0/0)

    Re: Des interpolations complexes grâce à la classe TransitionManager

    Message par claxie2001 le Mar 4 Mai - 9:58

    Bonjour,

    En faisant ce tuto, j'essaye de faire la chose suivante :

    Dans une classe, j'ai crée un ensemble de clips contenant des images
    comme ceci :
    Code:
    for(var i:Number=0; i<82; i++)
                {
                    loader=new Loader();
                    cont=new URLRequest("photo_net/pet"+i+".jpg");
                    loader.load(cont);
                    Img=new MovieClip();
                    Img.addChild(loader);
                    addChild(Img);
                    Img.name='ID'+i;
                }

    Je souhaiterai ensuite faire apparaitre de manière aléatoire les images
    avec transition manager :
    Code:
    private function suite(e:TimerEvent)
            {
                var j:int = Math.round(Math.random()*81);
               
                var maTransitionManager:TransitionManager = new
    TransitionManager (getChildByName('ID'+j));
                  maTransitionManager.startTransition({type:PixelDissolve,
    direction:Transition.IN, duration:2,
    ease:Regular.easeIn,shap:Iris.SQUARE});

    Mais j'ai un gros problème : getChildByName, renvoit un DisplayObject,
    alors que TransitionManager ne gère que les MovieClip...

    J'essaye de bidouiller dans tous les sens, mais n'arrive à rien.
    N'aurez vous pas une idée pour sortir de cette impasse ?

    C.

    Contenu sponsorisé

    Re: Des interpolations complexes grâce à la classe TransitionManager

    Message par Contenu sponsorisé Aujourd'hui à 23:50


      La date/heure actuelle est Sam 3 Déc - 23:50