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.


    Un slideshow où galerie automatisé

    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)

    Un slideshow où galerie automatisé

    Message par artkabis le Mer 3 Juin - 18:28

    Bonjour à tous aujourd'hui je vous propose de créer un slideshow (une galerie automatisé) en as3, cette galerie utilise la classe Timer et charge les images grâce à un fichier xml. Le chargement est affiché directement dans l'interface et les images se placent automatiquement avec rotation.

    PS:Ce tutoriel est tiré du tutoriel "galerie automatique" proposé par moi-même sur weecast. Seul la gestion des commentaires, du nombre d'image et la mise en place d'un menu gérant la vitesse de défilement n'est pas présent dans ce tutoriel.

    Voici ce que vous obtiendrez à la fin de ce tutoriel:


    Le code:
    Code:
    package fr.galerie
    {
       //import
       import flash.display.MovieClip;
       import flash.display.Loader;
       
       import flash.net.URLLoader;
       import flash.net.URLRequest;
       
       import flash.utils.Timer;
       
       import flash.events.Event;
       import flash.events.ProgressEvent;
       import flash.events.TimerEvent;
       
       import gs.TweenMax;
       import gs.easing.Cubic;
       
       //classe de document
       public class SlideShow extends MovieClip
       {
          //vars & const
          private const TEMPS_A                      :int  = 1
          private var contActuel                      :MovieClip;
          private var imageActuelle                  :int = -1;
          private var nbImages                        :int;
          private var timerGalerie                    :Timer;
          public const attente                        :Number = 3000;
          private var conteneur1                      :MovieClip;
          private var conteneur2                      :MovieClip;
          private var loaderGalerie                  :Loader;
          private var urlXML                          :String = "XML/galerie.xml";
          private var xmlLoader                      :URLLoader;
          private var xml                            :XML;
          
          //constructeur
          public function SlideShow():void
          {
             xmlLoader = new URLLoader();
             xmlLoader.addEventListener(Event.COMPLETE, chargementCompletXML);
             xmlLoader.load( new URLRequest( urlXML ) );
             timerGalerie = new Timer ( attente );
             timerGalerie.addEventListener(TimerEvent.TIMER, navigationImages);
             
             conteneur1 = new MovieClip();
             conteneur2 = new MovieClip();
             conteneurImages.addChild( conteneur1 );
             conteneurImages.addChild( conteneur2 );
             
             contActuel = conteneur2;
          }
          
          private function chargementCompletXML (e:Event):void
          {
             xml = new XML( e.target.data );
             nbImages = xml.image.length();
             navigationImages(null);
          }
          private function navigationImages(e:Event):void
          {
             if(timerGalerie.running)timerGalerie.stop();
             if (imageActuelle + 1 < nbImages)imageActuelle++;
             else imageActuelle = 0;
             
             if (contActuel == conteneur2) contActuel = conteneur1;
             else contActuel = conteneur2;
             
             contActuel.alpha = 0;
             contActuel.scaleX = contActuel.scaleY = -1;
             conteneurImages.swapChildren(conteneur2, conteneur1);
             loaderGalerie = new Loader( );
             loaderGalerie.contentLoaderInfo.addEventListener(Event.COMPLETE, chargeCompletImage);
             loaderGalerie.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, chargementImage);
             loaderGalerie.load(new URLRequest( xml.image[imageActuelle].@adresse ));
          }
          private function chargementImage(pe:ProgressEvent):void
          {
             info.texte_chargement.text = Math.round(pe.bytesLoaded * 100 / pe.bytesTotal ) + "%";
          }
          private function chargeCompletImage (e:Event):void
          {
             contActuel.addChild(loaderGalerie.content);
             info.texte_chargement.text = "100%";
             TweenMax.to(contActuel,TEMPS_A,{alpha:1,scaleX:1,scaleY:1,rotation:360,ease:Cubic.easeOut,onComplete:timerGalerie.start()})
          }
       }
    }

    Le tutoriel:
    TUTO_SLIDESHOW


    Dernière édition par artkabis le Dim 4 Avr - 9:31, é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: Un slideshow où galerie automatisé

    Message par artkabis le Jeu 4 Juin - 6:20

    Le tuto est arrivé, enjoy !!!!


    _________________
    J'me fais de la pub et na tongue

    krysh nar
    Flasheur

    Messages : : 595
    Age : : 32
    Logiciels : Logiciels : : PHPStorm, CS5, CS4, Flash (niveau expert), notepad++, Visual Studio, 3DSMAX (la base), Solid Works, Lotus Notes, ...
    Date d'inscription : 14/05/2009

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

    Re: Un slideshow où galerie automatisé

    Message par krysh nar le Jeu 4 Juin - 14:25

    plustot pas mal

    mais tu devrai charger les images apres avoir afficher l'image précedente, puis apres un timer, si l'image est charger tu l'affiche

    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: Un slideshow où galerie automatisé

    Message par artkabis le Jeu 4 Juin - 16:29

    Et si tu fais ça, comment veux-tu que t'es images se croisent, c'est là qu"est l'effet justement. Razz

    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: Un slideshow où galerie automatisé

    Message par artkabis le Jeu 4 Juin - 16:32

    Donc deux images se fondent, alors il est évident qu'il devient indispensable de les charger aux même moment et comme ceux ne sont que deux images à la fois, les ressources ne sont à aucun moment surchargés


    _________________
    J'me fais de la pub et na tongue

    krysh nar
    Flasheur

    Messages : : 595
    Age : : 32
    Logiciels : Logiciels : : PHPStorm, CS5, CS4, Flash (niveau expert), notepad++, Visual Studio, 3DSMAX (la base), Solid Works, Lotus Notes, ...
    Date d'inscription : 14/05/2009

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

    Re: Un slideshow où galerie automatisé

    Message par krysh nar le Ven 5 Juin - 7:49

    dison que moi, la ou je suis avec le debit que j'ai, j'ai une image toutes les 10 secondes environs

    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: Un slideshow où galerie automatisé

    Message par artkabis le Ven 5 Juin - 10:55

    Et le rapport avec le chargement d'image une à une il est où, car même à 10 seconde par image, il te faudra toujours les charger deux par deux, sinon tu te retrouves avec un simple timer qui t'affiche une image toute les 10 secondes et non un slideShow qui te permet de fondre les images entre elles...


    _________________
    J'me fais de la pub et na tongue

    Angel Master
    Ceinture blanche
    Ceinture blanche

    Messages : : 87
    Age : : 39
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 18/03/2010

    Re: Un slideshow où galerie automatisé

    Message par Angel Master le Dim 4 Avr - 9:01

    Bonjour

    le lien du tuto est mort , possible de l'avoir Maitre Artkabis ?
    Merci^^

    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: Un slideshow où galerie automatisé

    Message par artkabis le Dim 4 Avr - 9:57

    Tuto remis en place.


    Sachez qu'il est possible que d'autres formations est leurs liens corrompus, en effet nous avions un serveur payant il y à quelques temps, mais faute de moyens à l'époque (et un petit soucis avec la personne qui le gérait) , nous avons perdu l'ensemble des données et le serveur fut fermé. Donc si vous rencontrez d'autres liens morts, n"hésitez pas à nous le faire savoir


    _________________
    J'me fais de la pub et na tongue

    Angel Master
    Ceinture blanche
    Ceinture blanche

    Messages : : 87
    Age : : 39
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 18/03/2010

    Re: Un slideshow où galerie automatisé

    Message par Angel Master le Dim 4 Avr - 10:04

    super Merci , jai d'autres questions d'amateur a te poser je le ferais ds la partie adéquate ...
    super tuto encore , a force de te le dire ça doit etre chiant ^^

    Cristal.1&2
    Ceinture blanche
    Ceinture blanche

    Messages : : 69
    Age : : 26
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 18/02/2010

    Re: Un slideshow où galerie automatisé

    Message par Cristal.1&2 le Ven 16 Avr - 15:36

    Super tuto, merci Artkabis !!



    voila le lien, car je vois que les image ce charge pas Sad

    http://ns7.freeheberg.com/~cristal2//banniere/lecteurimage.swf

    billyblues
    Ceinture blanche
    Ceinture blanche

    Messages : : 105
    Age : : 45
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 11/04/2010

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

    Re: Un slideshow où galerie automatisé

    Message par billyblues le Ven 16 Avr - 19:46

    ça marche tres bien sur ton lien

    Cristal.1&2
    Ceinture blanche
    Ceinture blanche

    Messages : : 69
    Age : : 26
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 18/02/2010

    Re: Un slideshow où galerie automatisé

    Message par Cristal.1&2 le Sam 17 Avr - 5:25

    Oui, mais quand je le poste, sa marche pas Sad

    je comprend pas Sad

    bon, sa as changer



    http://ns7.freeheberg.com/~cristal2//banniere/lecteurimage2.swf

    Donc si jamais vous savez comme faire pour que sa marche en postant sur un le forum, sa serrai cool Wink

    merci d'avance ! Wink

    billyblues
    Ceinture blanche
    Ceinture blanche

    Messages : : 105
    Age : : 45
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 11/04/2010

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

    Re: Un slideshow où galerie automatisé

    Message par billyblues le Sam 17 Avr - 9:47

    l url de ton XML est dans le même répertoire que ton swf donc si tu post ton lien du swf ici il ne trouvera pas le xml donc tu as le choix, soit en mettant en iframe ,soit modifier le lien de ton XML en lien absolu (complet)

    Cristal.1&2
    Ceinture blanche
    Ceinture blanche

    Messages : : 69
    Age : : 26
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 18/02/2010

    Re: Un slideshow où galerie automatisé

    Message par Cristal.1&2 le Sam 17 Avr - 11:24

    J'ai essayer le Ifram, sa marche pas Sad

    Et j'y connait rien en XML Sad

    Merci de ta réponse ! Wink

    Demeter
    Ancien staff

    Messages : : 4569
    Age : : 45
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Logiciel Adobe Photoshop, flash, dreamweaver, the gimp, blender 3D, visual studio 2010, expression studio 4, Aptana studio 1.5, Illustrator, indesign.

    Date d'inscription : 14/07/2009

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

    Re: Un slideshow où galerie automatisé

    Message par Demeter le Sam 17 Avr - 15:06

    Ca c'est une très très jolie réalisation cristal mes félicitations.

    Cristal.1&2
    Ceinture blanche
    Ceinture blanche

    Messages : : 69
    Age : : 26
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 18/02/2010

    Re: Un slideshow où galerie automatisé

    Message par Cristal.1&2 le Sam 17 Avr - 15:07

    Merci a toi Demeter !! Wink

    Tekken
    Administrateur

    Messages : : 2076
    Age : : 38
    Logiciels : Logiciels : : Suite CS6
    Date d'inscription : 02/01/2010

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

    Re: Un slideshow où galerie automatisé

    Message par Tekken le Lun 31 Mai - 20:07

    j'ai réussis à créé le slideshow, mais j'aimerais pouvoir insérer un commentaire sur les images en plus dans le fichier xml, j'ai fais plein de test mais je ne sais pas comment faire, quelqu'un pourrait il m'aider ?


    _________________

    Mon Site Creation



    Tekken
    Administrateur

    Messages : : 2076
    Age : : 38
    Logiciels : Logiciels : : Suite CS6
    Date d'inscription : 02/01/2010

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

    Re: Un slideshow où galerie automatisé

    Message par Tekken le Ven 11 Juin - 18:30

    j'ai réussis à trouver la solution de la question du post précédent, réponse : http://www.artkabis.net/besoin-d-aide-f111/ajouter-commentaire-dans-galerie-geree-par-xml-t4068.htm

    mais maintenant j'ai une autre question, est il possible de rajouter un bouton pause/play pour mettre une image en pause ?


    Spoiler:
    voir le résultat : http://creationtekken.gofreeserve.com/mesgaleriesflash.php


    _________________

    Mon Site Creation



    Contenu sponsorisé

    Re: Un slideshow où galerie automatisé

    Message par Contenu sponsorisé Aujourd'hui à 17:22


      La date/heure actuelle est Ven 9 Déc - 17:22