Common Flex libraries

I’m going to add some Adobe Flex ActionScript libraries.

Open Source AS3 APIs

Advertisements

(UX) User Experience Post

I’m going to add links which pertain to (UX) User Experience and RIA. I will be adding more links since there is some good stuff.

A Flex Developer’s Guide to User Experience Work Flows and Best Practices
50 Most Usable RIAs
the Flex User Interface Discussion

Design elements and principles

Theresa Neil blog
Designing Web Interface blog
Bill Scott’s blog (Netflix)
Wireframes
Functioning Form
Info Design Patterns
Stop Design

Prototyping
Rapid Prototyping Tools

Messages and Images
CSS Message Boxes for different message types
Design

Opinion
Google not a nice place to work

Flex Tree Control using http service

I’ve been trying to get my two tree controls to work with 2 httpservices without any success since most of the examples are hard-coding the data (XML) inside mxml. Since I’m dense or whatever, I found this link which answered my problem. If I find another way to transform dynamic data I will post it as a different example. A co-worker of mine gave me the 2nd example.

EXAMPLE #1

answer link : example1

cfm page containing the following xml data :
====================================
<?xml version=”1.0″ encoding=”UTF-8″ ?>
<rows><node1 text=’Test last name,first middle initial’ data=’E020094 ;ZZ;ZZ;ZZ’ >
<node2 text=’tab1′ data=’E020094 ; 1;ZZ;ZZ’ >
<leaf text=’panel 1′ data=’E020094; 1;1;1′ />
</node2>
</node1>
</rows>

ActionScript code inside flex
====================================
// show errors from server
public function handleFault(event:FaultEvent,a_descr:String):void {

Alert.show(event.fault.faultString + ” ” + a_descr, “Error”);
} // end of handle fault…

flex mxml
====================================
<mx:HTTPService
id=”idloadtree2″ resultFormat=”e4x”
url=”https://server_name/flex/get_tree.cfm&#8221;
useProxy=”false” showBusyCursor=”true”
fault=”handleFault(event,’Get Tree 2′);” />

<mx:Tree id=”idtree2″ name=”Tree” height=”100%” width=”100%”
selectionColor=”#ffff33″ textSelectedColor=”#ff3333″
dataProvider=”{idloadtree2.lastResult}” labelField=”@text”
showRoot=”false” >

EXAMPLE #2

cfm page
================================================================
<cfsetting showdebugoutput=”no”>

<cfxml variable=”myxml”>
<root label=”root node”>
<branch label=”top level branch A”>
<leaf label=”leaf a” />
<leaf label=”leaf b” />
<branch label=”second level branch A-A”>
<leaf label=”leaf c” />
<leaf label=”leaf d” />
</branch>
</branch>
<branch label=”top level branch B”>
<leaf label=”leaf e” />
</branch>
</root>
</cfxml>
<cfoutput>#tostring(myxml)#</cfoutput>

 

Flex code
=================================================================
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”vertical” creationComplete=”init()”>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;

// second tree’s data
[Bindable] private var _myTreeCFM:XML;
// init function to get data from cfm page
private function init():void
{
getXML.send();
}
// when data comes back, it is XML, assign it to the variable
private function resultHandlerXML(e:ResultEvent):void
{
_myTreeCFM = e.result as XML;

}
// right like there will be any errors
private function faultHandler(e:FaultEvent):void
{
Alert.show(e.message.toString());
}

]]>
</mx:Script>

<mx:Label text=”CFM data” fontSize=”20″ fontWeight=”bold” color=”#FFFFFF”/>

<!– tree with cfm data –>
<mx:Tree id=”example_cfm”
labelField=”@label”
showRoot=”false”
dataProvider=”{_myTreeCFM}”
width=”400″ height=”300″ />

<!– get data from server –>
<mx:HTTPService id=”getXML”
url=”getXML.cfm”
resultFormat=”e4x”
result=”resultHandlerXML(event)”
fault=”faultHandler(event)”
showBusyCursor=”true” />
</mx:Application>