Problème d'affichage du background en Flash MX 2004

Résolu
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009 - 6 mai 2009 à 11:44
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009 - 8 mai 2009 à 13:08
Bonjour à tous!

Je suis débutant en flash, et j'ai un petit problème que je ne comprends pas...

Voilà. Tout d'abord, j'utilise Flash MX 2004. Et j'aimerais créer un menu flash vertical avec des sous-menus de manière dynamique en partant d'un fichier xml. Je sais qu'il y a déjà plein de sources sur ce forum, mais pas ce que je recherche. (J'ai déjà tout regardé.) J'aimerais créer ce menu dynamique en me basant sur aucune image de départ, et créer ce menu dynamiquement par code.

Pour ce qui est de la création et du chargement du menu, ça y a pas de problème.

Pour ceux ou celles qui recherche la même chose que moi, voici le lien qui m'a aidé:
www.kirupa.com/developer/actionscript/xml_dropdown_menu.htm

Mon problème, est que quand le nom d'un item du menu dépasse le dixième caractères, ce nom rétréci de taille en se serrant, et le background lui, s'arrête sur le dixième caractère. Et le reste des caractères n'est pas coloré. En plus, il y a un encadré noir, que j'aimerais aussi retiré avec votre aide.

Et aussi, savez-vous comment je pourrais changer la police de caractère ainsi que la taille, car la méthode setFormat, ne fonctionne pas dans mon cas... Car il n'y a pas de champs texte.

En tout cas, un grand merci déjà d'avance à tous et à toutes pour votre aide! 

10 réponses

cs_Girou Messages postés 1203 Date d'inscription lundi 10 mars 2003 Statut Membre Dernière intervention 23 juillet 2009 2
6 mai 2009 à 12:21
Bonjour,

Si tu a parcouru le tutorial qui accompagne cette source tu devrais avoir trouvé la réponse à plusieurs questions comme l'encadré noir que tu veux retirer (editer le symbole contenant le fond, la fleche et le texte), la taille (pour afficher plus de 10 caractères) -> modifie le symbole sus-mentinné en conséquence.

changer la police -> sur le champs de texte toujours du même symbole faire 'intégrer la police de caractère' (options du champs de texte)

"Car il n'y a pas de champs texte."
Bien sur que si... sinon impossible d'afficher du texte dynamique

@+
3
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009
6 mai 2009 à 12:40
Bonjour! Et merci pour ta réponse si rapide.

En fait, dans le fichier source qu'ils donnent, il n'y a pas de symbole créé...

Tout est fait par code.

Si tu veux, voici mon code...

*************************************************************************************

// generates a list of menu items (effectively one menu)
// given the inputted parameters.  This makes the main menu
// as well as any of the submenus
GenerateMenu = function(container, name, x, y, depth, node_xml)
{
    // variable declarations
    var curr_node;
    var curr_item;
    var curr_menu = container.createEmptyMovieClip(name, depth);
   
    // for all items or XML nodes (items and menus)
    // within this node_xml passed for this menu
    for (var i=0; i<node_xml.childNodes.length; i++)
    {
        // movieclip for each menu item
        curr_item = curr_menu.attachMovie("menuitem","item"+i+"_mc", i);
        curr_item._x = x;
        curr_item._y = y + i*curr_item._height;
        curr_item.trackAsMenu = true;
       
        // item properties assigned from XML
        curr_node = node_xml.childNodes[i];
        curr_item.action = curr_node.attributes.action;
        curr_item.variables = curr_node.attributes.variables;
        curr_item.name.text = curr_node.attributes.namemenu;
       
        // Alignement du texte des menus à gauche
        curr_item.name.autosize = "left";
    //    curr_item.name.wordWrap = false;
        // Largeur du menu
        curr_item._width = 130;
        // Hauteur du menu
    //    curr_item._height = curr_item._height;
        // Couleur du menu
        var ma_couleur = new Color(curr_item.background);
        ma_couleur.setRGB(0x92d74b);
        // Couleur du texte du menu
        curr_item.name.textcolor = 0x13571e;
    //    curr_item.name.background = false;
       
       
        // item submenu behavior for rollover event
        if (node_xml.childNodes[i].nodeName == "menu")
        {
            // open a submenu
            curr_item.node_xml = curr_node;            curr_item.onRollOver curr_item.onDragOver function()
            {
                var x = this._x + this._width + 0.2;
                var y = this._y + 0;
                GenerateMenu(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
                // Changement de couleur du menu lors de la survol
                var col = new Color(this.background);
                col.setRGB(0xb45f27);
            };
        }
        else
        { // nodeName == "item"
            curr_item.arrow._visible = false;
            // close existing submenu            curr_item.onRollOver curr_item.onDragOver function()
            {
                curr_menu.submenu_mc.removeMovieClip();
                // Changement de couleur du sous-menu lors de la survol
                var col = new Color(this.background);
                col.setRGB(0xb45f27);
            };
        }
                curr_item.onRollOut curr_item.onDragOut function()
        {
            // Restauration de la couleur de départ du menu
            var col = new Color(this.background);
            col.setRGB(0x92d74b);
        };
       
        // any item, menu opening or not can have actions
        curr_item.onRelease = function()
        {
            Actions[this.action](this.variables);
            CloseSubmenus();
        };
    } // end for loop
};

// create the main menu, this will be constantly visible
CreateMainMenu = function(x, y, depth, menu_xml)
{
    // generate a menu list
    GenerateMenu(this, "mainmenu_mc", x, y, depth, menu_xml.firstChild);
    // close only submenus if visible durring a mouseup
    // this main menu (mainmenu_mc) will remain
    mainmenu_mc.onMouseUp = function()
    {
        if (mainmenu_mc.submenu_mc && !mainmenu_mc.hitTest(_root._xmouse, _root._ymouse, true))
        {
            CloseSubmenus();
        }
    };
};

// closes all submenus by removing the submenu_mc
// in the main menu (if it exists)
CloseSubmenus = function()
{
    mainmenu_mc.submenu_mc.removeMovieClip();
};

// This actions object handles methods for actions
// defined by the XML called when a menu item is pressed
Actions = Object();
Actions.gotoURL = function(urlVar)
{
    getURL(urlVar, "_self");
};

// load XML, when done, run CreateMainMenu to interpret it
menu_xml = new XML();
menu_xml.ignoreWhite = true;
menu_xml.onLoad = function(ok)
{
    // create main menu after successful loading of XML
    if (ok)
    {
        CreateMainMenu(10, 10, 0, this);
    }
};
// load first XML menu
menu_xml.load("datas.xml");
*************************************************************************************

Je ne vois nulle part, où il y a une délimitation que pour l'encadrer noir...

Merci.
3
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009
6 mai 2009 à 13:08
Euh, ça va, je crois que j'ai trouvé...

En fait, tu m'as mis sur une piste. Je ne sais pas comment ça se fait, peut-être avec la compilation, mais quand je recopie le même code dans un nouveau document, avec le même fichier xml dans le même répertoire, celui ne fonctionne pas... Pour cause à mon avis, pas de symbole.

Pourtant, dans celui d'actuelle, il n'y a pas de symbole non plus...

Je vais donc créer un bouton, en code pour ainsi le dupliquer.

En tout cas, un grand merci pour ton aide et pour ta réponse si rapide!
3
cs_Girou Messages postés 1203 Date d'inscription lundi 10 mars 2003 Statut Membre Dernière intervention 23 juillet 2009 2
6 mai 2009 à 13:10
curr_item = curr_menu.attachMovie("menuitem","item"+i+"_mc", i);

attachmovie -> placer sur la scene une symbole (movieclip) existant dans la bibliotheque (dont le nom de liaison est " menuitem ")
Il doit donc y avoir un symbole DANS la bibliotheque même si il n'y a rien sur la scène

C'est là que tu peux l'éditer (enlever le cadre noir)

// Largeur du menu
curr_item._width = 130; // là on peut changer la largeur d'un element de sous menu

// Couleur du texte du menu
curr_item.name.textcolor = 0x13571e; //  changement de la couleur du champ de texte (nom d'occurence name qui se trouve dans l'élément du menu (curr_item)

@+
3

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009
6 mai 2009 à 13:27
SUPER!!!!!!!!!!!!

Je n'ai plus du tout pensé à la fenêtre bibliothèque. Maintenant j'ai sû résoudre mes problèmes grâce à toi!

Un tout tout grand merci!
3
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009
6 mai 2009 à 17:14
Re-bonjour à tous!

J'ai réussi à faire la modification de la taille de police de caractères ainsi que la mise en forme, en modifiant sur le symbole, et ça fonctionne, mais j'aimerais le faire sous forme de code. J'ai essayé, mais il ne change rien!

Voici mon code avec mes modifications (=> en gras) :

******************************************************************

// generates a list of menu items (effectively one menu)
// given the inputted parameters.  This makes the main menu
// as well as any of the submenus
GenerateMenu = function(container, name, x, y, depth, node_xml)
{
    // variable declarations
    var curr_node;
    var curr_item;
    var curr_menu = container.createEmptyMovieClip(name, depth);
   
    // for all items or XML nodes (items and menus)
    // within this node_xml passed for this menu
    for (var i=0; i<node_xml.childNodes.length; i++)
    {
        // movieclip for each menu item
        curr_item = curr_menu.attachMovie("menuitem","item"+i+"_mc", i);
        curr_item._x = x;
        curr_item._y = y + i*curr_item._height;
        curr_item.trackAsMenu = true;
       
        // item properties assigned from XML
        curr_node = node_xml.childNodes[i];
        curr_item.action = curr_node.attributes.action;
        curr_item.variables = curr_node.attributes.variables;
        curr_item.name.text = curr_node.attributes.namemenu;
       
        // Alignement du texte des menus à gauche
        curr_item.name.autosize = "left";
    //    curr_item.name.wordWrap = false;
        // Largeur du menu
    //    curr_item._width = 120;
        // Hauteur du menu
        //curr_item._height = 30;
        // Couleur du menu
        var ma_couleur = new Color(curr_item.background);
        ma_couleur.setRGB(0x92d74b);
       
        // Couleur du texte du menu
        curr_item.name.textcolor = 0x13571e;
    //    curr_item.name.background = false;

        var myTextFormat = new TextFormat();
        myTextFormat.bold = true;
        myTextFormat.italic = true;
        myTextFormat.font = "Arial";
        myTextFormat.color = 0xFF0000;
        myTextFormat.size = 16;
        curr_item.setTextFormat(myTextFormat);

        // item submenu behavior for rollover event
        if (node_xml.childNodes[i].nodeName == "menu")
        {
            // open a submenu
            curr_item.node_xml = curr_node;            curr_item.onRollOver curr_item.onDragOver function()
            {
                var x = this._x + this._width + 0.2;
                var y = this._y + 0;
                GenerateMenu(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
                // Changement de couleur du menu lors de la survol
                var col = new Color(this.background);
                col.setRGB(0xb45f27);
            };
        }
        else
        { // nodeName == "item"
            curr_item.arrow._visible = false;
            // close existing submenu            curr_item.onRollOver curr_item.onDragOver function()
            {
                curr_menu.submenu_mc.removeMovieClip();
                // Changement de couleur du sous-menu lors de la survol
                var col = new Color(this.background);
                col.setRGB(0xb45f27);
            };
        }
                curr_item.onRollOut curr_item.onDragOut function()
        {
            // Restauration de la couleur de départ du menu
            var col = new Color(this.background);
            col.setRGB(0x92d74b);
        };
       
        // any item, menu opening or not can have actions
        curr_item.onRelease = function()
        {
            Actions[this.action](this.variables);
            CloseSubmenus();
        };
    } // end for loop
};

// create the main menu, this will be constantly visible
CreateMainMenu = function(x, y, depth, menu_xml)
{
    // generate a menu list
    GenerateMenu(this, "mainmenu_mc", x, y, depth, menu_xml.firstChild);
    // close only submenus if visible durring a mouseup
    // this main menu (mainmenu_mc) will remain
    mainmenu_mc.onMouseUp = function()
    {
        if (mainmenu_mc.submenu_mc && !mainmenu_mc.hitTest(_root._xmouse, _root._ymouse, true))
        {
            CloseSubmenus();
        }
    };
};

// closes all submenus by removing the submenu_mc
// in the main menu (if it exists)
CloseSubmenus = function()
{
    mainmenu_mc.submenu_mc.removeMovieClip();
};

// This actions object handles methods for actions
// defined by the XML called when a menu item is pressed
Actions = Object();
Actions.gotoURL = function(urlVar)
{
    getURL(urlVar, "_self");
};

// load XML, when done, run CreateMainMenu to interpret it
menu_xml = new XML();
menu_xml.ignoreWhite = true;
menu_xml.onLoad = function(ok)
{
    // create main menu after successful loading of XML
    if (ok)
    {
        CreateMainMenu(10, 10, 0, this);
    }
};
// load first XML menu
menu_xml.load("datas.xml");
******************************************************************

C'est pourtant bien "curr_item", mon champs texte! Pourquoi ne fait-il aucune modification? Est-ce que j'utilise mal la méthode "setTextFormat()"?

Encore merci d'avance à tous pour votre aide.
3
cs_Girou Messages postés 1203 Date d'inscription lundi 10 mars 2003 Statut Membre Dernière intervention 23 juillet 2009 2
6 mai 2009 à 20:21
curr_item est le clip qui contient le champ de texte

curr_item.name.setTextFormat(myTextFormat);

@+
3
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009
6 mai 2009 à 22:38
ça marche pas non plus... Là, il m'efface tous les noms des items...
3
cs_Girou Messages postés 1203 Date d'inscription lundi 10 mars 2003 Statut Membre Dernière intervention 23 juillet 2009 2
7 mai 2009 à 09:02
enlève cette ligne là

myTextFormat.font = "Arial";

si tu veux intégrer des polices de caractères, la procédure est plus complexe. (fait une recherche sur flashkod ou google pour ce type de probleme)

@+
3
cs_Aigle2 Messages postés 7 Date d'inscription jeudi 3 avril 2008 Statut Membre Dernière intervention 8 mai 2009
8 mai 2009 à 13:08
Ca va, j'ai enfin trouvé le problème!

Il fallait simplement ajouter l'instruction "curr_item.name.embedFonts = false;"!

Donc :

*************************************************
curr_item.name.embedFonts = false;

var myTextFormat = new TextFormat();
myTextFormat.color = 0x397126;
myTextFormat.size = 16;
myTextFormat.underline = true;
myTextFormat.font = "Times New Roman";
myTextFormat.bold = true;
myTextFormat.italic = true;
curr_item.name.setTextFormat(myTextFormat);
**************************************************

Et ça fonctionne parfaitement!

Y a juste, que je n'ai pas encore trouvé pour faire le multiligne...
J'ai utilisé la propriété wordWrap et ça fonctionne, mais j'ai un problème avec le background qui ne suit pas... Il ne colorie que la première ligne, en plus, tout est l'un sur l'autre, donc illisible...

Est-ce que tu aurais une idée sur ce que je dois ajouter ou modifier?

Pour le problème que tout est l'un sur l'autre, ça il suffit juste de descendre la position du curr_item, mais pour le problème du background, je ne vois pas trop...

Merci pour ton aide!
3
Rejoignez-nous