Enterprise Flex: Modules - Using Intefaces to Communicate

My last post involved turning an existing sample application into a module. Let’s build a little bit upon that example. Its nice to now have a module that I can load inside another Flex application, but what if we want the application to be able to communicate with this loaded module? We also don’t want to have a hard dependency between our application and the module since we want our module to have the ability to work inside any Flex application.

The answer is Interfaces. By defining a common interface for our modules and using it in both our application and our module we can easily allow our application to use any module methods exposed by the interface and avoid tight coupling.

Once again I will borrow from my previous post and add an interface to my FirstTry Application. Below is the interface I will be using (filename “IModule.as”):
package modules
{
import flash.events.IEventDispatcher;
public interface IModule extends IEventDispatcher
{
//expand the app (same as mouse over)
function expand():void;
//collapse the app
function collapse():void;
//click CRT button
function showCRT():void;
//click Flat panel button
function showFlatPanel():void;
//click Rear Proj button
function showRearProjection():void;
//click Front Proj button
function showFrontProjection():void;
//Pass in a yes/no question for the module to ask with an Alert.
//The alert will call back into your provided function
function askQuestion(question:String, alertCloseListener:Function):void;
}
}

In the module we need to implement this interface. To do that we add an implements tag at the top of the module like so:
<mx:Module xmlns:mx=”http://www.adobe.com/2006/mxml”
implements=”modules.IModule” >
</mx:Module>

At this point you would get compile errors telling you that the functions in the IModule interface do not have implementation methods. I won’t go into the individual method implementations here but you can refer to the complete source to see them in the sample project below.

Once the IModule implementation methods are done we are finished with the module and can move on to the Application that will be calling into the module.

In your application you first need to import the IModule interface:
import modules.IModule;

Once you have your module loaded you can test to see if it implements the module interface:
module = info.factory.create() as UIComponent;
if (module != null) {
//If the loaded module implements the known interface we can make calls into this module.
if (module is IModule) {
IModule(module).expand();
}
}

As you can see using interfaces with modules is pretty simple once you understand how it works. I’ll leave it to you to browse the source to see the various interface calls in action. Below is the updated Module Loader application with source enabled.