FlashLit.

Redirecting Flex 2 services using data binding

When I'm developing apps that use remote services, I sometimes start by connecting to a local web server on my own machine. When it's time to take the app live I switch it over to use the public version of the services.

If your app goes against more than one service it can be a real pain to edit all the URLs when you redirect from a local server to a public one and back again. It would be nice to change the first part of the URLs in one place and apply the change to all the URLs in your application at once. Luckily Flex 2 data binding makes this kind of thing almost trivial to implelement.

First, define a bindable variable to hold the changeable URL prefix:

<mx:Script>
<![CDATA[
     [Bindable]
    public var urlPrefix:String = "http://localhost/"
]]>
</mx:Script>

Next change the url or wsdl attributes of your services. Bind the first part of those attributes to the urlPrefix variable, like this:

<mx:WebService id="MyWebService" wsdl="{this.urlPrefix}/MyWebService.asmx?WSDL">

Or for an HTTP service:

<mx:HTTPService id="MyDynamicWebPage" url="{this.urlPrefix}/MyDynamicWebPage.html">

By default your services will now look for the services in the localhost domain. When you are ready to switch to a production server just change the initial value of the urlPrefix variable and rebuild your app.

Better yet you can read a urlPrefix value from a configuration file at runtime, so you can change servers whenever you want without rebuilding your app. This urlPrefix binding technique even lets you switch among mutliple domains at runtime if you have such a need.

"Data binding: it's not just for UI components anymore."

Building a Flex 2 App Starter Kit

Lately I've been putting together a fairly simple Application Starter Kit for my own use when starting up a new Flex 2 application.

Generally I'm not building gigantic enterprise-level applications, so a framework like Cairngorm which can be very useful for large-scale apps adds more complexity than I need.

Still I want the apps to have a familiar architecture and be easy to maintain. I'm also big on standardizing things like Error handling and Event dispatching for each app, so the Kit will include some support for that too.

The main elements I find myself repeating in each Flex 2 app include:

• A separate Model class to store data that will be used by other classes in the application.
• A separate Services class for encapsulating service calls and fault handling.
• An AppEvent class for passing application data when dispatching Events.
• An AppError class for defining and reporting application-specific errors.

I've also been repeating some patterns when developing the UI display code, including:

• A ViewStack control scheme that switches the view given the view component's id or index
• A simple dynamic Menu scheme
• Stupid Layout Tricks, like getting components to expand outside their containers, or using data binding to roll your own layout logic

As I formalize each of these elements I'll post a quick article about it here on Flashlit. After a few of these articles we should have small set of files that anyone can use to jump-start the development of simple service-enabled Flex 2 apps.

If you find yourself reusing certain modules, classes, or techniques over and over again in Flex 2, let me know, and maybe we can add something similar to the Kit.