2 Replies Latest reply on Jul 25, 2008 11:57 AM by ntsiii

    Dynamic component loading problem

    charithao Level 1

      I want to load an MXML component dynamically to an appilication. The MXML component is in a diffrent flex project.
      The component contains a flex color picker. I could load the component using a loader and instantiate it. When I add an instance of the component to a HBox skin of the color picker is not displayed and I get below error when I click on it.

      TypeError: Error #1009: Cannot access a property or method of a null object reference.
      at mx.controls::Button/mouseDownHandler()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\ controls\Button.as:2740]

      This is the code of the MXML component

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Canvas xmlns:mx=" http://www.adobe.com/2006/mxml" width="50" height="50">

      <mx:ColorPicker width="100%" height="100%">


      This is the code of main application

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onCreation()">

      import mx.controls.Alert;

      private var loadedClass:Class;

      private var componentsList:Array= [{label:"Color Picker", data:"ColPick"}

      private function onCreation():void


      private function loadComponent():void
      var loader:Loader = new Loader();
      loader.load(new URLRequest("comp/"+txtClass.selectedItem.data+".swf"));

      private function onLoadComplete(event:Event):void
      Alert.show("Loading Complete");
      var ldr:LoaderInfo = (event.target as LoaderInfo);
      loadedClass = ldr.applicationDomain.getDefinition(txtClass.selectedItem.data) as Class;

      private function onCreateInstance():void
      var a = new loadedClass();

      private function onLoadError(event:SecurityErrorEvent):void
      Alert.show("Error loading");


      <mx:VBox x="10" y="10" width="100%" height="100%">
      <mx:HBox width="100%" height="10%">
      <mx:ComboBox dataProvider="{componentsList}" id="txtClass"/>
      <mx:Button label="Load Component" id="cmdLoad" click="loadComponent()"/>
      <mx:Button label="Create Instance" click="onCreateInstance()"/>
      <mx:HBox width="100%" height="100%" id="vbxContainer">


      Am I making any mistake here? How do I get this working. I tried to use modules but it couldn't be used as modules couldn't be instantiated.

        • 1. Re: Dynamic component loading problem
          ntsiii Level 3
          Loader, and SWFLoader, are meant to work with compiled SWF's, essentially entire applications.

          Your component is only that, a component, and never becomes a swf. Only Application and Module asre valid tags for an mxml file that is to become a free-standing swf.

          Components must be available at compile time, because they are compiled into the app(swf).

          So you need to choose.
          1. Compile the colorPicker component into the app as a component. You will need to add a path to it in your Flex Project properties.

          2. Make the color picker a full application by changing the Canvas to Application. Compile it, and place the swf in a location accessible by url.


          • 2. Re: Dynamic component loading problem
            ntsiii Level 3
            And sorry, in #2, add "then load that swf using SWFLoader".

            You should use SWFLoader instead of Loader unless you know why not.