0 Replies Latest reply on Jun 29, 2009 12:18 AM by westofoxley

    Call Custom Component to panel with menuBar

    westofoxley

      I'm very new to flex and I have made an application that uses a menuBar, the menuBar is linked to an external XML file and it is working fine when I want to call a JPG/GIFF/SWF to the Panel I have set up, but I need it to be able to bring up things like Accordions and other custom components that I will make.

       

      I am assuming that I must make a new private function? that when I click on item[20] it displays the specs.mxml component.

       

      If someone could please help me out it would be great.

       

      Thank you

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

      <?xml version="1.0" encoding="utf-8"?>

      <mx:Application

       

       

      xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical

      "

      applicationComplete="photoService.send()" backgroundGradientAlphas="

       

      [1.0, 1.0]" backgroundGradientColors="[#979797, #FFFFFF]" verticalGap="0

      "

      xmlns:comps="

       

      components.*"

      >

       

       

      <mx:Style source="assets/CSS/styles.css"

      />

       

       

      <mx:Script>

      <![CDATA[

       

       

      import

      mx.events.MenuEvent;

       

       

      import

      mx.rpc.events.ResultEvent;

       

      [

       

      Bindable

      ]

       

       

      private var

      xLocations:XMLList;

      [

       

      Bindable

      ]

       

       

      private var

      xPhoto:XML;

       

       

       

       

       

      private function resultHandler(event:ResultEvent):

      void

      {

      xLocations = event.result.location;

      }

       

       

       

      private function itemClickHandler(event:MenuEvent):

      void

      {

       

       

      var selectedMenu:XML = event.item as

      XML;

       

       

      trace("You selected "

      + selectedMenu.@label);

      xPhoto = selectedMenu;

      }

       

       

       

      ]]>

       

       

      </mx:Script>

       

       

       

      <mx:HTTPService id="photoService

      "

      url="

       

      data/IUAmenu.xml

      "

      result="resultHandler(event)"

      resultFormat="

       

      e4x"/>

       

       

       

      <mx:ApplicationControlBar dock="true" height="75" fillAlphas="[1.0, 1.0]" fillColors="[#D4D4D4, #FFFFFF]" width="1000" horizontalAlign="center" horizontalGap="0"

      >

       

       

       

      <mx:VBox backgroundImage="assets/images/layoutimages/LOGO.png" backgroundColor="#ffffff

      "

      width="

       

      126" height="55" borderStyle="solid" borderThickness="0" color="#021114" borderColor="#020B11"

      >

       

       

      </mx:VBox>

       

       

       

      <mx:MenuBar id="myMenu

      "

      dataProvider="

       

      {xLocations}

      "

      labelField="

       

      @label

      "

      itemClick="itemClickHandler(event)" height="

       

      55" width="874" themeColor="#FF0000"

      />

       

       

      </mx:ApplicationControlBar>

       

       

       

      <mx:Panel

      height="

       

      480

      "

      width="

       

      1000

      "

      verticalAlign="

       

      middle" horizontalAlign="center" horizontalScrollPolicy="off" verticalScrollPolicy="off" borderThicknessLeft="5

      "

      borderThicknessRight="

       

      5

      "

       

      status="

       

      {xPhoto.@label}"

      >

       

       

      <mx:Image source="assets/{xPhoto.@source}

      "

      visible="

       

      {xPhoto != null}"

      />

       

       

      </mx:Panel>

       

       

       

      <mx:HBox borderStyle="solid" borderThickness="0" borderColor="#000000

      "

      paddingBottom="

       

      0" paddingLeft="0" paddingRight="20" paddingTop="4

      "

      horizontalGap="

       

      5" width="1000" height="35" styleName="blackBG" horizontalAlign="right" backgroundImage="assets/images/layoutimages/bottomBlackBG.jpg"

      >

       

       

      <mx:Button label="Contact Us" color="#FFFFFF" fillAlphas="[0.0, 0.0, 0.0, 0.0]" borderColor="#000000" fontSize="14" fontWeight="normal" fontFamily="Verdana" themeColor="#FF0000"

      />

       

       

      <mx:Button label="link" color="#FFFFFF" fillAlphas="[0.0, 0.0, 0.0, 0.0]" borderColor="#000000" fontSize="14" fontWeight="normal" fontFamily="Verdana" themeColor="#FF0000"

      />

       

       

      <mx:Button label="Link" color="#FFFFFF" fillAlphas="[0.0, 0.0, 0.0, 0.0]" borderColor="#000000" fontSize="14" fontWeight="normal" fontFamily="Verdana" themeColor="#FF0000"

      />

       

       

      </mx:HBox>

       

       

       

      <mx:HBox borderStyle="solid" borderThickness="0" borderColor="#000000

      "

      paddingBottom="

       

      0" paddingLeft="0" paddingRight="20" paddingTop="4

      "

      horizontalGap="

       

      3" width="1000" height="25" horizontalAlign="right" backgroundColor="#FFFFFF" backgroundAlpha=".0"

      >

       

       

      <mx:LinkButton label="HOME" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="SITE MAP" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="PRIVACY POLICY" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="DISCLAIMER" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="CONTACT US" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="Link" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      </mx:HBox>

       

       

       

      <mx:HBox borderStyle="solid" borderThickness="0" borderColor="#000000

      "

      paddingBottom="

       

      0" paddingLeft="0" paddingRight="20" paddingTop="0

      "

      horizontalGap="

       

      0" width="1000" height="25" horizontalAlign="right" backgroundColor="#FFFFFF" backgroundAlpha=".0"

      >

       

       

      <mx:LinkButton label="link" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="link" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      <mx:LinkButton label="link" fontFamily="Verdana" color="#8F8F8F" fontWeight="normal" themeColor="#FF0000"

      />

       

       

      </mx:HBox>

       

       

      </mx:Application>