28 Replies Latest reply on Jun 4, 2012 11:11 AM by Flex harUI

    Errors with basic components in a module

    Travesty3 Level 1

      I have a project I created in Flash Builder 4 Beta 2. I imported it into the full version of Flash Builder 4 Premium. There were errors left and right, but most were fixed by changing halo to mx. I'm still having a problem with loading modules properly. This worked before the switch. I've trimmed the code down to just the basics that still produce errors:

      testProject.mxml:

      function(){return A.apply(null,[this].concat($A(arguments)))}

      <?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:Script>
        <![CDATA[
        import mx.modules.IModuleInfo;
        import mx.modules.ModuleManager;
        import mx.events.ModuleEvent;
       
        protected var myModule:IModuleInfo;
       
        public function init():void
        {
         myModule = ModuleManager.getModule("testModule.swf");
         myModule.addEventListener(ModuleEvent.READY, moduleReadyHandler);
         myModule.load(ApplicationDomain.currentDomain);
        }
       
        public function moduleReadyHandler(event:ModuleEvent):void
        {
         for (var i:int = 0; i < 2; i++)
         {
          var moduleInfo:IModuleInfo = event.currentTarget as IModuleInfo;
          var myModuleInstance:testModule = moduleInfo.factory.create() as testModule;
         
          myModuleInstance.id = 'sim'+ i;
          myModuleInstance.mac = i.toString();
          myModuleInstance.center = i.toString();
          myModuleInstance.refreshTimer = i;
         
          tilMain.addElement(myModuleInstance);
         }
        }
        ]]>
      </fx:Script>
      <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
      </fx:Declarations>
      <mx:Tile x="0" y="0" width="100%" height="100%" id="tilMain">
      </mx:Tile>
      </s:Application>

       

       

      testModule.mxml:

      function(){return A.apply(null,[this].concat($A(arguments)))}

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:flash="services.flash.*" layout="absolute" width="250" height="390" tabChildren="false">
      <fx:Script>
        <![CDATA[
         import mx.controls.Alert;
        
         [Bindable] public var mac:String;
         public var center:String;
         public var refreshTimer:int;
        
         public function sPan_doubleClickHandler(event:MouseEvent):void
         {
          Alert.show("double click");
         }
        ]]>
      </fx:Script>
      <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
      </fx:Declarations>
      <s:Button x="75" y="142" label="Button"/>
      </mx:Module>

       

       


      When I run the app, I get the following error:

      function(){return A.apply(null,[this].concat($A(arguments)))}

      ArgumentError: Error #2004: One of the parameters is invalid.
      at flash.display::Graphics/drawRoundRect()
      at spark.primitives::Rect/draw()[E:\dev\4.0.0\frameworks\projects\spark\src\spark\primitives \Rect.as:459]
      at spark.primitives.supportClasses::StrokedElement/updateDisplayList()[E:\dev\4.0.0\framewor ks\projects\spark\src\spark\primitives\supportClasses\StrokedElement.as:143]
      at spark.primitives.supportClasses::GraphicElement/http://www.adobe.com/2006/flex/mx/internal::doUpdateDisplayList()[E:\dev\4.0.0\frameworks\ projects\spark\src\spark\primitives\supportClasses\GraphicElement.as:3828]
      at spark.primitives.supportClasses::GraphicElement/validateDisplayList()[E:\dev\4.0.0\framew orks\projects\spark\src\spark\primitives\supportClasses\GraphicElement.as:3812]
      at spark.components::Group/updateDisplayList()[E:\dev\4.0.0\frameworks\projects\spark\src\sp ark\components\Group.as:956]
      at spark.skins::SparkSkin/updateDisplayList()[E:\dev\4.0.0\frameworks\projects\spark\src\spa rk\skins\SparkSkin.as:191]
      at spark.skins.spark::ButtonSkin/updateDisplayList()[E:\dev\4.0.0\frameworks\projects\spark\ src\spark\skins\spark\ButtonSkin.mxml:77]
      at mx.core::UIComponent/validateDisplayList()[E:\dev\4.0.0\frameworks\projects\framework\src \mx\core\UIComponent.as:8531]
      at mx.managers::LayoutManager/validateDisplayList()[E:\dev\4.0.0\frameworks\projects\framewo rk\src\mx\managers\LayoutManager.as:663]
      at mx.managers::LayoutManager/doPhasedInstantiation()[E:\dev\4.0.0\frameworks\projects\frame work\src\mx\managers\LayoutManager.as:718]
      at mx.managers::LayoutManager/doPhasedInstantiationCallback()[E:\dev\4.0.0\frameworks\projec ts\framework\src\mx\managers\LayoutManager.as:1072]


      If I switch the button to a label, I get this error:

      function(){return A.apply(null,[this].concat($A(arguments)))}

      TypeError: Error #1009: Cannot access a property or method of a null object reference.
      at mx.core::UIComponent/getStyle()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\core\UI Component.as:10372]
      at spark.components::Label/createTextLinesFromTextBlock()[E:\dev\4.0.0\frameworks\projects\s park\src\spark\components\Label.as:831]
      at spark.components::Label/createTextLines()[E:\dev\4.0.0\frameworks\projects\spark\src\spar k\components\Label.as:808]
      at spark.components::Label/http://www.adobe.com/2006/flex/mx/internal::composeTextLines()[E:\dev\4.0.0\frameworks\pro jects\spark\src\spark\components\Label.as:474]
      at spark.components.supportClasses::TextBase/measure()[E:\dev\4.0.0\frameworks\projects\spar k\src\spark\components\supportClasses\TextBase.as:533]
      at mx.core::UIComponent/measureSizes()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\cor e\UIComponent.as:8042]
      at mx.core::UIComponent/validateSize()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\cor e\UIComponent.as:7966]
      at mx.managers::LayoutManager/validateSize()[E:\dev\4.0.0\frameworks\projects\framework\src\ mx\managers\LayoutManager.as:617]
      at mx.managers::LayoutManager/doPhasedInstantiation()[E:\dev\4.0.0\frameworks\projects\frame work\src\mx\managers\LayoutManager.as:709]
      at mx.managers::LayoutManager/doPhasedInstantiationCallback()[E:\dev\4.0.0\frameworks\projec ts\framework\src\mx\managers\LayoutManager.as:1072]

       

      I have to assume both these errors will be solved with the same solution, and under that assumption, my NUMEROUS other problems will probably also be either solved or easier for me to solve on my own. Thanks!

       

      -Travis

        • 1. Re: Errors with basic components in a module
          Flex harUI Adobe Employee

          You are using the module class in the main app which sort of defeats the

          point of having a module as it will link testModule into the main app.  When

          that happens in Flex 4, the styles don't get set up properly.  You should

          use an interface instead of the module class.

          • 2. Re: Errors with basic components in a module
            hloops23 Level 1

            I am having the same issue, and cant seem to resolve it. Can y please explain little further what y mean.

            • 3. Re: Errors with basic components in a module
              Flex harUI Adobe Employee

              The main point of modules is to make the main application SWF smaller.  When

              using modules you have to realize that any mention of a class in the

              application code links in those classes and all dependent classes.  We sort

              of assumed that folks knew that and have made changes to the styles system

              in Flex 4 that require that you know that.

               

              Here's an example.  Suppose I have an app that with one view that has a

              DataGrid and a bunch of Charts.  The code might look like:

               

              <mx:Application>

                  <mx:TabNavigator id="tn">

                      <mx:Canvas>

                          <mx:TextInput id="userName" />

                          <mx:Button label="go" />

                      </mx:Canvas>

                      <mx:Canvas>

                          <mx:DataGrid id="dg" .../>

                          <mx:PieChart .../>

                          <mx:BarChart .../>

                      </mx:Canvas>

                  </mx:TabNavigator>

              </mx:Application>

               

              This application SWF might be too big and slow at startup, so you move the

              second view into a module.

               

              <mx:Application>

                  <mx:TabNavigator id="tn">

                      <mx:Canvas>

                          <mx:TextInput id="userName" />

                          <mx:Button label="go" />

                      </mx:Canvas>

                      <mx:ModuleLoader url="MyBigFatModule.swf">

                  </mx:TabNavigator>

              </mx:Application>

               

              <!---- MyBigFatModule.mxml

              1 person found this helpful
              • 4. Re: Errors with basic components in a module
                hloops23 Level 1

                I get that, and its exactly how my app is built. I need to be able to instantiate components dynamically, so I have to load  SWF modules based on a config XML file. The modules are based on mx:module and have a conbination of spark and mx components. I am using a variation of the below code to load the modules:

                 

                module = ModuleManager.getModule(component.@url.toString());

                module.addEventListener(ModuleEvent.READY,moduleReady);

                module.addEventListener(ModuleEvent.ERROR,moduleError);

                module.load();

                 

                private  function moduleReady(event:ModuleEvent):void

                {

                 

                var modelInfo:IModuleInfo = event.currentTarget as IModuleInfo;

                var myInstance:IVisualElement = modelInfo.factory.create() as IVisualElement;

                this.addElement(myInstance);

                }

                 

                I then get the following error when I wrap the content of the module in a BorderContainer

                 

                ypeError: Error #1009: Cannot access a property or method of a null object reference.

                at mx.core::UIComponent/getStyle()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\core\UI Component.as:10372]

                at mx.core::UIComponent/getConstraintValue()[E:\dev\4.0.0\frameworks\projects\framework\src\ mx\core\UIComponent.as:8612]

                at mx.core::UIComponent/get horizontalCenter()[E:\dev\4.0.0\frameworks\projects\framework\src\mx\core\UIComponent.as: 8730]

                 

                when I remove the border container, I get the following error:

                ArgumentError: Error #2004: One of the parameters is invalid.

                at flash.display::Graphics/drawRect()

                at mx.graphics::RectangularDropShadow/drawShadow()[E:\dev\4.0.0\frameworks\projects\framewor k\src\mx\graphics\RectangularDropShadow.as:575]

                at cobalt.skins::BorderSkin/updateDisplayList()[E:\dev\4.0.0\samples\themes\cobalt\src\cobal t\skins\BorderSkin.mxml:113]

                at mx.core::UIComponent/validateDisplayList()[E:\dev\4.0.0\frameworks\projects\framework\src \mx\core\UIComponent.as:8531]

                at mx.managers::LayoutManager/validateDisplayList()[E:\dev\4.0.0\frameworks\projects\framewo rk\src\mx\managers\LayoutManager.as:663]:

                 

                 

                When I add the module explicitely as component to another MXML file, it loads just fine with no errors.

                 

                This is a trimmed version of my module:

                 

                <mx:Module  width="100%" height="100%"

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

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

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

                 

                <s:BorderContainer  width="100%" height="100%">

                 

                <mx:Image bottom="10" right="10" id="companyLogo" source="{source}" />

                <mx:Image y="{this.height /2+12}" click="Hide('tableOfContent')" left="2" id="forward"/>

                <mx:Image y="{this.height /2-13}" left="2" click="Show('tableOfContent')" id="back" />

                <s:Group id="mapTypes" left="60" top="10" alpha="0.9" click="mapTypes_clickHandler(event)">

                <s:layout>

                <s:ButtonBarHorizontalLayout gap="2" />

                </s:layout>

                     ..//// other components that get loaded dynamically...

                </s:Group>

                <components:SystemMgr id="pSysMgr"/>

                </s:BorderContainer>

                 

                </mx:Module>

                 

                 

                • 5. Re: Errors with basic components in a module
                  Travesty3 Level 1

                  Thanks for the help. This is the first Flex project I've ever worked on, and I took it over from a co-worker that actually started it. I think he got the idea of using modules from a forum somewhere, but I'm not sure even he knew what the specific purpose of modules.

                   

                  I actually didn't even need to use an interface either, I just simplified it and am now just appending instances of a component to a mx:Tile. As I expected, all the other errors were immediately cleared up.

                   

                  Thanks again for your help!

                   

                  -Travis

                  • 6. Re: Errors with basic components in a module
                    em_volant Level 1

                    I generally have a code behind/mediator/view helper that has knowledge of the module view component. This gives AS code knowledge of the module, linking to it. The code that has knowledge of it is only ever used by the module. Are you saying that we are no longer able to have a setup like this? If this is not the case, then how can I have backend code that references the module view component?

                    • 7. Re: Errors with basic components in a module
                      PeterSchout

                      got the same issue using this code as the ready handler of the module loader,  

                       

                      private function readyHandler(event:Event):void

                      {

                          if (loader.child is SignOnModule)

                          {

                               loader.child.addEventListener("events.LoginEvent", loginHandler);

                          }

                      }

                       

                      is there a way to catch those events without linking?

                       

                      Thanks,

                      Peter

                      • 9. Re: Errors with basic components in a module
                        rajagopal.s Level 1

                        Hi ,

                         

                        Am using ModuleLoader to load modules , and am getting  the error mentioned above sometimes when i work locally and and got the  error frequently  when i tested in server by making release. in the sample Module which i  created there was a button which i created with the custom skin , when i  removed the button it was loading properly , if add the button but it  throws the following error. i tried to load the module using IModuleInfo  and ModuleManager   but getting the same error. please help me on this

                        • 10. Re: Errors with basic components in a module
                          rajagopal.s Level 1

                          Hi ,

                           

                          Am using ModuleLoader to load modules , and am getting  the error mentioned above sometimes when i work locally and and got the  error frequently  when i tested in server by making release. in the sample Module which i  created there was a button which i created with the custom skin , when i  removed the button it was loading properly , if add the button but it  throws the following error. i tried to load the module using IModuleInfo  and ModuleManager but getting the same error. please help me on this

                          • 11. Re: Errors with basic components in a module
                            VeenaChezhian

                            Hi,

                            I am having the same problem with Flex 4.5 Modules. Any one have a solution for this problem?

                            • 12. Re: Errors with basic components in a module
                              Flex harUI Adobe Employee

                              As the replies in the thread say: make sure your main module class isn't

                              linked into the main app SWF.

                              • 13. Re: Errors with basic components in a module
                                VeenaChezhian Level 1

                                Yes, My module app is not linked in the main app swf.

                                • 14. Re: Errors with basic components in a module
                                  VeenaChezhian Level 1

                                  HI,

                                   

                                  I want to use modules for sure. Modules class and its related classed are placed in a separate project. I have a main project which loads this Module dynamically.

                                   

                                  Something like this

                                   

                                  Main Project:

                                  <s:WindowedApplication

                                       ...

                                  >

                                   

                                  <s:states>

                                    <s:State name="test1" />

                                  <s:State name="test12" />

                                  </s:states>

                                   

                                  <mx:ViewStack>

                                     <s:ModuleLoader url="com.test.Test1Module" visible.test1="true" />

                                     <s:ModuleLoader url="com.test.Test2Module" visible.test2="true" />

                                  </mx:ViewStack>

                                   

                                  </s:WindowedApplication>

                                   

                                   

                                  Test1 Project

                                  This has Test1Module in it

                                   

                                  Test1Module.mxml

                                   

                                  <s:Module>

                                     <s:Button label="test1" ./>

                                  </s:Module>

                                   

                                   

                                  Test2 Project

                                  This has Test2Module in it

                                   

                                  Test2Module.mxml

                                  <s:Module>

                                     <s:Button label="test2" ./>

                                  </s:Module>

                                   

                                  When i compile and run the app, I get thiis err

                                   

                                   

                                  Main Thread (Suspended: ArgumentError: Error #2004: One of the parameters is invalid.)         

                                                  flash.display::Graphics/drawRoundRect [no source]     

                                                  spark.primitives::Rect/draw     

                                                  spark.primitives.supportClasses::StrokedElement/updateDisplayList  

                                                  spark.primitives.supportClasses::GraphicElement/http://www.adobe.com/2006/flex/mx/internal::doUpdateDisplayList              

                                                  spark.primitives.supportClasses::GraphicElement/validateDisplayList

                                                  spark.components::Group/validateDisplayList

                                                  mx.managers::LayoutManager/validateDisplayList       

                                                  mx.managers::LayoutManager/doPhasedInstantiation

                                                  mx.managers::LayoutManager/doPhasedInstantiationCallback              

                                   

                                   

                                  This is really annoying error to me and i have almost spent 5 hours in this issue. I want to use modules and accomplish my task.

                                   

                                  Any clue or solution is greatly appreciated.

                                   

                                   

                                  Thanks!

                                   

                                  • 15. Re: Errors with basic components in a module
                                    Flex harUI Adobe Employee

                                    And you used a link-report to determine that?

                                    • 17. Re: Errors with basic components in a module
                                      Flex harUI Adobe Employee

                                      Post a complete 20-line test case

                                      • 18. Re: Errors with basic components in a module
                                        miki escolar Level 1

                                        Hi to all,

                                         

                                        We had the same problem with the ColorPicker component in modules. We solved the problem by having the main application loads the ColorPicker at startup.

                                         

                                        I hope that it helps.

                                        • 19. Re: Errors with basic components in a module
                                          Eduards Jermaks . Level 1

                                          If there should not be any reference to module that will be loaded in the main applicatio. How I can access the specific properties I have defined in this module? I would like to use interface, but if I create interface class in application (and use it in external module) then reference appears. Any ideas?

                                           

                                          If I am loading module without any reference everything works fine.

                                          • 20. Re: Errors with basic components in a module
                                            Flex harUI Adobe Employee

                                            You can put any interface or class in both the main app and the module.  Only the main apps definition will be used, the other will be ignored.  If that shared thing is a 2K interface, then you’ve only wasted 2K of module download, but if it is a 10K class that also brings in another 100K of classes, then you have wasted more bandwidth.  That’s why interfaces are preferred.

                                            • 21. Re: Errors with basic components in a module
                                              Eduards Jermaks . Level 1

                                              Maybe I didn't get. You mean duplicate interface description in module and in main application? I have tried this approach, but it didnt't work. However interface desciption is identical to the interface description in the module, it is different from application point of view. So there is problem to cast module as interface that belongs to main application.

                                               

                                              For example:

                                              1. Main application package: mainApp, where is declared interface IMyModule

                                              2. Module package: videoModule, that implements IMyModule interface and duplicated declaration of IMyModule

                                              3. Interface description: IMyModule with specific properties - URL, name, title etc.

                                               

                                              In the main application:

                                              moduleInfo = ModuleManager.getModule("MyModule.swf");

                                              moduleInfo.load();

                                               

                                              In the module ready event:

                                              var myModule:IMyModule = moduleInfo.factory.create() as IMyModule; //here is interface from main app and the result is null because of incorrect casting

                                              • 22. Re: Errors with basic components in a module
                                                Flex harUI Adobe Employee

                                                Yes, the main app and module must share the same definition of the interface.  If it has a different name, than it isn’t going to be of that type or interface.

                                                • 23. Re: Errors with basic components in a module
                                                  Eduards Jermaks . Level 1

                                                  So, is there any solution to have external module and work with it's specific properties and methods?

                                                  • 24. Re: Errors with basic components in a module
                                                    Flex harUI Adobe Employee

                                                    You can refer to it as object[“property”] but it is better to share an interface.

                                                    • 25. Re: Errors with basic components in a module
                                                      Eduards Jermaks . Level 1

                                                      Ok, thanks. I wish I could use interface, but seems it is not suitable for this.

                                                      • 26. Re: Errors with basic components in a module
                                                        Flex harUI Adobe Employee

                                                        A properly designed interface is the recommended practice and completely suitable for communication between the main app and its modules.

                                                        • 27. Re: Errors with basic components in a module
                                                          Eduards Jermaks . Level 1

                                                          Could you please send example of implementation? I am newbie in Flash and maybe I am searching for something wrong on google, because I can't find.

                                                          • 28. Re: Errors with basic components in a module
                                                            Flex harUI Adobe Employee

                                                            There should be examples in the documentation, and on my blog, and elsewhere.

                                                             

                                                            --

                                                            Alex Harui

                                                            Flex SDK Team

                                                            Adobe Systems, Inc.

                                                            http://blogs.adobe.com/aharui