Componentes: MenuBar I

El componente MenuBar nos permite crear menus desplegables similares, por ejemplo, a las típicas aplicaciones Windows.

Añadir Items a MenuBar
Podemos añadir menús sin ningún item dentro de ellos con el método addMenu(), pasándole la etiqueta (label) del menu. Por ejemplo:
1.- Desde el panel de componentes arrastra una instancia del componente MenuBar al escenario.
2.- Asignale como nombre de instancia "miMenuBar"
3.- Al fotograma le añadimos el siguiente código:

miMenuBar.addMenu("Empresa")
miMenuBar.addMenu("Clientes")
Para añadir items, podríamos crear una variable para cada menu. Por ejemplo:
CSS = miMenuBar.addMenu("CSS");
//Añadimos items con su correspondiente etiqueta
//y nombre de instancia
CSS.addMenuItem({label:"Css Beauty", instanceName:"cssbeauty"});
CSS.addMenuItem({label:"Css Vault", instanceName:"cssvault"});
CSS.addMenuItem({label:"Css Zen Garden", instanceName:"csszengarden"}); 

Aunque lo más cómodo es fijar una fuente de datos para alimentar completamente el componente MenuBar. Esto lo podemos hacer mediante un documento xml. Un ejemplo, al que he llamado datos.xml, podría ser éste:

<menus>
    <menu label="Clientes">
    <menuitem label="Añadir" instanceName="Añadir" />
    <menuitem label="Agrupar" instanceName="Agrupar" />
    <!-- Con enabled = false desabilitamos esa opción -->
    <menuitem label="Imagenes" instanceName="Imagenes" enabled="false" />
    <!-- Introducimos un separador en el menu -->
    <menuitem type="separator" />
    <menuitem label="Propiedades" instanceName="Propiedades" />
    <submenu label="Editar" instanceName="Editar">
        <menuitem label="Copiar" instanceName="Copiar" />
        <menuitem label="Pegar" instanceName="Pegar" />
    </submenu>
    </menu>
    <menu label="Ayuda">
    <menuitem label="Qué es esto" instanceName="Qué es esto" />
    <menuitem label="Acerca de" instanceName="Acerca de"/>
</menus>

Y en el fotograma tendremos el siguiente código:

var DatosMenu = new XML();
DatosMenu.onLoad = function(){
      miMenuBar.dataProvider = this.firstChild;
}
DatosMenu.ignoreWhite = true;
DatosMenu.load("uploads/Archivos/MenuBar1/datos.xml");  

Nota: Puedes encontrar tutoriales, que explican el acceso a datos desde Flash a un XML en este mismo blog. Utiliza el buscador para ello.

Descargar Ejemplo » »