Architecting FLEX Dashboards with Cairngorm Design Patterns

Here is a quick post for the Dashboard Spy reader who contacted me about the FLEX2 dashboard project they are working on. I look forward to displaying your dashboards in this forum. Here is the dashboard code example we spoke about using the Cairngorm microarchitecture.

Cairngorm is an architecture or design pattern framework for RIA (Rich Internet Application) development using the Adobe FLEX platform. It is an implementation of the design patterns prescribed by the gurus at Adobe Consulting for their FLEX RIA architecture.

On cairngormdocs.org is an absolutely wonderful series of posts about the cairngorm code examples you’ll want to study and adopt for your flex dashboard project. The article is entitled Dashboard Example: How Business Logic Can Manage Views. The post gathers the links to the tutorial modules you’ll want to study. The tutorials and code walkthroughs themselves are hosted at Adobe Consulting.

Here is how the tutorial starts. One single dashboard portlet as shown in this image. The coding and architecture is discussed and a working example is provided.

Example Dashboard using FLEX Cairngorm Design Pattern

As you see in this next dashboard screenshot, the dashboard grows to accomodate multiple portlets. See this image:

Stockmarket Dashboard Example built with Adobe Flex

For a flavor of the tutorial (It’s part of the wonderful series provided by the RIA Flex experts at Adobe Consulting), here is an excerpt from the intro:

Cairngorm Sample – How Business Logic Can Manage Views
There are many ways to update your views when your server- or client side business logic changes. The strategy you find me usually recommending is the ModelLocator strategy, which leverages the Flex binding feature.

Basically, your views bind to properties that are retrieved from your ModelLocator. These properties can be changed from your Commands, other business logic or other views and once changed; all listening views are updated seamlessly.

Since many of the Cairngorm examples out there are meant to be easy to understand, they often just show these properties exposed as single properties on the ModelLocator. Once your RIA grows in size, this indeed can be quite limiting. I’ll showcase another Cairngorm sample application that focuses on how you can improve your architecture with investing in slightly more advanced business logic. The sample application is a stock market dashboard that allows users to retrieve price quotes on a company stock.

Tags: Adobe Flex Dashboards, FLEX2, Cairngorm Design Patterns, Enterprise Dashboards, FLEX Dashboard Architecture Example using Cairngorm Design Patterns

Related Business Intelligence Dashboard Examples:

  • Excellent Dashboard Programming Resource via The Dashboard Spy. This 10 minute video from AdobeT ...

  • Some business dashboard partners of mine were discussing RIA style applications and how very "da ...

  • "How to create interactive gauges in Adobe Flex Dashboards and connect them to dynamic data sour ...

Leave a Reply