3 Replies Latest reply on Jun 14, 2007 2:34 AM by a.neko®

    mx.flash.ContainerMovieClip

    a.neko®
      Flex 3 (Moxie) / Flash CS3 Integration Kit

      Is it possible to create Flex containers in Flash CS3 (as presented in video.onflex.org) using the Integration Kit ( Make Flex Container command) provided with the current Flex 3 public prerelease?

      a.
        • 1. Re: mx.flash.ContainerMovieClip
          Glenn Ruehle Adobe Employee
          Yes, it is possible. Here are the steps:

          0. Install the Moxie Flex Component Kit. This can be found here:
          {FLEX_BUILDER_INSTALL_DIRECTORY}/sdks/moxie/projects/flash_integration/FlexComponentKit.m xp
          1. Create the container symbol
          2. Select the symbol and choose Commands > Make Flex Container
          3. Drag the "Flex Content Holder" symbol into your container symbol, and size/position accordingly
          4. Export the SWC file

          Glenn
          • 2. Re: mx.flash.ContainerMovieClip
            a.neko® Level 1
            Glenn - thanks a lot.


            Did as you said, and got expected result as far as MXML is concerned.
            For a Flash CS3 generated container component DevelopmentUIElement:

            <local:DevelopmentUIElement>
            <mx:VBox width="100%">
            <mx:Button width="100%" label="B1"/>
            <mx:Button width="100%" label="B2"/>
            <mx:Button width="100%" label="B3"/>
            <mx:Button width="100%" label="B4"/>
            </mx:VBox>
            </local:DevelopmentUIElement>

            Just wonderful, considering VBox and it's contents are also masked ( ! ).


            Now... for ActionScript (which I mostly use...), some issues arise:
            For a Flash CS3 generated container component DevelopmentUIElement:

            public class UIContainer extends Canvas {
            public final function UIContainer ():void {
            trace("UIContainer ");
            Application.application.addEventListener("applicationComplete",extend);
            }

            protected final function extend (event:Event):void {
            trace("UIContainer: extend()");

            var container1:DevelopmentUIElement=new DevelopmentUIElement();
            addChild(container1);

            var button1:Button=new Button();
            button1.percentWidth=100;
            button1.height=30;
            button1.label="B 1.1";
            container1.addChild(button1);

            var button2:Button=new Button();
            button2.percentWidth=100;
            button2.height=30;
            button2.label="B 1.2";
            container1.addChild(button2);

            }}

            The first problem is the need to wait for the application to dispatch a creationComplete or applicationComplete Event. It was the same case with the previous version of the Flash CS3 Integration. Unlike Flex native components, adding Flash CS3 generated components in the constructor method of a Flex ActionScript component lately added directly to the <mx:Application> via MXML - throws #1009 Error. LayoutManager issue.

            The second problem is that components ( Button) added to the container ( DevelopmentUIElement)... are not visible. In my example, I can see DevelopmentUIElement instance correctly, but not a thing of what I add to it.

            Yesterday, trying to find a workaround, I managed to add & see a Flash CS3 generated component/container to another Flash CS3 generated component/container through ActionScript in Flex, but that's all...


            Anyway - thanks for all the amazing job you people are doing : ))

            Andrei
            • 3. mx.flash.ContainerMovieClip
              a.neko® Level 1
              As always... after posting the issue - I found the solution : ))

              // Flash CS3 generated container instance
              var container1:DevelopmentUIElement=new DevelopmentUIElement();
              addChild(container1);

              // Flex container instance: one Flex container for a Flash CS3 container at a time, if I get it right.
              var box1:Box=new Box()
              box1.direction=BoxDirection.VERTICAL;
              box1.percentWidth=100;
              box1.percentHeight=100;

              // Elements for the Flex container
              var button1:Button=new Button();
              button1.percentWidth=100;
              button1.height=20;
              button1.label="B 1.1";
              box1.addChild(button1);

              var button2:Button=new Button();
              button2.percentWidth=100;
              button2.height=20;
              button2.label="B 1.2";
              box1.addChild(button2);

              // Flex container is not added to the stage of the Flash CS3 container with addChild() - it's assigned to the content variable.
              container1.content=box1


              Glenn: mighty awesome! : ))
              If only you could remove the #1009 Error problem... : )))