Flash_and_Flex_03_2009

ActionScript Development

• Create:

• MainView.mxml , see (Listing 11) • FlexContacts.mxml , see (Listing 12). • Discuss – View

These events can come from any interaction that the developer chooses such as button clicks, component initiation, drag-n-drop, mouse clicks, etc. These events get dispatched via the dispatch () method of the Flex framework; once this event is dispatched the controller catches that event and then maps it to the correct command, executing that action. Inside of LoginForm.mxml – You can see that the view has no idea what happens when the event is dispatched, or what is suppose to happen, all it knows what to do is to populate a user value object, with a simple username and password, and dispatch a event. This is an excellent example of separating the business logic from the view logic of the application. Inside of ContactsList.mxml – You can also see that once again, the view is doing nothing about how the application is going to work; all the view is doing is displaying data to the user. This is another great example of separation from model, view, and controller. The view just references the model, and dispatches events. And that is all that the view knows about. Inside of MainView.mxml – You bring the two components LoginForm.mxml and ContactsList.mxml together inside of this component; this is the top-level component that will be the holder of the applications views. There is a view stack inside of the MainView.mxml component that is binding to the current workflow state of the application. This provides full control over what part of the application is visible, and what part is accessible to the current user. If the user was to logout, changing what the user sees is easy as changing the workflow state variable inside of the model. Keeping everything in sync and separated from each other. Inside of FlexContacts.mxml – You bring in the service locator, the front controller, and the main view. Keeping only one instance of each item makes your application follow the standards of the framework, as well as keeping your applications architecture ready for any future enhancements it may need in the future.

• LoginForm.mxml , see (Listing 9). • ContactsList.mxml , see (Listing 10).

Listing 11. MainView.mxm

width="100%" height="100%" styleName="padding" xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:view="com.jonniespratley.flexcontacts.view.*" xmlns:components="com.jonniespratley.flexcontacts.view.components.*">

import com.jonniespratley.flexcontacts.events.LogoutEvent; import com.jonniespratley.flexcontacts.model.FlexContactsModelLocat or; [Bindable] private var model:FlexContactsModelLocator = FlexContacts ModelLocator.getInstance(); private function logout():void { var evt:LogoutEvent = new LogoutEvent(); evt.dispatch(); } ]]>

Listing 12 FlexContacts.mxm

xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:business="com.jonniespratley.flexcontacts.business.*" xmlns:control="com.jonniespratley.flexcontacts.control.*" xmlns:view="com.jonniespratley.flexcontacts.view.*">

JONNIE SPRATLEY Flex Programmer from Sacramento, California Age: 22 Have been programming with Flex/ActionScript for about over two years. Enjoys a nice Caramel Frappichno and the latest Flash Flex Magazine at the local bookstore. Website: http://jonniespratley.com

03/2009 (5)

60

Made with FlippingBook HTML5