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.


    Menu glow avec scroll automatique

    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)

    Menu glow avec scroll automatique

    Message par artkabis le Mer 25 Fév - 16:52

    Salut les loulous, bon comme j'ai beaucoup moins de temps en ce moment, il est devenu rare de voir de nouveaux tutoriel, pour casser un peu cette dynamique, me voici aujourd'hui avec deux nouveaux tutos (et pas de moindre!!!), pour ce second tutoriel, j'ai décidé de vous apprendre à créer un menu avec autoScroll utilisant les Tweens de notre fameuse classe TweenMax.

    Pour résumer, nous aurons à la fin de ce tutoriel, un menu glow plutôt joli et avec pas mal de fonctionnalités.

    Voici à quoi vous devriez arriver:


    Voili voilou en tout cas j'espère que le résultat vous plaira, car j'ai passé pas mal de temps à développer cette petite connerie.

    Le tutoriel:


    Dernière édition par artkabis le Ven 27 Fév - 19:34, édité 1 fois

    JEYJEY
    Ceinture blanche
    Ceinture blanche

    Messages : : 100
    Age : : 24
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 22/02/2009

    Re: Menu glow avec scroll automatique

    Message par JEYJEY le Mer 25 Fév - 16:57

    loool ta passer du temps pour rien c'est tout simplement magnifique very good smile

    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: Menu glow avec scroll automatique

    Message par artkabis le Mer 25 Fév - 17:22

    Alors je sais pas si j'ai tout compris:
    ta passer du temps pour rien

    mais comme tu dis:
    c'est tout simplement magnifique very good
    alors je pense que c'est un compliment, en tout cas j'espère vraiment que le tuto vous plaira


    _________________
    J'me fais de la pub et na tongue

    AlanAdk
    Ceinture jaune
    Ceinture jaune

    Messages : : 280
    Age : : 40
    Logiciels : Logiciels : : Flash, Illustrator, Photoshop, Indesign
    Date d'inscription : 16/02/2009

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

    Re: Menu glow avec scroll automatique

    Message par AlanAdk le Mer 25 Fév - 21:03

    Ah bah moi qui voulais apprendre les class Tween ca tombe bien Smile

    D'ailleurs question peut-etre bete mais est-ce que les class Tween son t seulement en AS3 ?

    En tout cas je suivrais avec attention .

    Merci prof !

    AlanAdk
    Ceinture jaune
    Ceinture jaune

    Messages : : 280
    Age : : 40
    Logiciels : Logiciels : : Flash, Illustrator, Photoshop, Indesign
    Date d'inscription : 16/02/2009

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

    Re: Menu glow avec scroll automatique

    Message par AlanAdk le Mer 25 Fév - 21:09

    OK AS2 et 3 je viens de voir le post Smile C'est vrai que ca dechire ca , j'aurais due m'y mettre plus tot.

    Lilwarre A.K.A. Prod
    Ceinture verte
    Ceinture verte

    Messages : : 631
    Age : : 26
    Logiciels : Logiciels : : Adobe Master Collection CS4!
    Date d'inscription : 31/12/2008

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

    Re: Menu glow avec scroll automatique

    Message par Lilwarre A.K.A. Prod le Jeu 26 Fév - 8:29

    Oui moi je pense que JeyJey ta dis est un compliment Smile je sens que ce menu glow avec scroll va être marrent .
    {validation du tutoriel Arrivé !} Enjoy Smile


    Dernière édition par Lilwarre A.K.A. Prod le Lun 16 Mar - 15:26, é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: Menu glow avec scroll automatique

    Message par artkabis le Ven 27 Fév - 19:34

    Le tuuto est arrivé !!!!


    _________________
    J'me fais de la pub et na tongue

    Lilwarre A.K.A. Prod
    Ceinture verte
    Ceinture verte

    Messages : : 631
    Age : : 26
    Logiciels : Logiciels : : Adobe Master Collection CS4!
    Date d'inscription : 31/12/2008

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

    Re: Menu glow avec scroll automatique

    Message par Lilwarre A.K.A. Prod le Ven 27 Fév - 21:18

    Génial merci mec Smile.

    Pumbostar
    Nouveau membre
    Nouveau membre

    Messages : : 14
    Age : : 27
    Logiciels : Logiciels : : Photoshop, Illustrator, Flash, After Effect, Blender
    Date d'inscription : 01/03/2009

    Re: Menu glow avec scroll automatique

    Message par Pumbostar le Lun 16 Mar - 13:14

    Yop yop tout le monde!

    Voila j'ai besoin de votre aide!

    J'ai essayé de récuprer le code du menu, pour avoir uniquement l'autoscroll.

    Je m'explique!



    En violet mon masque.
    En rouge les boutons, tous différents.

    Le but est d'avoir un menu avec boutons, masqué pour ceux étant hors masque, et avec un scoll automatique, exactement comme dans le tuto.

    Mais je suis bloqué, car dans le tuto, il y a 1 seul bouton, modifié via la variable "bouton", alors que moi, chaque bouton est différents.

    Merci de vos coup de main!

    Figolu94
    Ceinture blanche
    Ceinture blanche

    Messages : : 67
    Age : : 28
    Logiciels : Logiciels : : Adobe Flash CS4
    Date d'inscription : 13/01/2009

    TypeError: Error #1006: value n'est pas une fonction :(

    Message par Figolu94 le Jeu 9 Juil - 13:16

    Salut à tous,

    Suite à ce tuto, j'ai un soucis qui reste et que je n'arrive pas à élucider...
    Quand je compile j'ai cette erreur qui survient:
    Code:
    TypeError: Error #1006: value n'est pas une fonction.
        at menud_fla::MainTimeline/frame1()

    Je ne sais pas comment la résoudre, j'ai cherché sur le net mais sans succès...

    Merci d'avance

    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: Menu glow avec scroll automatique

    Message par artkabis le Jeu 9 Juil - 17:54

    Pour Pumbostar:

    Hélas, ce tutoriel est à la base prévu pour un menu optimisé avec un seul bouton répété plusieurs fois. Toi tu souhaites faire quelque chose de complètement différent, même si au premier abord ceci n'est pas forcement visible, mais entre ce que tu veux faire et ce qui est présenté dans le tuto, ceci est diamétralement opposé (au point de vu développement). Donc pour ton projet, il faudrait un tutoriel différent de celui-ci.

    Pour Figolu94:
    Tu as forcement une erreur dans ton code, si tu regardes bien il doit avoir quelques différences entre ton code et le mien, non?


    Dernière édition par artkabis le Sam 29 Aoû - 20:21, édité 1 fois


    _________________
    J'me fais de la pub et na tongue

    Figolu94
    Ceinture blanche
    Ceinture blanche

    Messages : : 67
    Age : : 28
    Logiciels : Logiciels : : Adobe Flash CS4
    Date d'inscription : 13/01/2009

    Re: Menu glow avec scroll automatique

    Message par Figolu94 le Ven 10 Juil - 6:08

    Pour Pumbostar,

    Je pense qu'il est possible de faire ce que tu veux en passant par le XML, tu stock tes données sous des balises de la forme ,,,etc et tu mets ça dans la boucle for avec bouton_i (avec le i qui est incrémenté). Comme ça tu afficheras les données qui sont entre tes balises respectives.

    Je vais regarder pour ma part si je n'ai pas des erreurs dans mon code :s

    Figolu94
    Ceinture blanche
    Ceinture blanche

    Messages : : 67
    Age : : 28
    Logiciels : Logiciels : : Adobe Flash CS4
    Date d'inscription : 13/01/2009

    Re: Menu glow avec scroll automatique

    Message par Figolu94 le Mer 15 Juil - 9:38

    Bonjour Artkabis,

    J'ai checké mon code, et je ne vois aucune erreur par rapport au tien...
    Sur la doc flash l'erreur 1006 veut dire "_ n’est pas une fonction", "Cette erreur se produit lorsque vous tentez d'appeler une fonction qui n'existe pas."
    J'ai uploadé mon fichier pour voir si toi ou quelqu'un d'autre trouverais mon soucis. Ça serait super cool.

    http://www.megaupload.com/?d=FNI0PEM9

    Merci d'avance à tous Wink

    Figolu94
    Ceinture blanche
    Ceinture blanche

    Messages : : 67
    Age : : 28
    Logiciels : Logiciels : : Adobe Flash CS4
    Date d'inscription : 13/01/2009

    Re: Menu glow avec scroll automatique

    Message par Figolu94 le Ven 17 Juil - 10:11

    Et un ptit Up, un! ^^

    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: Menu glow avec scroll automatique

    Message par artkabis le Ven 17 Juil - 19:30

    Salut alors dès que j'ai un peu de temps, je regarderais si je trouve d'où vient ton erreur, normalement demain ça sera ok....


    _________________
    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: Menu glow avec scroll automatique

    Message par artkabis le Sam 18 Juil - 8:29

    Alors tu as oublié de mettre un '+' à cette ligne:
    Code:
    bouton.titre.text = "Bouton N°"(i+1).toString();

    Ce qui donne avec la ligne corrigé:
    Code:
    bouton.titre.text = "Bouton N°" + (i+1).toString();


    _________________
    J'me fais de la pub et na tongue

    Figolu94
    Ceinture blanche
    Ceinture blanche

    Messages : : 67
    Age : : 28
    Logiciels : Logiciels : : Adobe Flash CS4
    Date d'inscription : 13/01/2009

    Re: Menu glow avec scroll automatique

    Message par Figolu94 le Lun 20 Juil - 8:53

    Super Merci Artkabis ^^

    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: Menu glow avec scroll automatique

    Message par artkabis le Lun 20 Juil - 10:50

    Pas de quoi, tu vois il y avait bien une différence, il faut prendre le temps de bien regarder, car bien souvent l'erreur vient d'un oublie


    _________________
    J'me fais de la pub et na tongue

    Figolu94
    Ceinture blanche
    Ceinture blanche

    Messages : : 67
    Age : : 28
    Logiciels : Logiciels : : Adobe Flash CS4
    Date d'inscription : 13/01/2009

    Re: Menu glow avec scroll automatique

    Message par Figolu94 le Lun 20 Juil - 13:30

    Amen ^^

    toutclic
    Ceinture blanche
    Ceinture blanche

    Messages : : 168
    Age : : 26
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 30/05/2009

    Re: Menu glow avec scroll automatique

    Message par toutclic le Sam 29 Aoû - 16:58

    Serait il possible de le faire mais en prenant l'axe X pour le scrolling ?

    Plumaillon
    Ceinture jaune
    Ceinture jaune

    Messages : : 274
    Age : : 28
    Date d'inscription : 28/03/2009

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

    Re: Menu glow avec scroll automatique

    Message par Plumaillon le Ven 30 Oct - 16:13

    Super!
    Je viens d'effacer un message avec un menu glow dynamique qui buguait pour remplacer par un qui fonctionne (misérable code j'avais oublié un "-", et j'ai trouvé la solution toute seule sans même regarder le tuto ;p).
    Merci beaucoup pour tes supers tutos.
    Quand on arrive à reproduire une de tes créations on se sent plus fort lol!
    Et je m'imagine le travail que tu as du mettre pour trouver ça *chapeau*



    Edit:
    Pour touclic: un grand OUI et en image^^:



    il te suffit d'inverser toutes les informations verticales et horizontales (ainsi que les dimensions bien entendu)

    Pour le contenu des textes j'ai utilisé une police "symbole", en stipulant --> (i+1) <-- à la place de
    --> "bouton " (i+1) <--
    Je n'ai pas trouvé comment mettre un mot différent par bouton (vu mon niveau xD) mais si je devais le faire, j'utiliserais un logiciel de création de fonte en dessinant à la place du caractère "1": "menu" / "2":"blabla" / "3":"etc"

    2eme Edit:
    Après avoir mis mon menu sur l'ordi de mon chéri, je me suis apreçu que me super typo symbole était devenue une typo normale.... et puis, étant une grande frappadingue de typographie, j'en ai 1300 dans la boite, ce qui n'est pas le cas de tout le monde.....(d'autant que leur seule utilité est de me faire m'exctasier devant mon livre des polices (cf mac)), nos moutons:

    est-il possible de modifier le texte dynamique, afin d'avoir un mot différent à chaque occurence créé? l'option "array" est elle possible?

    deuxième question:.... je me souviens plus j'édite dès que c'est là ;p

    troisième Edit: xD

    dans ce tutoriel tu remplaces ce qui devrait être des boutons par des clips..(en leur donnant le nom bouton..)
    Dans ce cas, à quoi servent les boutons? Puisque un clip peut avoir exactement les mêmes conditions en y incluant du code, et même beaucoup plus, car on peut l'animer directement..

    maxlamenace
    Ceinture blanche
    Ceinture blanche

    Messages : : 53
    Age : : 32
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 19/11/2009

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

    Re: Menu glow avec scroll automatique

    Message par maxlamenace le Sam 16 Jan - 18:07

    super tuto , merci Arkabis.



    seaman130092
    Ceinture blanche
    Ceinture blanche

    Messages : : 56
    Age : : 33
    Logiciels : Logiciels : : J'utilise FLASH CS 4 en AS 2 et PHOTOSHOP CS4
    Date d'inscription : 24/02/2010

    Re: Menu glow avec scroll automatique

    Message par seaman130092 le Jeu 4 Mar - 17:45

    Alors j'ai fais le tuto mais j'ai des gros soucis... j'ai 15 erreurs... pourtant il me semble que je me suis pas trompé dans le code !
    et rien ne fonctionne au final ! quelqu'un peut il m'aider ?? merci Smile
    je laisse mon code sur le forum pour que quelqu'un le vérifie :p
    Code:
    import com.greensock.TweenMax;
    import com.greensock.plugins.*
    Tweenplugin.activate([AutoAlphaPlugin,TintPlugin);
                                                   
                                                   
    const NBBT:uint = 20;
    var HauteurMask = monMask.height;
    var menu:MovieClip = new MovieClip();
    var i:int;
    menu.x = monMask.x;
    menu.y = monMask.y;
    addChild ( menu );

    var dessus:Boolean = false;
    var menuY = menu.y;
    menu.mask = monMask;

    for (i=0;i<NBBT; i++){
        var bouton:Bouton = new Bouton();
        bouton.x = 0;
        bouton.y = i* bouton.height;
        bouton.titre.text = "Bouton N°"+(i+1).toString();
        bouton.mouseChildren = false;
        bouton.buttonMode = true;
        bouton.addEventListener("mouseOver",mouseOverBt);
        bouton.addEventListener("mouseOut",mouseOutBt);
        menu.addChild ( bouton );
    }
    var reflet:Reflet = new Reflet();
    reflet.x = monMask.x;
    reflet.y = monMask.y;
    addChild ( reflet );
    reflet.mouseEnabled = false;

    var hauteurMenu:Number = menu.height;
    menu.addEventListener("mouseOver",mouseOverMenu);
    menu.addEventListener("mouseOut",mouseOutMenu);
    addEventListener("enterFrame",enterframe);

    function mouseOverMenu (pEvt:MouseEvent):void{
        dessus = true;
    }
    function mouseOutMenu (pEvt:MouseEvent):void{
        dessus = false;
    }
    function mouseOverBt (pEvt:MouseEvent):void{
        var bt:Bouton = pEvt.target as Bouton;
        TweenMax.to(bt.bg,0.01,{tint:#F711E0});
    }
    function mouseOutBt (pEvt:MouseEvent):void{
        var bt:Bouton = pEvt.target as Bouton;
        TweenMax.to(bt.bg,0.05,{tint:##16222E});
    }
    function enterframe (pEvt:Event):void{
        if (dessus){
        var distance:Number = mouseY - monMask.y;
        var pct:Number = distance/HauteurMask;
        menuY = menu.y;
        var cibleY:Number = -(hauteurMenu - HauteurMask)* pct)+monMask.y;
    TweenMax.to(menu, 0.4,{y: Math.round(cibleY)});
        }
    }

    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: Menu glow avec scroll automatique

    Message par Demeter le Ven 5 Mar - 1:34

    Bonjour seaman130092 alors je pense que tu travail avec AS2 et que cela et de AS3 si je ne me trompe pas.

    seaman130092
    Ceinture blanche
    Ceinture blanche

    Messages : : 56
    Age : : 33
    Logiciels : Logiciels : : J'utilise FLASH CS 4 en AS 2 et PHOTOSHOP CS4
    Date d'inscription : 24/02/2010

    Re: Menu glow avec scroll automatique

    Message par seaman130092 le Ven 5 Mar - 9:07

    oui deme c de l'as 3, justement je m'y mets Wink je me demande si la classe tweenmax est bien installee Sad

    Contenu sponsorisé

    Re: Menu glow avec scroll automatique

    Message par Contenu sponsorisé Aujourd'hui à 8:00


      La date/heure actuelle est Dim 11 Déc - 8:00