Bha, depois de um bom tempo sem postar aqui, vamos a mais uma. Esta semana andei notando as dúvidas entre Menubar e ViewStack.

[Bindable]
private var menubarXML:XMLList =
    <>
        <menuitem label="Paisagem" >
            <menuitem label="Abrir Paisagem 1"  data="0" />
            <menuitem label="Abrir Paisagem 2"  data="1" />
            <menuitem label="Abrir Paisagem 3"  data="2" />
        </menuitem>
        <menuitem label="Animais" >
            <menuitem label="Abrir Animais 1"  data="3" />
            <menuitem label="Abrir Animais 2"  data="4" />
            <menuitem label="Abrir Animais 3"  data="5" />
        </menuitem>
    </>;

// Controla o evento de clic do menu principal
private function menuPrincipalClicado(e:MenuEvent):void
{
    viewstack1.selectedIndex = Number(e.item.@data);
}

Acima temos o XML que montará o Menubar, e este ao receber o evento de Click chamará a função menuPrincipalClicado. Este por sua vês é responsável por selecionar o ViewStack.

<mx:ApplicationControlBar width="100%" dock="true">
    <mx:HBox width="100%">
        <mx:MenuBar labelField="@label" itemClick="menuPrincipalClicado(event);"
                    dataProvider="{menubarXML}"/>
    </mx:HBox>
</mx:ApplicationControlBar>  

<mx:Canvas width="100%" height="100%">
    <mx:ViewStack id="viewstack1" left="10" right="10" top="10" bottom="10">
        <mx:Box width="100%" height="100%">
            <Telas:Paisagem1 width="100%" height="100%"/>
        </mx:Box>
        <mx:Box width="100%" height="100%">
            <Telas:Paisagem2 width="100%" height="100%"/>
        </mx:Box>
        <mx:Box width="100%" height="100%">
            <Telas:Paisagem3 width="100%" height="100%"/>
        </mx:Box>
        <mx:Box width="100%" height="100%">
            <Telas:Animais1 width="100%" height="100%"/>
        </mx:Box>
        <mx:Box width="100%" height="100%">
            <Telas:Animais2 width="100%" height="100%"/>
        </mx:Box>
        <mx:Box width="100%" height="100%">
            <Telas:Animais3 width="100%" height="100%"/>
        </mx:Box>
    </mx:ViewStack>
</mx:Canvas>

Bom, então agora divirtam-se com o fonte.

Gostou? Não esqueça de curtir!

Ou compartilhe o link com seus amigos

Compartilhar no Facebook Compartilhar no Google + Compartilhar no Twitter Compartilhar no LinkedIn

4 comentários

  1. Luchiano
    10 de Abril de 2010

    Boa eduarto vou ver agora essa dica vlw

    Responder
  2. Raphael
    31 de Maio de 2010

    Olha seu exemplo me ajudou muito, Obrigado.

    Mas agora estou tendo um problema e se puder me ajudar agradeço?!

    segue aabixo o codigo:
    intra.selectedIndex = Number("9");

    ele esta dentro de uma função

    mas quando clico denovo no menu
    o viewstack fica travado nele.

    alguma ideia?

    Obrigado desde Já!

    Responder
  3. Raphael
    31 de Maio de 2010

    ele fixa o stack 9 e quando vou no menu para ir em outro ele até muda mas ele imediatamente retorna para o stack 9! e desculpe!

    Responder
  4. Raphael
    31 de Maio de 2010

    private function checkLogin(evt:ResultEvent):void
                {    
                    var data:String;
                    var vazio:String = '';
                    
                    switch(evt.result.loginsuccess)
                    {
                        case 'comum':
                            data = '9';
                            intra.selectedIndex = 9;
                            login_user.send();
                            break;
                        case 'ger':
                            data = '10';
                            intra.selectedIndex = Number(data);
                            login_user.send();
                            break;
                        case 'no':
                            mx.controls.Alert.show("Usuario ou Senha Invalido!");
                            break;
                    }
                }

    Responder

Deixe uma resposta