|
IntroductionThis article gives an introduction to the use of Model-View-Controller (MVC) pattern with Adobe Flex. It illustrates the use of MVC on the Flex client-side as well as that of the Flex client as the View component in the MVC pattern.Model-View-Controller architectural pattern increases the reusability of the various components and improves the maintainability of the overall system. The Flex application is generally considered to part of the View in a distributed MVC (Model 2 MVC). However, Flex implements its own classic MVC architecture at the client side with its own view, model and controller components. MVC is the most used design pattern for the presentation layer in Flex. The view components for the client-side MVC are typically written in MXML. The model components, representing data at the client-side, are ActionScript objects. The client-side MVC in Flex also has controller components which are responsible for the communication with the back-end systems. The sections below discuss how using the MVC pattern enhances the Flex client, in the client-side MVC scenario, and the role the Flex client plays in server-side MVC scenario.
Client-side MVCFigure 1 below shows an architecture diagram for the client-side MVC. As shown below, the MVC is a part of the flex presentation layer rather than in the Java layer. Figure 2 shows the various components involved in a typical client-side MVC design. At the top level is the Flex application MXML file and Flex reusable components developed in MXML or ActionScript 2.0. Application MXML file holds all the views all the time but shows only one view at a time. This article does not deal with how this can be achieved.  All the user actions are redirected to a central Front Controller (which is an ActionScript 2.0 class). Front Controller holds a map of all the Command objects which know what exactly to do for a give user action. Front Controller implementation in ActionScript 2.0 can be achieved with the collaboration of two key classes that work in an event-driven manner.
Server-Side MVCThe MVC typically decouples the data access, the business logic and the data presentation. When building an RIA with a server implementing MVC, the Flex application can act as the 'View' part in MVC. This approach will mean that there is no impact on the model and the controller aspects of MVC architecture being used. Flex in this setup communicates with the using the traditional HTTP Request/Response mechanism. The following diagram illustrates this approach:
Comparing the two
Server-side MVC kind of undermines the basic principle of Rich Internet Application. The basic principle of Rich Internet Application is to provide rich user experience. Rich user experience does not include the rich user interface alone, but also eye-blink response times for most of the user actions (if not all of them). So having a server-side MVC implies that all the user actions map to some object on the server side and the user actions are transmitted over HTTP to the server.
SummaryThis article talked about the traditional MVC architecture and Flex's own classic MVC implementation on the client-side. The article also compared the two and discussed the advantages and disadvantages of integration a Flex application by following the two approaches.
References
|
|||||||||||||
