RE: [flexcoders] Cairngorm - Invoking screens

Sun, 30 Jul 2006 14:51:10 -0700

Hi Guys,

Cairngorm is purposefully non-prescriptive about the way you choose to implement the view; so we would neither advocate that you do so using States, nor advocate that you don't.  This is one of our core-values in being able to call ourselves a "lightweight architecture" - that we are not enforcing upon developers the way they structure their MXML that implements the overall user-experience.
 
Typically to date, we (iteration::two / Adobe Consulting EMEA) haven't leveraged States for multi-screen Cairngorm applications, preferring instead to use States where we have transitions within a complex MXML component (which can live both within and outwith a Cairngorm application - components shouldn't depend upon Cairngorm to be reusable).
 
When you are building applicaitons with a number of different views, the decisions that you make to structure these applications are irrespective of the fact that you are or are not using Cairngorm.  I could certainly advocate best-practices in doing so - and will try and do so in a blog entry or other post - but don't be mistaken because you are using Cairngorm that there is a prescribed way for building applications with multiple or large numbers of views.  In the end, the patterns are repeatable - whether you have 1 view or 100 views bound to a model locator class, and whether you have 1 view or 100 views that are responsible in some way for notifying the controller of a user-gesture by broadcasting an event.  Make sense ?
 
I can't recall if my presentation from MAX2005 is archived online or not - but if it is, I covered this idea of architecting the view in that presentation; come to think of it, the structure of that presentation was the basis for the 6-part article on devnet, which you can find linked on www.adobe.com/go/cairngorm/
 
So you're free to build your view however you like - and leverage whatever best practices the community has to offer you. 
 
Cairngorm will form the bedrock (*) of your underlying application whatever decisions you make.
 
Best,
 
Steven
(*) Subtle Cairngorm pun in there...
 
 
Steven Webster
Practice Leader (Rich Internet Applications)
Adobe Consulting
Westpoint, 4 Redheughs Rigg, South Gyle, Edinburgh, EH12 9DQ, UK
p: +44 (0) 131 338 6108
m: +44 (0) 7917 428 947 
[EMAIL PROTECTED]

 

From: [email protected] [mailto:[EMAIL PROTECTED] On Behalf Of Mike Britton
Sent: 30 July 2006 21:30
To: [email protected]
Subject: Re: [flexcoders] Cairngorm - Invoking screens

Building a larger application involves a combination of view states
and MXML components. Take JesterXL's Amazon search example:

http://www.jessewarden.com/archives/2006/07/flex_2_webservice.html

In this example, you can see the use of view states. This is how many
"screens" can be combined into one. I definitely suggest you look at
States in the Flex help.

In the same example, a modal window is used to show debugging info.
The same technique can load in forms in the form of MXML components.
You can have a directory of forms, each one something like this:

<!-- windowView.mxml -->
<?xml version="1.0"?>
<mx:TitleWindow
showCloseButton="true" close="PopUpManager.removePopUp(this);"
creationComplete="initApp();"
xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import mx.managers.PopUpManager;

private function initApp():void {
this.title = "Job Listing";
}
private function cancel():void {
PopUpManager.removePopUp(this);

}
]]>
</mx:Script>

<mx:VBox verticalAlign="top" width="100%" height="100%"
verticalGap="10" paddingBottom="5" paddingLeft="5" paddingRight="5"
paddingTop="5" x="4" y="4">
<mx:Form width="100%" height="100%">
<mx:FormItem label="Location:">
<mx:Label text="Albany, NY" width="100%"/>
</mx:FormItem>
<mx:FormItem label="Job Type:">
<mx:Label text="Contract" width="100%"/>
</mx:FormItem>
<mx:FormItem label="URL:">
<mx:Label text="http://www.epicenterconsulting.com"
width="100%"/>
</mx:FormItem>
<mx:FormItem label="Description:">
<mx:TextArea wordWrap="true" text="dolor sit amet,
consectetuer adipiscing elit. Donec diam tortor, viverra vitae,
vestibulum in, molestie posuere, felis. Morbi posuere interdum nulla.
Aenean libero pede, pretium lacinia, consectetuer in, vehicula non,
enim. Morbi at enim.." width="200" height="200"/>
</mx:FormItem>
<mx:FormItem label="Apply:">
<mx:Label htmlText="dolor sit amet,
[EMAIL PROTECTED]ulting.com" width="100%"/>
</mx:FormItem>
</mx:Form>
</mx:VBox>
</mx:TitleWindow>

Then you can invoke this window from your main.mxml:

private function showModalWindow():void {
myModal = TitleWindow(PopUpManager.createPopUp(this, windowView, true));
myModal.width = 440;
myModal.height = 465;
myModal.x = 0;
myModal.y = 0;
myModal.addEventListener("mouseDownOutside", enableAll);
}

Combine this technique with States and a TabNavigator and you have a
lot of room to build a large app. I'm in the same boat as you,
learning Cairngorm by examples and by reading the list and
experimenting. The learning curve is fairly steep, and without the
help of examples, putting the pieces together can be a slow process.
You aren't alone, but it can feel like it sometimes. As I learn new
stuff I'll be sure to post tutes on my blog for people to check out.
I also recommend checking all the examples at Adobe -- Mike Potter's,
etc -- they are extremely helpful.

hth,

Mike Britton

__._,_.___

--
Flexcoders Mailing List
FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt
Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com




SPONSORED LINKS
Web site design development Computer software development Software design and development
Macromedia flex Software development best practice

YAHOO! GROUPS LINKS



__,_._,___

Reply via email to