3 Replies Latest reply on Mar 5, 2010 2:15 PM by olegkon

    Can't see Flex3 Container in AIR2 app

    olegkon Level 1

      Hi,

       

      This is probably a fairly basic question, but I started blending Flex3 & 4 code,

      and don't have much experience with writing my own Flex MXML components,

      so please bear with me.

       

      I am trying to move my AIR1.5 application into the Christophe Coentaets' embedded Tomcat AIR2 app as one of the Tabs:

      http://coenraets.org/blog/2009/12/embedding-tomcat-and-blazeds-in-an-air-2-0-application/

       

      My old AIR1.5 App consisted of 1 MXML file with one screen (DataGrid), WebService, lots of AS3 code, total about 800 lines.

      There is also a Java Web service which I deploy on the embedded Tomcat.

       

      Since it's one screen, I would like to just put my app GUI on the tab of a final AIR2 app.

      So I removed Windowed app, tried to replace it with Component. FB4 gave me error saying that Component can't be here.

      Then I tried Container, and all code compiled.

      But when I try to run it, no Flex3 GUI shows up. I can see that it's initialized (Alert). Setting visible=true for that container didn't help.

       

      Am I doing something wrong ?  Should it be not Container but Component or something else like VBox?

      Here is a code snippet:

       

      Main app:

      <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"

         xmlns:s="library://ns.adobe.com/flex/spark"

         xmlns:mx="library://ns.adobe.com/flex/halo"

         xmlns:local="*"

         title="AIR Application with Embedded Tomcat"

         height="600" width="800"

         applicationComplete="init()">

      <s:layout>

      <s:VerticalLayout paddingLeft="8" paddingRight="8" paddingBottom="8" paddingTop="8"/>

      </s:layout>   .....

      ......

      <mx:TabNavigator >

           <mx:VBox label="MyApp" paddingLeft="8" paddingRight="8" paddingBottom="8">

                <mx:HTML id="html" width="100%" height="100%"/>

                <local:AirXl7c visible="true" enabled="true"/>         

      </mx:VBox>

      </mx:TabNavigator>

      </s:WindowedApplication>

       

       

      my component:

      <mx:Container xmlns:mx="http://www.adobe.com/2006/mxml"

      creationComplete="init()"  borderColor="#FCF9F9"

      name="AirXl7c">

       

      ......

      </mx:Container>

       

      Please help !

       

      Any doc describing how to blend Flex3 & 4 ?

      Or do I have to rewrite Flex3 into Flex4 code, not to blend it ?

       

      TIA,

      Oleg.

        • 1. Re: Can't see Flex3 Container in AIR2 app
          John Hall Level 4

          Have you tried changing the halo namespace at the top to "mx" instead of "halo" at the end?


          1 person found this helpful
          • 2. Re: Can't see Flex3 Container in AIR2 app
            olegkon Level 1

            I changed my MXML component from Container to Canvas, that made my GUI visible.

             

            One other GUI problem I got is that

            when I change DataGrid data,

            in puts DataGrid on top of all other data fields

            thus coveringthem up.

            Setting   dataGrid.x=100   has no effect.

             

            That worked fine in Flex3 (DataGrid and other GUI components are in VBox),

            but broke while blending Flex4 with Flex3.

             

            In my component I have:

            <VBox>

                 <VBox>

                      <HBox1/>

                      <HBox2/>

                 </VBox>

                 <Datagrid/>

            </VBox>

             

            So in main class it gets:

            <TabNavigator>

                 <VBox>

                 myComponent

                </VBox>

            </TabNavigator>

             

            Any advice ?

            • 3. Re: Can't see Flex3 Container in AIR2 app
              olegkon Level 1

              As I mentioned, when I reassingn a Datagrid's dataSource to a new collection (either populated from the data file or generated like rowCount, columnCount), it always places my DataGrid on top of other GUI components (top right corner).

              assigning   dataGrid.x=100 , dataGrid.bottom=10, dataGrid.verticalCenter=20  does not change anything, I think, because it is inside VBox.

               

              I checked what happened in pure Flex3 case, it was putting this DataGrid towards the bottom of the screen (even without any position-related assignments)

               

              So in Flex4 code I started putting that Component inside (Flex3) TabNavigator.

              That is the only difference I see.

               

              Any help is very appreciated !

               

               

              TIA,

              Oleg.