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 glissière avec effet lumineux (intermédiaire)

    Partagez

    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: Menu glissière avec effet lumineux (intermédiaire)

    Message par claxie2001 le Dim 28 Fév - 12:17

    Bonjour,

    Un grand merci encore pour ce tuto excellent !

    En revanche, j'ai encore une tite question. J'essaye ce matin de bien comprendre la différence entre la programmation procédurale et orientée objet et j'essaye de repasser ce code dans une classe.
    j'ai appelé ma classe "Artkabis", rangé dans com/fr/artkabis/
    J'ai bien lié mon .fla à la classe Artkabis et bien sur viré le calque action présent dans le tuto.
    Seulement je n'arrive pas à faire quelque chose qui marche correctement. Je ne sais pas si j'ai un problème de logique ou si tout simplement il me manque des import flash dans mon package...

    Si quelqu'un peut m'aider, je lui en serai très reconnaissante !

    Voici le code de ma classe Artkabis :
    Code:
    package com.fr.artkabis
    {
        import com.greensock.TweenLite;
        import com.greensock.easing.*
        import com.fr.utils.Rollover;
        import flash.events.Event;
        import flash.events.IOErrorEvent;
        import flash.events.MouseEvent;
        import flash.text.TextField;
        import flash.text.TextFormat;
        import flash.text.TextFieldAutoSize;
       
        public class Artkabis extends MovieClip
        {
            private var style              :StyleSheet;
            private var heading            :Object;
            private var ombre              :DropShadowFilter;
            private var ombre2            :DropShadowFilter;
            private var body              :Object;
            private var pagActu            :int;
            private var m                  :MovieClip;
            private var page              :Page;
            private var boutons            :Array;
            private var btns              :MovieClip;
            private var nbP                :int;
            private var centreX            :int;
           
           
            public function Artkabis (params:Object):void
            {
                m = menu;
                centreX = stage.stageWidth/2;
                style = new StyleSheet();
                page = new Page();
                heading = new Object();
                body = new Object();
                ombre = new DropShadowFilter(0,45,0x00000,1,4,4,1,3);
                ombre2 = new DropShadowFilter(0,45,0x00000,1,20,20,1,3);
                boutons  = new Array(m.bt1,m.bt2,m.bt3,m.bt4,m.bt5,m.bt6,m.bt7,m.bt8);
                page.mouseChildren = false;
                heading.fontWeight = "bold";
                heading.font = 'Visitor TT2 BRK';
                heading.color = "#FF0000";
                body.fontStyle = "italic";
                style.setStyle(".heading", heading);
                style.setStyle(".body", body);
                page.filters = [ombre2];
                this.addChild(page);
                page.y = (stage.stageHeight+(stage.stageHeight/10))/2;
                TweenLite.to(page,.6,{x:centreX,ease:Back.easeOut});
                for (var i:uint=0; i<boutons.length; i++)
                {
                    btns = boutons[i];
                    var roll:Rollover = new Rollover({mc:btns,mChilds:true});
                    btns.titreBt.styleSheet = style;
                    btns.addEventListener('mouseUp',ouvrePage);
                    btns.titreBt.htmlText = "<body><font size='12'><span class='heading'>A</span>rt-k "+(i+1)+"</font></body>";
                }
                stage.addEventListener('mouseMove',detect);
            }

            private function detect(me:MouseEvent):void
            {
                if(mouseY>0 && mouseY<menu.height* 1.2)
                {
                    TweenLite.to(menu,.4,{y:0,ease:Sine.easeOut});
                    TweenLite.to(onglet,.4,{y:-onglet.height,ease:Sine.easeOut});
                }else
                {
                    TweenLite.to(menu,.4,{y:-menu.height,ease:Sine.easeOut});
                    TweenLite.to(onglet,.4,{y:0,ease:Sine.easeOut});
                }
            }
           
            private function ouvrePage(me:MouseEvent):void
            {
                m.mouseChildren = false;
                nbP = int(me.target.titreBt.text.substr(me.target.titreBt.text.length-2,me.target.titreBt.text.length))
                if(nbP != pagActu)TweenLite.to(page,1,{x:-page.width,ease:Back.easeOut,onComplete:function replace():void{
                    page.nbPage.text = String(nbP)
                    pagActu = nbP;
                    TweenLite.to(page,1,{x:centreX,ease:Back.easeOut,onComplete:function reactiv():void{m.mouseChildren = true}});
                }});
                else if (nbP === pagActu){
                    m.mouseChildren = true
                }
            }
        }
    }

    Claxie

    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 glissière avec effet lumineux (intermédiaire)

    Message par seaman130092 le Jeu 4 Mar - 13:17

    alors moi j'ai un soucis, ou puis je prendre la class RollOver ?? car quand je clique sur le lien je tombe sur un fichier texte !!??

    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 glissière avec effet lumineux (intermédiaire)

    Message par Demeter le Jeu 4 Mar - 13:31

    Bonjour seaman130092 alors il faut être plus explicite car un rollOver c'est quand la souris passe au-dessus du bouton ou du movieClip.
    C’est la fonction down ou click qu'il faut regarder pour le clic souris.

    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 glissière avec effet lumineux (intermédiaire)

    Message par seaman130092 le Jeu 4 Mar - 13:33

    en fait au début du tuto, Artkabis à mis un lien vers la class_RollOver et je tombe sur un fichier texte, comment je dois l'exploiter ??

    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 glissière avec effet lumineux (intermédiaire)

    Message par Demeter le Jeu 4 Mar - 14:10

    Oui je viens de tester le lien il fonctionne très bien j'ai une class rollOver.as
    Et tu sur que le fichier ces pas du code que tu prends pour du texte, car le fichier .as sont des fichiers de code action script mes se sont des classes externe c'est la POO en fait (programmation orienter objet)

    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 glissière avec effet lumineux (intermédiaire)

    Message par seaman130092 le Jeu 4 Mar - 15:08

    ... ca doit etre ça...

    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 glissière avec effet lumineux (intermédiaire)

    Message par Demeter le Jeu 4 Mar - 15:14

    Alors j'ai rechercher aprés pour toi si tu veut comprendre la POO voici un bon tuto de art
    http://www.artkabis.net/tutos-as3-f98/comprendre-la-hierarchie-du-langage-as3-poo-t868.htm

    Assomnia
    Nouveau membre
    Nouveau membre

    Messages : : 6
    Age : : 29
    Logiciels : Logiciels : : Adobe Flash CS4 / PSP CS4
    Date d'inscription : 21/03/2010

    Re: Menu glissière avec effet lumineux (intermédiaire)

    Message par Assomnia le Mar 23 Mar - 15:03

    Bonjour à tous,
    ce menu m'interesse beaucoup mais ne fonctionne absolument pas chez moi (meme celui d'exemple).

    J'ai des erreurs relatif à l'import de tweenlite et de gs.easing.
    Je ne sais pas ce que c'est :/

    J'ai également importer le rollover de artkabis comme expliquer.

    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 glissière avec effet lumineux (intermédiaire)

    Message par Demeter le Mar 23 Mar - 15:16

    Bonjour Assomnia alors il y a un nouveau tuto pour installer la classe tweenMax voici l'adresse : http://www.artkabis.net/tutos-as3-f98/installation-de-la-bibliotheque-tweening-plateform-v11-tweenmax-t2372.htm

    Et alors je pense que tu n’as pas du importer la classe tweenLite convenablement.
    Car pour importer la classe tweenLite c'est comme ceci :
    Code:

    import fl.transitions.Tween;
    import fl.transitions.easing.Elastic;
    Alors pour installer la classe tweenMax c'est comme ceci pour aller la chercher
    Code:

    import com.greensock.TweenMax;

    Voilà avec cela sa dois fonctionner

    Assomnia
    Nouveau membre
    Nouveau membre

    Messages : : 6
    Age : : 29
    Logiciels : Logiciels : : Adobe Flash CS4 / PSP CS4
    Date d'inscription : 21/03/2010

    Re: Menu glissière avec effet lumineux (intermédiaire)

    Message par Assomnia le Sam 27 Mar - 14:28

    Merci Demeter,

    j'ai essayé en suivant le tuto, j'ai bien importer TweenMax dans Flash, mais j'ai toujours des erreurs de compilation au niveau du RollOver.
    Dans le tuto, Arka précise bien qu'il faut le rajouter. J'ai donc crée un nouveau fichier .as que j'ai placé dans greensock qui se nomme RollOver.as
    J'ai modifié mon code pour qu'il importe ce fameux fichier. Et il me donne l'erreur : Le nom de définition "RollOver" ne reflete pas l'emplacement de ce fichier. Il faut changer le nom de définition ou du fichier.
    Voila mon code si sa peut aider :

    Code:
    import com.greensock.TweenLite;
    import com.greensock.easing.*
    import com.greensock.RollOver;

    var style              :StyleSheet;
    var heading            :Object;
    var ombre              :DropShadowFilter;
    var ombre2            :DropShadowFilter;
    var body              :Object;
    var pagActu            :int;
    var m                  :MovieClip;
    var page              :Page;
    var boutons            :Array;
    var btns              :MovieClip;
    var nbP                :int;
    var centreX            :int;

    m = menu;
    centreX = stage.stageWidth/2;
    style = new StyleSheet();
    page = new Page();
    heading = new Object();
    body = new Object();
    ombre = new DropShadowFilter(0,45,0x00000,1,4,4,1,3);
    ombre2 = new DropShadowFilter(0,45,0x00000,1,20,20,1,3);
    boutons  = new Array(m.bt1,m.bt2,m.bt3,m.bt4,m.bt5,m.bt6,m.bt7,m.bt8);
    page.mouseChildren = false;
    heading.fontWeight = "bold";
    heading.font = 'Visitor TT2 BRK';
    heading.color = "#FF0000";
    body.fontStyle = "italic";
    style.setStyle(".heading", heading);
    style.setStyle(".body", body);
    page.filters = [ombre2];
    this.addChild(page);
    page.y = (stage.stageHeight+(stage.stageHeight/10))/2;
    TweenLite.to(page,.6,{x:centreX,ease:Back.easeOut});
    for (var i:uint=0; i<boutons.length; i++)
    {
        btns = boutons[i];
        var roll:RollOver = new RollOver({mc:btns,mChilds:true});
        btns.titreBt.styleSheet = style;
        btns.addEventListener('mouseUp',ouvrePage);
        btns.titreBt.htmlText = "<body><font size='12'><span class='heading'>A</span>rt-k "+(i+1)+"</font></body>";
    }

    function detect(me:MouseEvent):void
    {
        if(mouseY>0 && mouseY<menu.height* 1.2)
        {
            TweenLite.to(menu,.4,{y:0,ease:Sine.easeOut});
            TweenLite.to(onglet,.4,{y:-onglet.height,ease:Sine.easeOut});
        }else
        {
            TweenLite.to(menu,.4,{y:-menu.height,ease:Sine.easeOut});
            TweenLite.to(onglet,.4,{y:0,ease:Sine.easeOut});
        }
    }
    function ouvrePage(me:MouseEvent):void
    {
        m.mouseChildren = false;
        nbP = int(me.target.titreBt.text.substr(me.target.titreBt.text.length-2,me.target.titreBt.text.length))
        if(nbP != pagActu)TweenLite.to(page,1,{x:-page.width,ease:Back.easeOut,onComplete:function replace():void{
            page.nbPage.text = String(nbP)
            pagActu = nbP;
            TweenLite.to(page,1,{x:centreX,ease:Back.easeOut,onComplete:function reactiv():void{m.mouseChildren = true}});
        }});
        else if (nbP === pagActu){
            m.mouseChildren = true
        }
    }
    stage.addEventListener('mouseMove',detect);

    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 glissière avec effet lumineux (intermédiaire)

    Message par Demeter le Sam 27 Mar - 17:22

    Bonjour Assomnia alors je pense que le fichier greensock n'est pas à la racine de ton site.
    Voici un fichier exemple très simple pour t'expliquer le fonctionnement j'ai joint un fichier texte explicatif et une photo pour te montrer comment faire.
    Voici le fichier : voici mon fichier

    Kirkoo
    Nouveau membre
    Nouveau membre

    Messages : : 46
    Age : : 64
    Logiciels : Logiciels : : Paint Shop Pro X3
    Photoshop CS4
    Flash CS4
    Dreamweaver CS4
    Date d'inscription : 17/02/2010

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

    Re: Menu glissière avec effet lumineux (intermédiaire)

    Message par Kirkoo le Lun 29 Mar - 17:53

    Merci beaucoup Artkabis pour ce super tuto.
    J'ai eu un tit peu de difficulté mais la il fonctionne très bien yeah!!!
    @+
    Kirkoo

    $calpeur
    Nouveau membre
    Nouveau membre

    Messages : : 24
    Age : : 40
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 10/03/2010

    Re: Menu glissière avec effet lumineux (intermédiaire)

    Message par $calpeur le Mar 30 Mar - 7:54

    Bonjour j ai essayer de faire le tuto et il me reste 8 erreurs . Il trouve pas DropShadowFilter et StyleSheet. J ai regarder dans mon dossier green stock il y sont pas .
    Je voie pas trop comment résoudre mon problème .
    Kirkoo a tu u le problème? si oui comment as tu fait pour le résoudre merci .


    Kirkoo
    Nouveau membre
    Nouveau membre

    Messages : : 46
    Age : : 64
    Logiciels : Logiciels : : Paint Shop Pro X3
    Photoshop CS4
    Flash CS4
    Dreamweaver CS4
    Date d'inscription : 17/02/2010

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

    Re: Menu glissière avec effet lumineux (intermédiaire)

    Message par Kirkoo le Mar 30 Mar - 13:34

    Coucou Scalpeur
    Non j'ai pas eu ce problème. Le plugin est bien dans TweenMax pour ma part.
    Je m'excuse de ne pouvoir t'aider
    Bonne chance
    @+
    Kirkoo

    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 glissière avec effet lumineux (intermédiaire)

    Message par Demeter le Mar 30 Mar - 18:37

    Bonjour $calpeur je ne suis pas chez moi mais je pense qu'il te manque des imports de classe genre pour le filtre DropShadowFilter.
    Regarde le tuto convenablement il doit certainement en parler au début du codage.

    $calpeur
    Nouveau membre
    Nouveau membre

    Messages : : 24
    Age : : 40
    Logiciels : Logiciels : : Quelles logiciel utilisez vous?
    Date d'inscription : 10/03/2010

    Re: Menu glissière avec effet lumineux (intermédiaire)

    Message par $calpeur le Mer 31 Mar - 7:17

    Demeter a écrit:Bonjour $calpeur je ne suis pas chez moi mais je pense qu'il te manque des imports de classe genre pour le filtre DropShadowFilter.
    Regarde le tuto convenablement il doit certainement en parler au début du codage.


    Salut Demeter , je pense que tu as raison, sa doit venir d’un import mais j'ai essai pas mal de chose, pas assai apparemment. Je pense avoir bien importer la classe greenstosk. Au début j avais 12 erreurs. Je vais continuer a chercher je vais peut être finir par comprendre mon erreur .

    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 glissière avec effet lumineux (intermédiaire)

    Message par seaman130092 le Mer 31 Mar - 10:20

    fais attention c pas greensTock mais greensock !!!

    Contenu sponsorisé

    Re: Menu glissière avec effet lumineux (intermédiaire)

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


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