Compilations
Flex.org’s Showcase Page
Favourites

· Adobe :: Dashboard :: Sales data analysis :: More info :: Note that this RIA is a collaborative application (many users, any user can make choices, all users see results) but Adobe has disabled this functionality for this demo
· Adobe :: FlexStore :: More info
· Amit Gupta :: E41ST :: Amazon/Library mashup :: More info
· Christophe Coenraets :: Flex and JMS: Portfolio Viewer :: More info
· Christophe Coenraets :: Google Maps Collaboration using Flex, Flash Media Server and Ajax
· David Brannan :: Exam Professor
· Ely Greenfield :: FishEye Component :: More info
· Ely Greenfield :: Interactive Bubble Chart :: More info
· EyeJot :: Video Messaging Service :: More info
· Fidelity :: Trading Knowledge Center :: More info
· Flip.com :: A social networking site that allows users to create “personal pages where you can post pictures, upload video or audio and even draw or write stuff”
· FTDG & StarNetSys :: Dow Jones Averages Interactive Learning Center
· Joe Berkovitz :: ReviewTube :: YouTube videos with time-bases captions – “a graffiti wall for YouTube” :: More info :: Source code
· Joh. Enschedé :: Amsterdam Airport Noise Monitoring System :: More info
· Kevin Kazmierczak :: SQLAdmin :: Open source on SourceForge
· MediaCatalyst :: Sony Ericsson :: Phone Store
· Mindomo :: Mind Mapping
· Nahuel Forenda :: HomeLocator :: More info
· Nationwide :: Savings & Investment Navigator
· Rick Englert :: PicFindr :: Find copyleft picts :: More info
· ScrapBlog
· Trenitalia :: Real-Time Italian Train Info
· Yahoo :: Web-based IM App
· Yahoo :: Yahoo Maps
Posted in flex ]]> http://panduramesh.wordpress.com/2008/10/25/flex-favourites-2/feed/ 0 panduramesh http://panduramesh.wordpress.com/2008/10/25/flex-coding-2/ http://panduramesh.wordpress.com/2008/10/25/flex-coding-2/#comments Sat, 25 Oct 2008 11:09:39 +0000 panduramesh http://panduramesh.wordpress.com/2008/10/25/flex-coding-2/ ]]> FLEX CODING
APIs
AS3 Library For Amazon’s S3 Service
Digg :: Flash toolkit
Ebay
Flickr
Google Analytics PHP API
Google Gears :: Also, see the Google Gears section below
Mappr
MapQuest
ODEO
Yahoo Answers
Yahoo Mail
Yahoo Maps
Yahoo Search
Yahoo Weather
YouTube
Architecture
Cliff Hall :: PureMVC
Joe Berkovitz :: An architectural blueprint for Flex applications
Sean Levy :: Complete component communication solution for Flex :: Using ALON (Autonomous Linking Object Network Design Pattern)
Automated Code Generation
See the Automated Code Generation section on our Testing, Debugging & Agile Methods page.
Binding
Daniel Rinehart :: Programmatic Bindings
Bugs
Ralph Hauwert :: Autocomplete component memory leak
Charting Components
Adobe :: Chart data drill down examples
Doug McCune :: Why I LOVE Flex – Charting example
Coding Conventions
DClick :: Adobe Flex Coding Guidelines
Collections, Libraries & Frameworks
Adobe :: corelib :: MD5 hashing, JSON serialization, advanced string and date parsing, and more
Adobe :: Flex Cookbook beta
Adobe :: Flex Scheduling Framework
Adobe :: Quick Starts :: Great stuff
Adobe :: RSS and Atom Libraries
Danny Patterson :: AS3 Lightweight Remoting Framework :: “a simple yet robust framework for handling remoting calls”
Faranta Systems :: daoFlex :: Automated generation of Java data access code
ifbin.com
JAM :: Just ActionScript & MXML
SourceForge::FlexApps
Components
Ely Greenfield :: Some thoughts on Flex vs. HTML (or…”how I made my Flex List Images stop flickering.”)
Stephen Gilson :: Creating Resizable and Draggable Flex Components
Context Menus
Kevin Hoyt :: Context Menus Revisited
Database Connectivity
Lukasz Blachowicz :: Asql :: Actionscript MySQL Driver
Matt MacLean :: asSQL :: Actionscript MySQL Driver
Drawing Etc.
Andrew Trice :: Flex 2 BitmapData Tricks and Techniques
Andrew Trice :: Realtime Thumbnails of Flex UIComponents :: More info
Jason Hawryluk :: Primitive Explorer :: More info
Ted Patrick :: Developing in Trees :: Adding sprites to the DisplayList :: Part 1 :: Part 2
E4X
Bruce Phillips :: Filtering an XML Object In ActionScript to Create Related Combo Boxes in Flex
Mike Morearty :: Common E4X pitfalls
Events
Oliver Merk :: Flex Custom Events – Part 1
Tink :: Custom Events in AS 3.0 (don’t forget to override the clone method)
Google Gears
Google Gears :: “Three modules that address the core challenges in making web applications work offline”
LocalServer :: Cache and serve application resources (HTML, JavaScript, images, etc.) locally
Database :: Store data locally in a fully-searchable relational database
WorkerPool :: Make your web applications more responsive by performing resource-intensive operations asynchronously
http://code.google.com/p/as3mapprlib Christophe Coenraets :: Flex-based SQLAdmin for Google Gears
Mapping
Alex Styler :: Flex, Yahoo! Maps & RSS Feeds
Menus
David Coletta :: Accelorator Decorations on Menus
Modularization, RSLs, Etc.
James Ward :: Faster Flex Applications: Shrink Your RSLs
Performance
James Ward :: Ajax and Flex Data Loading Benchmarks
Mark Piller :: Flex RemoteObject vs WebService benchmark
Nico Lierman :: Flex performance component
Physics Engines
Andre Michelle
Moto Flash Physics Engine
Scope
Timothée Groleau :: Scope Chain and Memory waste in Flash MX
Uncategorized Code Examples & Tips
Alastair Dawson :: Multiple File Upload with Flash and Ruby on Rails
Andrew Trice :: Benefits of defining a custom event type for data binding :: E.g. “[Bindable(event="MyEvent")]“
Andrew Trice :: Flex Search Mashup :: Uses AJAX Bridge :: More info
Andrew Trice :: Gantt Charts in Flex DataGrids in less than 1 hour!
Angus Johnson :: Datagrid Label Function Demo
Arpit Mathur :: Showing XML structure in a Tree
Ben Clinkinbeard :: Item Renderers in DataGrids – A Primer for Predictable Behavior
Ben Clinkinbeard :: Creating truly reusable renderers with ClassFactory
Brian Deitte :: Embedding HTML in a Flex application using an IFrame
Bruce Phillips :: Creating A Flex ButtonBar That Displays Tool Tips
Bruce Phillips :: Creating Web Page and Email Links In A Flex Application
Bruce Phillips :: Dynamically Create CheckBoxes, Their Labels, And Their Select Values In Flex
Bruce Phillips :: Example Of Using Modules In Flex 2.01
Bruce Phillips :: How To Create A FlexBook Component That Includes Content Pulled From A Database
Bruce Phillips :: How To Get Text To Wrap Correctly In A Flex DataGrid Column
Bruce Phillips :: Sort An ArrayCollection By Multiple Fields and Filter An ArrayCollection By Multiple Fields In Flex
Bruce Phillips :: Using the TileList Control :: Dragging Items From a TileList Control To A Container
Christophe Coenraets :: Building Collaborative Applications with Flex Data Services and Flash Media Server
Daniel Wanja :: Flex introspection API: describeType(value:*):XML :: Find a class’s superclass, methods, etc.
Darron Schall :: Convert Generic Objects into Class Instances
Dave Rangel :: A Form Validation Tool in Flex 2
David Coletta :: Call validateNow() after setting enabled to false
Derrick Grigg :: DataGrid ItemRenderer with filtering
Doug McCune :: Multi-line strings in Actionscript 3
Ely Greenfield :: Howdjoo do that? An interactive walkthrough of the DisplayShelf 3D tilting effect
Ely Greenfield :: Using Custom Data-Based Renderers in Charts
Ely Greenfield :: Dashed Lines
Fain, Rasputnis & Tartakovsky :: Advanced DataGrid Code Samples
Jesse Warden :: Checkbox Item Renderer :: Discusses how to catch their bubbling events
Joe Berkovitz :: An architectural blueprint for Flex applications
Joe Rinehart :: Semantically encapsulating effect sequences in Flex 2
Kelly Brown :: Accessing the Local File System with Flex
Mark Piller :: Mixing HTML and Flex using IFrame
Michael Labriolla :: Displaying XML-based DataGrids using dynamic E4X expressions
Michael Ramirez :: Flex DataGrid Paging Example with Source
Michael Ritchie :: Adding Drag-and-Drop & Drop Deny to DataGrid
Mike Morearty :: Transparent Flex Apps
Mike Teoti :: Flex 2 :: Tree :: Walking the Tree Method :: “the dataProvider rocks”
Paul Williams :: The World’s Smallest Tag? ::
Peter Elst :: Working with mx.core.Repeater
Peter Ent :: Coloring the Background of [DataGrid] Cells
Peter Ent :: Data Binding Tip :: “A simple way to enable/disable controls based on selection”
Peter Ent :: Filtering Collections
Peter Ent :: Tree Drag and Drop
Sergey Kovalyov :: Text control with truncateToFit property support
Renaun Erickson :: Flex 2 and Red 5 Chat Example :: Live example
Ted Patrick :: Code-Behind in Flex 2
Tink :: Drag & Drop
Tom Cornilliac :: Flex Builder Tip: Saving the generated AS3 code :: Use the compilers -keep option, examine your MXML’s AS3 code conversion!
Tracy Spratt :: Add components programmatically with addChild()
Tracy Spratt :: Hide-Show DataGrid Columns programmatically
Tracy Spratt :: Dynamic DataGrid columns
Victor Rubba :: DataGrid Search with Highlighted Matches
Yakov Fain :: Event-driven programming in Flex with Custom Events
Posted in flex ]]> http://panduramesh.wordpress.com/2008/10/25/flex-coding-2/feed/ 2 panduramesh http://panduramesh.wordpress.com/2008/10/19/displaying-charts-in-advanceddatagrid/ http://panduramesh.wordpress.com/2008/10/19/displaying-charts-in-advanceddatagrid/#comments Sun, 19 Oct 2008 12:43:21 +0000 panduramesh http://panduramesh.wordpress.com/?p=158 ]]>

Using charts as itemRenderers in DG and ADG is easy. Find the sample files here The sample uses a LineChart as itemRenderer for the third column and a PieChart in the child area. The column-spanning option available through RendererProviders is used to make the PieChart occupy the whole row. The sample shows use of HierarchicalData but even without that All chart types can be used as itemRenderes.

Understand the design challenges that Cairngorm addresses best, and the types of projects for which it is an appropriate skeleton for development.

I am trying to learn Cairngorm and am finding the resources severely lacking. I thought I’d document my experiences trying to learn Cairngorm with hopes someone will be able to tread the pass more easily than I.

Where do you go.

First off, where do you go to start reading about Cairngorm? Well, you can start at the Adobe Labs page on the framework. That will most likely lead you to Steven Webster’s 6 part series on developing Cairngorm apps. Let’s start with that series of articles.

Part 1 talks about frameworks in general, and gives a history of Cairngorm. It is a nice introduction and an easy read, but was unfortunately lacking any implementation details. It’s not a complete waste of time if you’re unfamiliar with frameworks.

Value Objects.

The second article starts to get a little meatier. How do you maintain state in a Rich Internet Application built with Flex? In a web app, you are trying to force state on a stateless system by using URL variables or cookies. With Flex, you are not dealing with a stateless client. The flash player can deal with state.

Steven comes up with an interesting way to describe state in an RIA. The state is the model (of Model View Controller). When you’re accessing a shopping cart, or user object you shouldn’t be accessing them stored on a web server somewhere. You should access this data stored as part of the client.

The next part of the article talks about the Value Object. A Value Object is a design pattern, where the object represents a single entity. That entity may be a product, a person, a company, an address, or anything you need. Steven says that these objects are now called Data Transfer Objects. Conceptually, they sound exactly like what most CF Developers call a Bean. You can check out this Blog entry for more info on Value Objects, Coldfusion, and Flex.

With Cairngorm you can use Value Objects to help easily keep the state on your server in sync with the state on your client. I can understand that, although the article doesn’t go into enough code detail for me to understand how to implement this.

Model Locator.

The second part of the article ends off by explaining the model locator pattern. This is a brand new pattern designed strictly for Flex RIA apps. Steven explains that model locators don’t apply to traditional web development or Java Development.

One powerful feature of Flex is data binding. When data changes, so does the display that uses the data. I got to admit it’s pretty powerful. When developing Flex with lots of components and relationships between the components, you have a problem of how to find the component that needs the data. You could start at the top level application and work down to the data, like this:

That will get the productGrid values from the textualList component which is in the storeView component. It can get to be pretty tedious. I can honestly say I’ve never used this approach in a Flex app, and I’m not sorry about it.

An alternate method is that you could pass lots of parameters in and out of your component. In the example above, the productList value would be a property in textualList, which would then be a property in storeView. You do a lot of coding to specify the properties and components. It seems like a waste of time since many components will do nothing other define the property and pass it’s value up or down. Unfortunately, this is a mistake I’ve made.

The model locator design pattern addresses the problem of how to access disparate data buried within different components that don’t have an easy link between them. It is a single component that components use to access data. For all data and binding there is a single entry point across your application. This does address the two problems above.

The model locator component of Cairngorm is implemented as a Singleton. A Singleton is a design pattern, where only a single instance of the object is created for your application.

Summary So, after reading the first two parts of this article, I can tell you that Cairngorm uses Value Objects and a Model Locator. I like both of those ideas, although do not yet understand how I put this knowledge into practice when building a Flex application. I will continue to write more as I learn more.
Posted in flex ]]> http://panduramesh.wordpress.com/2008/10/03/cairngrom/feed/ 0 panduramesh http://panduramesh.wordpress.com/2008/10/03/learning-cairngorm-part-5/ http://panduramesh.wordpress.com/2008/10/03/learning-cairngorm-part-5/#comments Fri, 03 Oct 2008 07:50:22 +0000 panduramesh http://panduramesh.wordpress.com/?p=94 ]]> In the fifth part of this series on Cairngorm, I’m going to talk about how Cairngorm handles remote data calls. This, once again, is following along with the fifth part of Steven Webster’s Adobe Center Articles.

A Recap

In the last article I wrote in this series I spoke about how Cairngorm handles user gestures. A user gesture is anything that the user will do to interact with your application. This is the general procedure:

• Dispatch a custom event (AKA User Gesture).
• The Event goes to a controller and figures out what command to execute.
• Execute the Command
• Command updates Model data, which updates the user views

We are missing is getting live data, probably from a database, using some intermediary software like ColdFusion (my choice) or PHP. (Or Java or Ruby, or .NET, or whatever).

3 Types of Services, one Location

There are three ways to get data from within Flex. You can use an HTTPService, a WebService, or a RemoteObject. Based on their names, it is probably pretty obvious what each tag does (Right?). My preferred method is RemoteObject because it ties into ColdFusion so nicely, but I’ve also done some work with HTTPService for integrating with remote systems beyond my control. Cairngorm uses a ServiceLocator to help you find services. This is, conceptually, not much different than a Model Locator. It is a singleton class that allows you to store your services in a central location, and access them anywhere from the application. This would be a sample ServiceLocator:

I have three (fake) services, one of each type. If you’ve used any of these tags before, you’ll notice that I left out the ‘result’ and ‘fault’ events. Result and Fault methods are known as responder methods. They get called when the remote service sends data back to Flex. Cairngorm puts the responder methods in the Command, and calls the Service using a Delegate.

Delegates

A Delegate is a class that does nothing but call the service. Here is a simple example:

Cairngorm keeps the delegates and the services file in a business folder. I guess this ties into “Business Logic”. Really this is just a layer to reach the backend business logic, though. I don’t do a lot of work in the delegates. They just make calls. To me it makes sense to do data parsing in the responder, and as such in the command. ( Although this approach has been contested ). We can modify our command, Part 4, to handle make the delegate call.

The first change is that the code implements an IResponder interface in addition to the ICommand. The second change is that the execute method actually creates an instance of the delegate (passing in the instance of this object), and calls a method on the delegate. This modified class also includes a result event and a fault event. These are the responder methods called by the service when results are returned. Most likely the result event will be performing some actions on the ModelLocator, which will change some other aspect of the app via data binding.

A recap of Today

So, our updated process is this:

• Dispatch a custom event (AKA User Gesture).
• The Event goes to a controller and figures out what command to execute.
• Execute the Command
• Command creates instance of Delegate.
• Delegate gets Service Object from Service Locator
• Delegate calls the Service Object Method
• Remote Service does stuff and sends data back to the respond methods in the Command
• Command updates Model data, which updates the user views