1 Reply Latest reply on Dec 9, 2006 9:05 PM by davidmedifit

    Problem with code

    m_hartnett Level 3
      I am working through my first Flex 2 application and have run into a problem that I haven't been able to resolve.
      Can anyone take a look at this code and see if you can tell me what is wrong.
      The problem is associated with the views and AddChild element.

      My view setup is
      BaseView
      ----OurCompanyView
      -------- compContactUsView
      -------- compAboutUsView
      -------- compCareersView
      ---- AdWithUsView
      -------- adSizeView
      -------- adProdView
      -------- adDesignView

      The OurCompanyView and AdWithUsView have a set of linkbuttons that the children should see.

      I have trimmed the code down to minimal.

      Here is how to reproduce the problem.

      1. Click on the Our Company linkbutton
      2. Click on the Contact Us linkbutton
      3. Click on the Advertise With Us linkbutton
      4. Click on the Our Company linkbutton again
      5. Error occurs here with an error box stating that the AddChild item already exists.

      The problem can actually be seen right after you click the Advertise With Us linkbutton because the Our Company linkbutton does not change back to the original color.


      Thanks.


      Here is the code.
      <?xml version="1.0" encoding="utf-8"?>

      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute" width="920" height="668" borderStyle="none" backgroundGradientColors="[#ffffff, #ffffff]" horizontalAlign="center" horizontalScrollPolicy="off" verticalScrollPolicy="off">

      <mx:states>
      <mx:State name="homeView">
      <mx:SetStyle target="{lbHome}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="adWithUsView">
      <mx:AddChild relativeTo="{bodyCanvas}" position="lastChild">
      <mx:HBox x="10" y="8" width="805" backgroundColor="#f4f4f4" id="adWithUsNav">
      <mx:LinkButton label="Ad Design" click="currentState='adDesignView'" themeColor="#ea7500" width="69" textAlign="left" id="lbAdDesign" fontSize="10"/>
      <mx:LinkButton label="Ad Size and Placement" click="currentState='adSizeView'" themeColor="#ea7500" width="145" textAlign="left" id="lbAdSize" fontSize="10"/>
      <mx:LinkButton label="Production Schedule" click="currentState='adProdView'" themeColor="#ea7500" width="127" textAlign="left" id="lbProdSched" fontSize="10"/>
      </mx:HBox>
      </mx:AddChild>
      <mx:SetStyle target="{lbAdWithUs}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="adDesignView" basedOn="adWithUsView">
      <mx:SetStyle target="{lbAdDesign}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="adSizeView" basedOn="adWithUsView">
      <mx:SetStyle target="{lbAdSize}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="adProdView" basedOn="adWithUsView">
      <mx:SetStyle target="{lbProdSched}" name="color" value="#cc0000"/>
      </mx:State>

      <mx:State name="ourCompanyView">
      <mx:AddChild relativeTo="{bodyCanvas}" position="lastChild">
      <mx:HBox x="10" y="7" width="805" backgroundColor="#f4f4f4" id="ourCompanyNav">
      <mx:LinkButton label="About Us" click="currentState='compAboutUsView'" themeColor="#ea7500" width="65" textAlign="left" id="lbAboutUs" fontSize="10"/>
      <mx:LinkButton label="Careers" click="currentState='compCareersView'" themeColor="#ea7500" width="58" textAlign="left" id="lbCareers" fontSize="10"/>
      <mx:LinkButton label="Contact Us" click="currentState='compContactUsView'" themeColor="#ea7500" width="75" textAlign="left" id="lbContactUs" fontSize="10"/>
      </mx:HBox>
      </mx:AddChild>
      <mx:SetStyle target="{lbOurCompany}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="compContactUsView" basedOn="ourCompanyView">
      <mx:SetStyle target="{lbContactUs}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="compAboutUsView" basedOn="ourCompanyView">
      <mx:SetStyle target="{lbAboutUs}" name="color" value="#cc0000"/>
      </mx:State>
      <mx:State name="compCareersView" basedOn="ourCompanyView">
      <mx:SetStyle target="{lbCareers}" name="color" value="#cc0000"/>
      </mx:State>
      </mx:states>

      <mx:Canvas height="88" backgroundColor="#f5ea57" y="0" width="100%" x="0" id="headCanvas" borderStyle="none" borderColor="#000000" verticalScrollPolicy="off" horizontalScrollPolicy="off">

      </mx:Canvas>
      <mx:HBox x="0" y="88" width="100%" height="21" verticalAlign="middle" borderStyle="outset" borderColor="#000000" backgroundColor="#f2f2f2" backgroundAlpha="0.69">
      <mx:LinkButton height="16" label="Home" id="lbHome" click="currentState='homeView'"/>
      <mx:LinkButton height="16" label="Our Books" id="lbOurBooks"/>
      <mx:LinkButton height="16" label="Lookup Number" id="lbLookupNumber"/>
      <mx:LinkButton height="16" label="Advertise With Us" id="lbAdWithUs" click="currentState='adDesignView'"/>
      <mx:LinkButton height="16" label="Our Company" id="lbOurCompany" click="currentState='ourCompanyView'"/>
      </mx:HBox>
      <mx:Canvas x="10" y="117" width="900" height="517" backgroundColor="#ffffe6" id="bodyCanvas" borderStyle="solid" borderColor="#c1c100">
      </mx:Canvas>


      </mx:Application>
        • 1. Re: Problem with code
          davidmedifit Level 1
          Hi,
          Did you hand code the states, or use the designer? Also, I don't want to make it sound like I'm dodging the question, but you may want to look into viewstacks to achieve what you are trying to do (i.e., menu selections). A good place to start would be to look at the included "Phone" application, and the way it has three main menu options.

          I can try get you some examples when I'm back in the office next week if you can't find antyhing in the Flex manuals. Not trying to didge your initial question, but I think you are possibly making life hard on yourself.

          Cheers,

          David