Module Loader along with Context Management in Parsley Framework in Flex 4

Please click on any advertisement on right side if you like this blog.

Parsley is a flex framework that provides the facility like Injections, Messaging, and View Wiring etc. The injection mechanism is very much similar to IOC mechanism of Java Spring Framework. Here, we are going to discuss the process for maintaining the injection mechanism in child modules while loading into a parent project.

Scenario:

1)      Create a project with parsley framework implementation and use injection in that project.

2)      Create a module in that project and write code for injecting model object in that module.

3)      Create another project and also use parsley injection mechanism to create object of a model class in that project.

4)      Write code in this new project for loading module created in step 1 and step 2.

Observation:

1)      Module should be loaded in main project.

2)      Injection in module class and main project after module loading must work similarly as before module loading.

Code:

Code for creating the module:

Module1.mxml

<?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:sf="http://www.spicefactory.org/parsley"

                     minWidth="955" minHeight="600">

     

      <fx:Script>

            <![CDATA[

                  import models.Module1model;

                 

                  [Inject]

                  public var module1Model:Module1model;

                 

                  private function handleClick():void

                  {

                        this.textContainer.text = module1Model.printMessage();

                  }

            ]]>

      </fx:Script>

     

      <fx:Declarations>

            <sf:ContextBuilder>

                  <sf:XmlConfig file="Config.xml"/>

            </sf:ContextBuilder>

            <sf:Configure/>

      </fx:Declarations>

     

      <s:VGroup id="mod1Vgroup">

            <s:Button label="Print Message in Module1" id="printTextBtn" click="handleClick();"/>

            <s:Button label="Clear Text" id="clearTextBtn" click="{this.textContainer.text = ''}"/>

            <s:Label text="Message Board"/>

            <s:TextArea id="textContainer"/>

      </s:VGroup>

     

</mx:Module>

Please click on any advertisement on right side if you like this blog.

Config file for this module

ModuleConfig.xml

<objects

    xmlns="http://www.spicefactory.org/parsley"

    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

    xsi:schemaLocation="http://www.spicefactory.org/parsley

        http://www.spicefactory.org/parsley/schema/2.3/parsley-core.xsd"

    >

     

      <object type="models.Module1model" id="module1"/>

     

</objects>

Up to now we have covered the steps 1 and 2 of scenario discussed above. Now let’s create a project in which this module is to be loaded as stated in step 3.

Suppose we have created a new project say MainProject as stated above. Now, let’s write code for loading module in main project as stated in step 4 in scenario.

To load the newly created module in our main project we have to follow following steps:

1)    Copy the corresponding swf file and xml file(used as config file) from the binDebug folder of module project and paste these in binDebug folder of main project where these have to be loaded.

2)    Write code for loading the corresponding module in main project.

Suppose we have followed and step 1 as discussed above. And now, we have to write code for loading module in main project. Say, we have written this code in MainProject.mxml as follows:

MainProject.mxml

<?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"

                     xmlns:sf="http://www.spicefactory.org/parsley"                   

                     addedToStage="dispatchEvent(new Event('configureIOC', true))"

                     minWidth="955" minHeight="600">

      <fx:Script>

            <![CDATA[

                  import models.MainModuleModel;

                 

                  import mx.controls.Alert;

                  import mx.core.IVisualElement;

                  import mx.events.ModuleEvent;

                  import mx.modules.IModuleInfo;

                  import mx.modules.ModuleManager;

                 

                  [Inject(id="mainModuleModel")]

                  public var mainModuleModel:MainModuleModel;                

                 

                  public function handleClick():void

                  {                      

                        this.mainModuleText.text = mainModuleModel.printMessage(); 

                  }

                                   

                  private function initApp():void {

                        md1.url = "Module1.swf";

                        //md1.applicationDomain =

                        md1.loadModule();

                       

                  }

                 

                  /* Add an instance of the module's class to the display list. */

                  public function modEventHandler(e:Event=null):void {

                        Alert.show("in mod event in module1");

                  }

                  public function handleError(e:Event):void {

                        Alert.show("error");

                  }

                 

                  public function handleProgress(e:Event):void{

                        Alert.show("testdf");

                  }

                 

                  [Init]

                  public function init():void{

                        this.mainModuleText.text =    mainModuleModel.printMessage();

                       

                        initApp();

                  }                

            ]]>

      </fx:Script>

     

      <fx:Declarations>

            <sf:ContextBuilder>

                  <sf:XmlConfig file="main.xml"/>

            </sf:ContextBuilder>

      </fx:Declarations>

     

      <s:Label id="mainModuleText"/>

     

      <s:HGroup gap="100">

            <mx:ModuleLoader id="md1" ready="modEventHandler();" />

      </s:HGroup>

     

</s:Application>

If we follow these steps accordingly, the corresponding module will be loaded in Main Project and the injection mechanism of both module and Main project will work as needed.

For complete code, please write to me at “jksnu1@gmail.com”

Please click on any advertisement on right side if you like this blog.