Hi, I'm a complete newbie to Flex, so apologies for my dumbness. I've searched for an answer but haven't found anything that seems to be doing the trick.

What I'm trying to do: port this example http://www.adobe.com/devnet/air/flex/articles/flex_air_codebase_print.html to Flash Builder 4.

All seems to be fine but for one thing. When I use the original code for the Air application

<?xml version="1.0" encoding="utf-8"?>
<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/mx"
                       creationComplete="onApplicationComplete()">
<fx:Script>
    <![CDATA[
        private static const neededForCompilation:AirGeneralImplementation = null;
        private function onApplicationComplete():void
        {
            var can:MainCanvas = new MainCanvas();
            this.addChild(can); 
            can.labelMessage = "Loaded in an AIR Application ";
        }
    ]]>
</fx:Script>

<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>


</s:WindowedApplication>

I get this run time error

Error: addChild() is not available in this class. Instead, use addElement() or modify the skin, if you have one. at spark.components.supportClasses::SkinnableComponent/addChild()[E:\dev\4.0.0\frameworks\projects\spark\src\spark\components\supportClasses\SkinnableComponent.as:1038]

If I substitute the code with

this.addElement(can);

Everything loads well but the first time I try to press any of the buttons on the main canvas I get the following run time error

ArgumentError: Error #2025: The supplied DisplayObject must be a child of the caller. at flash.display::DisplayObjectContainer/getChildIndex() at mx.managers::SystemManager/getChildIndex()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\managers\SystemManager.as:1665] at mx.managers.systemClasses::ActiveWindowManager/mouseDownHandler()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\managers\systemClasses\ActiveWindowManager.as:437]

here's the super simple code for the main canvas

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               creationComplete="init();">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script source="main.as" />
    <mx:Label id="lblMessage" text="The UI from the shared Flex app BothCode" x="433" y="112"/>
    <s:Button x="433" y="141" click="saveFile();" label="Save File"/>
    <s:Button x="601" y="141" click="GeneralFactory.getGeneralInstance().airOnlyFunctionality();" label="Air Only"/>
</s:Application>

Any help would be immensely appreciated. And any pointers to how to setup a project that can compile in both Air and Flash while sharing the same code, all for Flex 4, would also be immensely appreciated.

thank you!