Flex and flash are two heads better than one l.jpg
Advertisement
This presentation is the property of its rightful owner.
1 / 28

Flex and Flash : Are Two Heads Better Than One? PowerPoint PPT Presentation

Flex and Flash : Are Two Heads Better Than One? Speaker Information Windows-based Developer - Since ‘85 Senior ColdFusion MX Developer - Since ‘99 Technical Instructor - Since ‘85 Flash Developer - Since ’99 Flex Developer – Since ’05 [email protected] http://therush.wordpress.com

Related searches for Flex and Flash : Are Two Heads Better Than One?

Download Presentation

Flex and Flash : Are Two Heads Better Than One?

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Flex and flash are two heads better than one l.jpg

Flex and Flash:Are Two Heads Better Than One?


Speaker information l.jpg

Speaker Information

  • Windows-based Developer - Since ‘85

  • Senior ColdFusion MX Developer - Since ‘99

  • Technical Instructor - Since ‘85

  • Flash Developer - Since ’99

  • Flex Developer – Since ’05

    [email protected]

    http://therush.wordpress.com


Presentation agenda l.jpg

Presentation Agenda

  • Advantages of Flash and Flex

  • Flash and Flex Audience

  • Producing the Same Results (kinda)

  • Everything Old is New Again

  • Using LocalConnection

  • Using ExternalInterface

  • Other Considerations


Advantages flash l.jpg

AdvantagesFlash

  • Longevity

  • Thousands of Flash related resources

  • Thousands of community created components and samples

  • Great authoring tool for designers

  • Visual drawing environment


Advantages flex l.jpg

AdvantagesFlex

  • Improved ASv3 architecture

  • Improved components

  • Developer-centric Eclipse based development environment

  • Predefined effects and transitions


The flash audience l.jpg

The Flash Audience

Timelines

Layers

Stage

Designer

Canvas

MovieClip


The flex audience l.jpg

The Flex Audience

Actionscript

Tags

Data Services

Developer

Perspectives

Source View


Working together l.jpg

Working Together


Producing the same results kinda l.jpg

Producing the Same Results (kinda)

Version 9 only

Version 8 and below


In the bad ol e days l.jpg

In the “Bad Ol’e Days” …

  • Used getUrl() and fscommand() to communicate from Flash to JavaScript.

  • Used setVariable() to communicate from JavaScript to Flash.

  • fscommand() used VBScript that could conflict with other VBScript on the page and can only pass one string parameter.


Everything old is new again l.jpg

Everything Old is New Again

LocalConnection

  • Invoke methods between Flash apps/movies

  • Pass data between Flash apps/movies

ExternalInterface


Using localconnection why use localconnection l.jpg

Using LocalConnectionWhy use LocalConnection?

  • Supported by Flash Player version 6 and above

  • Uses a one-way “Channel” to communicate

  • Supports asynchronous communication

  • Pass multiple variables


Using localconnection how does it work step 1 l.jpg

Using LocalConnectionHow does it work? Step 1

SENDER:

  • Create a new LocalConnection object (1)

  • Use send() method of the localconnection object (2)

1) myLC:LocalConnection = new LocalConnection();

2) myLC.send(swf1, myName, name_txt.text);


Using localconnection how does it work step 2 l.jpg

Using LocalConnectionHow does it work? Step 2

RECIEVER:

  • Create a new LocalConnection object (1)

  • Prepare to receive commands (2)

  • Define function that will be called by SENDER (3)

1) myLC:LocalConnection = new LocalConnection();

2) myLC.connect(swf1);

3) myLC.myName = function(param) {

reciever_txt.text = param;

}


Using localconnection how does it work l.jpg

Using LocalConnectionHow does it work?

setClock

clockStopped

Provides direct one-way communication between swfs


Using localconnection can you show us an example l.jpg

Using LocalConnectionCan you show us an example?

The Resort Tracker 2000 v.5


Using exteranalinterface why use externalinterface l.jpg

Using ExteranalInterfaceWhy use ExternalInterface?

  • Supports synchronous communication

  • Easier to implement

  • Uses JavaScript as a “proxy” between

  • Pass multiple variables

  • Supports multiple data types

Note: Only supported by Flash Player version 8 above


Using externalinterface how does this work step 1 l.jpg

Using ExternalInterfaceHow does this work? Step 1

SEND TO JS:

  • Import ExternalInterface class

  • Use call() method of ExternalInterface object

Import flash.external.ExternalInterface

ExternalInterface .call(“alert”, “Hello from Flash”);


Using externalinterface how does this work step 2 l.jpg

Using ExternalInterfaceHow does this work? Step 2

RECIEVE FROM JS:

  • Import ExternalInterface class

  • Use addCallBack() method of ExternalInterface object

Import flash.external.ExternalInterface

ExternalInterface.addCallBack(“tweenMe”, this, tweenMe);


Using externalinterface how does this work step 3 l.jpg

Using ExternalInterfaceHow does this work? Step 3

SEND TO FLASH:

  • Get reference to Flash object

  • Use object reference to call Flash function

// for IE use

myFlash = window[“flashmovie”];

// otherwise use

myFlash = document[“flashmovie”];

myFlash.tweenMe(“Hello from JS”)


Using externalinterface how does this work l.jpg

Using ExternalInterfaceHow does this work?

setClock

clockStopped


Using externalinterface got another example l.jpg

Using ExternalInterface Got another example?

The African Country Guide ver .5


Other considerations l.jpg

Other Considerations

  • Flash 8 Security Model

  • Frame Rate


Other considerations flash 8 security model l.jpg

Other ConsiderationsFlash 8 Security Model

  • By default, local SWFs can no longer contact the Internet, perform HTTP communication, or communicate with local HTML files.

  • SWF and HTML content from non-local URLs may no longer load any content (SWF, HTML, PNG, and so on) from local paths.

  • Use localConnection.allowDomain to permit cross-domain scripting.

  • Use a crossdomain.xml policy file to permit cross-scripting operations.


Other considerations flash 8 security model cont l.jpg

Other ConsiderationsFlash 8 Security Model (cont.)

  • Use allowScriptAccess to handle communication with Javascript.

  • allowScriptAccess

    • Never:outbound scripting fails

    • Always:outbound scripting succeeds (default)

    • sameDomain:outbound scripting allowed only if swf resides in same domain (default in FP 8+)


Other considerations frame rate l.jpg

Other ConsiderationsFrame Rate

  • Flex’s default frame rate is 24

  • Adjust your Flash movie accordingly

  • You can reset the default Flex frame rate

  • Open Project Properties >> Flex Compiler

  • Add the following into "Additional compiler arguments:" in single line:

    -default-frame-rate int

Note: The maximum frame rate is limited to machine performance, if this value is set too high the player will simply run at the fastest rate that it can on the given machine.


Additional resources l.jpg

Additional Resources

  • http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_16243

  • http://livedocs.macromedia.com/flex/2/langref/flash/net/LocalConnection.html

  • http://www.adobe.com/devnet/flash/articles/external_interface_05.html

  • http://livedocs.macromedia.com/flex/2/langref/flash/external/ExternalInterface.html

  • http://therush.wordpress.com


Additional resources28 l.jpg

Additional Resources

Flash / JavaScript Integration Kit (Beta)

http://weblogs.macromedia.com/flashjavascript/

Flex-Ajax Bridge

http://labs.adobe.com/wiki/index.php/Flex_Framework:FABridge


  • Login