Archive

Archive for the ‘Flex’ Category

Introduction to Robotlegs Architecture

April 19, 2012 4 comments

Application architecture is most important part for large scale enterprise application. You will get some important ideas about architecture from a small article on Application Architecture, which cover usage of application architecture and basic overview about PureMVC framework.

Sometime might be you feel that application’s same result will achieve by using MXML file without using such architecture. While probably it’s true for the small application, but keep in mind that a large scale application with a framework, will allows us to effectively communicate concepts and understands a code base quicker than an application without any design pattern and practice. In this article we are going to discuss about Robotlegs framework. So first lets start with what is Robotlegs.

Robotlegs is a great architectural framework for developing Flash, Flex, and AIR applications. It works for both Flash and Flex projects. Robotlegs is a mechanism for wiring your objects together. Robotlegs is a set of modular utilities and interfaces that provide tools to ease these communication tasks, reduce repetitive coding tasks, and manage dependency injection within your application.

The framework provides a default implementation based on MVC meta-design pattern. Robotlegs provides a prescriptive implementation of Model, View, Controller and Services (MVCS) implementation to get you start. If you have experience with PureMVC then you will quickly recognize the use of Mediators and Commands in Robotlegs framework MVCS design pattern. Robotlegs is a set of modular utilities and interfaces that provide tools to ease these communication tasks, reduce repetitive coding tasks, and manage dependency injection mechanism within your application.

You will get more idea from the  Official Robotlegs MVCS Diagram:

Basic Structure of Robotlegs Application

A typical Robotlegs application is compose of several parts as:

1. Context
2. Views & Mediators
3. Controller & Commands
4. Model
5. Services

Context

Context is the heart of Robotlegs implementation. It’s bootstrapping mechanism that initializes dependency injection and the various core utilities that Robotlegs uses. The context provides a central event bus and takes care of its own startup and shutdown. A context defines scope. Also its possible to have several context within application.

Views & Mediators

A view is another name for a user interface. Basically anything that is an interface between your application and the user can be considered a view. They can should only read data from a model, not write directly to it.

The mediator’s job is to quite literally ‘mediate’ the view’s connection to the rest of the system. It listens to events coming from the global event dispatcher and then invokes the change on the view. It also listens to events occurring on the view itself and then alerts the rest of the system by dispatching an event on the global dispatcher.

Controller & Commands

The controller’s job is to manipulate data on the model, processing it beforehand if necessary. The controller is usually invoked by a view in response to user input. The controller never holds onto any data, it simply processes it then hands it on (usually to a model or service).

Commands are registered to a Context via that Context’s CommandMap. CommandMap is available by default in Context and Command classes. The Command class in RobotLegs contains a single execute method which is called immediately after instantiation. You use a Command class by overwriting the execute method with your own code. Commands are simple and shorted lived. Once a Command is instantiated and execute has been called its job is done. The CommandMap does not hold onto Command instances by default, they are left to the mercy of the garbage collector at this point.

Model

Model’s role is to store state information within your application. This can be thought of as a place to store data that may need to be retrieved by another part of your program. Models send event notifications when work has been performed on the data model.

Robotlegs does not enforce the use of a specific Model class; any class can be treated as a Model. However, in order to gain access to the global EventDispatcher there is an Actor class which provides a single eventDispatcher property used to dispatch events to other actors in the system.

Service

Service is use for service tier communication with external entity like Web Services, file access, or any action that takes place outside of the scope of your application for a service class. Service classes dispatch system events in response to external events.

Conceptually there are many similarities between the service and model tiers in MVCS architecture. Because of this similarity, models and services are extended from the same base Actor class.

You will get more information about Robotlegs framework from here.

Enjoy RIA .. 🙂

Advertisements

Isometric 3D Games

February 25, 2011 1 comment

I would like to share some basics of setting for isometric 3D for some interesting application using open-source as3isolib library.

There are several popular 3D games like Farmville on facebook. There is a great open-source library known as as3isolib to develop such superb games. The open-source library, includes utilities, primitives and views and was developed with simplicity, speed and performance in mind so that developers can focus on actual implementations rather than having to learn a complex API.

The as3isolibs actionscript library provides a nice framework on which use, to build some interesting isometric games and applications. To get started with as3isolibs first download the latest version of the library from here, and add it to the Flex Builder path.

As the library relies on the Flash player 10 features so there are some instructions here to target Flash Player 10.

To use as3isolib will have to understand how to render isometric primitive to the display list, IsoGrid , IsoBox, IsoScene, IsoView and many more.

IsoPrimitive is the base class for primitive-type classes that will make great use of Flash’s drawing API. Developers should not directly instantiate this class but rather extend it or one of the other primitive-type subclasses.

IsoGrid provides a display grid in the X-Y plane.

IsoBox, 3D box primitive in isometric space.

IsoScene is a base class for grouping and rendering IsoDisplayObject children according to their isometric position-based depth.

You can get more information from the API Documentation.

You will get more superb information from below video tutorial from Lee Brimelow video tutorial Introduction to Isometric 3D.

Hope this information will be helpful to start work on isometric 3D.

Enjoy RIA.. 🙂

Migration from Flex 3 to Flex 4

May 9, 2010 3 comments

Recently, I experiment on migration of Flex 3 application to Flex 4 application. And I plan to list out the possible situation which can create problems during migration of your existing Flex 3 application to Flex 4 application.

When converting Flex 3 applications to Flex 4, you might encounter the following issues:

1) Namespaces

Flex 4 uses a new namespace. The old namespace mainly referred to as the “2006 namespace”  is as follows:

xmlns:mx=”http://www.adobe.com/2006/mxml

The new namespace mostly which referred to as the “2009 namespace” is composed of three namespace definitions, as follows:

xmlns:fx=”http://ns.adobe.com/mxml/2009″

xmlns:mx=”library://ns.adobe.com/flex/mx”

xmlns:s=”library://ns.adobe.com/flex/spark”

Different files used by the same application can have different namespaces either 2006 or 2009, but you cannot have both namespaces in the same file.

2) Declaration

Non-default, non-visual properties must be wrapped in the <fx:Declarations> tag in Flex 4 applications.

3) Loading SWF files

The signature of the ModuleLoader.loadModule() method has changed from:

public function loadModule():void

To:

public function loadModule(url:String, bytes:ByteArray):void

Also, the SWFLoader class has a new property, loadForCompatibility, and a new method, unloadAndStop(). These changes were added in Flex 3.2, but if you are migrating an application from Flex 3 to Flex 4, you might encounter them.

4) HTML wrapper

The HTML wrapper has changed from Flex 3. There are several differences in Flex 3 and Flex 4.  The default output of the HTML templates is to center the SWF file on the page. In Flex 3, the default was to align the SWF file to the upper left corner of the page.

5) Globals

Top-level Application object is different in Flex 4. ApplicationGlobals.application has been replaced with FlexGlobals.topLevelApplication. Using Application.application is deprecated. FlexGlobals.topLevelApplication is the recommend alternative.

6) RLSs

The framework RSL is linked by default. This means that when you build an application SWF file, classes in the framework.swc file are not included in the application SWF file. The classes are instead loaded from the framework RSL before the main application loads. In Flex 3 the default was to statically link the classes. Using the framework RSL was optional.

The advantage of using the framework RSL is smaller application SWF sizes and faster download times. The downside is increased memory usage because all the framework classes are loaded in the RSL, not just the classes that your application requires.

Also there are several other differences in Flex 3 and Flex 4 which might be encounter during migration of Flex 3 project to Flex 4. I would like if you encounter any new things then please share it.

Enjoy RIA…. 🙂

Flash Builder Facebook Application Development

May 8, 2010 11 comments

Adobe Flex and Flash Platform provides excellent development environment for rich experiences for games and websites. To develop an effective user experience application I think need to plan from scratch means the selection of development tool to deployment environment.

Recently, I am got some time on exploring interesting application on Facebook and exploring frameworks and Flash Builder.  Among a list of available options for frameworks and Facebook applications, I choose to explore an option for creating Flash Builder web application with Facebook.

To develop Facebook application will have to use Facebook REST API we will have to follow some steps as described below:

1) Add Facebook Developer application to your Facebook account
2) Get application API key to communicate with Facebook server
3) Register a Facebook application
4) Create an Flex application with Flash Builder

To communicate with Facebook from your application, first register your application with Facebook using Facebook Developer application.

1) In browser go to Facebook and login
2) Go to Facebook Developer application
3) Choose Allow option in Allow Access dialog box



4) Click the Bookmark Developer App link at the top of the browser window

5)  Click the Home link at the top of the page

6) On the Home page, see the new Developer application bookmark

Register application with Facebook

To communicate with Facebook from your application, you must first register your application with Facebook using the Developer application which assigns an application API key and secret which are used when you make calls to Facebook.

1) Return to the Facebook Developer application by clicking the application’s bookmark

2) Click on Setup new application

3) Enter your application name and fill some details and choose Create Application option.

4) In Basic section you get Application ID, API Key and Secret Key related to your application.

See, these Application Secret Key and API Key will be used for your Flex application. These Key is will create a connection between your application and Facebook.

5) Now select the Advanced option from the left side navigation.  For applications which can communicate with Facebook, you have to choose Application Type options. For web application will have to use Facebook REST API and specify setup and will have to use Facebook connect login for login functionality and it will have to deploy your application files on a publicly available server.

Now choose Save Changes option and you completed first step for you application.

Friends, very soon will post next step for these application, which will receive User Facebook  details in Flash Builder application.

New functionality for Text Component

April 1, 2010 Leave a comment

Yesterday, I got an update of preview release of  Squiggly, a good feature for adding spell checking engine for Adobe Flash Player and AIR.  By using its library you can easily add spell checking functionality in any Flex 3 or Flex 4 based text controls.

You can enjoy the demo application from here.

Get the superb feature package from here.

Enjoy RIA…  🙂

Flex 4 Application on Mobile Device !!

March 24, 2010 1 comment

Today I seen an superb demo of ‘flex 4 application running on google nexus one’ by Harish, an Adobe Evangelists.

And there is a list of the nice Key points described, and finally it comes to the Flex Mobile Framework.

You can enjoy the demo.

It would be a great feature for flex developers !!! 🙂

You can get more details from here.

Enjoy RIA…

Adobe Flash Builder 4 Final Release

March 22, 2010 Leave a comment

Its a great news for flash flex developers that Adobe Flash Builder 4 final released. Also Flex 4 SDK with completely new component and skinning architecture called Spark which support main motive for RIA applications and improved flex compiler performance and lots of other things.

According to developers prospective there are several new things like improved debugger support conditional breakpoints, watchpoints and expression evaluation, added code generation features and made it easier to test applications with network monitor and FlexUnit support.

You can get the exciting updates for the Spark from here by Deepa.

Download Flash Builder 4 and enjoy RIA from here.

If you are just getting started with Flex then there is an TestDrive nice option to speed up on Flex.

So friends enjoy RIA…