November 22, 2009

Building Flex Applications with the Swiz Framework (RIA Unleashed: Boston 2009)

Chris Scott

What is Swiz:
* Simple IoC for Flex / AS Development
* MVC Architecture
* Simple tools for common tasks: remote methods, event handling, modules

What Swiz is not:
* Excessive JEE patterns
* Boilerplate code
* Verbose XML configuration
* Overly prescriptive

Swiz uses dependency injection to satisfy component requirements.

Common dependencies:
* Remote services
* Data
* Logic
* Views

Other approaches:
* Wire ourselves
* Use Service Locators
* Verbose XML configuration

Swiz application:
* Define application it needs to use: remote objects, controllers, presentation models
* SwizConfig component in top level application
* [Autowire] metadata for dependency injection, two flavors (type reflection) or by bean name
* [Mediate(event="", properties="")]
* Swiz class called AbstractBaseController: executeServiceCall(async token, result, fault, arguments)
* Immediate run-time checking of event names
* Swiz:Prototype using class reference or name
* Module specific scope for Swiz config

Tags: flex framework riaunleashedboston2009 swiz

November 22, 2009

Building iPhone Applications with Flash CS5 (RIA Unleashed: Boston 2009)

Ryan Stewart (Using Mike Chambers' Slides)

What did Adobe announce:
Adobe Flash CS5 can create native stand-alone iPhone Applications
Flash Player 10.1 that is smartphone enabled (see keynote)
Did not announce Flash Player for Safari Mobile on iPhone.

Flash based iPhone applications exist today

LLVM (Low Level Virtual Machine) previous used in Alchemy
* Open source compiler with optimizations for any input language
* Capable of generating machine code for various targets
Front-end (SWF/ABC) -> LLVM -> Back-end (ARM)

Just like building an .air but with the descriptor capturing additional iPhone .app properties.

Flash Pro CS5 -> SWF, app.xml, app:/resources & Apple Certificates -> ADT -> .ipa

ADT does ahead of time (AoT) complication. Can't do JIT so you need to bundle code in, compiles ABC byte code from SWF and then pass through LLVM

Can use Flash Player 10.1 and Adobe AIR 2.0 APIs to get access to:
* MultiTouch
* Screen Orientation
* Media Library
* Accelerometer
* Geo-Location
* Cut, Copy, Paste
* Native rtextinput
* tel:, mailto: maps:, video:
* AMF, Flash remoting, RTMP

Can't do these
* Keyboard events outside of textfields
* Rollover or Hover
* ActionScript 1 or 2
* Loading SWF with ActionScript
* LocalConnection
* PixelBender
* H.264 and Speex codecs
* Microphone / Video Camera access

Still need to go through Apple certificate process, public key request, key signing request, application provisioning, etc.

Demo of Flash CS5 iPhone development process.

This allows you to build iPhone applications on Windows.

Current application use software rendering, latest releases are using GPU which will be part of the first public release.

Lots of tips and tricks for getting Flash based applications to perform well on an iPhone.

iPhone isn't like a Mac G5, much less power and performance so you need to think about your application development differently.

Device fonts for input fields, Helvetica is default.

Primary input is a finger (less accurate than mouse, larger hit area, no modifier keys, obscures the screen) 44x44 pixel recommended hit area size.

Text Input is the only component that launches virtual keyboard (get undo, magnifying glass, cut/copy/paste all work)

Resources
* bit.ly/arnoiphone
* bit.ly/mobilehig

Code Optimizations
* Improve performance and memory on desktop
* Some are AOT specific
* Test and profile in Flash Builder
* Grant Skinner Testing harness bit.ly/as3performance
* Reuse Instances
* Cleanup unused event listeners (especially ENTER_FRAME and Timers)
* Event dispatching can get expensive (use callbacks instead)
* Disable unused mouse events (don't use mouse_move use interval checks instead) or use mouse_down/mouse_up instead

Lots more information at www.mikechambers.com

Tags: flash iphone riaunleashedboston2009

November 22, 2009

Custom Components in Flex 3 and 4 (RIA Unleashed: Boston 2009)

Jesse Warden

Custom components are important
* Flex based application instead of just Flash
* Designers don't know flex
* Memory constrained
* Isolated and encapsulated for code reuse and testing

Types of components
* Visual
* Non-visual (data/service manipulations)
* Either Facades or Proxies

Base class versus component
* Shape (best for drawing), Bitmap (rastering), Sprite (Flex), MovieClip (Sprite with Animation)
* De-coupling through composition

Component Libraries (Take care of low level Flash player stuff for you, when to draw, event handling, etc.)
* Flash CS3 (Build quickly, small file size)
* Minimal (Keith Paters, up and running quickly, RAD)
* Flex (Enterprise quality stuff)

Custom Components
* UIComponent
* Model, View, and Controller
* Invalidation
* Embedded Content
* Styles

Place custom components in a library project so that you can see them in design view.

For complex processing use green threads.

Testing
* fluint
* FlexUnit4
* visual test harnesses (Application that just shows the component you care about)

Monkey Patching
* When the framework doesn't do what you need (like making a private variable public)
* Makes it hard to follow Flex SDK updates (copy and edit the file along with version file)

Conclusions
* Components are building blocks of Flex apps
* Extend UIComponent
* static children in createChildren()
* draw stuff in updateDisplayList()
* data setter sets internal value, and flags to redraw and call invalidate methods

Tags: flex riaunleashedboston2009

November 22, 2009

Getting the most Development from your Mac (RIA Unleashed: Boston 2009)

Shannon Hicks

Misconceptions
* You are not just using a Mac
* You are not immune

Finder
* Verbose boot using CMD-V
* Use the Go menu (Go to Folder)
* Keyboard Shortcuts (Screenshots)
* Show Hidden files
* Hidden preferences: secrets.blacktree.com
* Spotlight
* Quick View (space to preview)

Terminal
* Can be faster than the finder
* The Tab key is your friend
* Use nano for editing instead of vi
* Copy and paste work in the terminal
* Reference: ss64.com/osx/

Ports
* Most applications for Linux also exist on the Mac
* MacPorts www.macports.org (Requires Dev Tools developer.apple.com)

GUI Tools
* Console
* File Merge
* iCal/iChat

www.iotashan.com/WWSU

Backups
* Time machine is handy
* Off-site backups are critical (JungleDisk)

Passwords
* 1Password

Virtualization Software
* VMWare Fusion
* Parallels Desktop
* Sun VirtualBox (Free!)

Source Code Control
* Versions (best out there, but still bad)
* Cornerstone (okay, but still bad)
* Everyone misses TortoiseSVN

Services
* MAMP Pro
* xampp or MAMP are free alternatives
* Navicat as MySQL GUI

Editors
* TextMate

Demos
* Camtasia
* Jing (free/cheap alternative)

Tags: mac riaunleashedboston2009

November 22, 2009

How Not to Code Flex Applications (RIA Unleashed: Boston 2009)

Jeff Tapper

What is bad code
* Doesn't meet needs of the project: efficiency, maintainability, time to develop
* Code which doesn't make sense

Why do we write bad code
* Lack of time
* Lack of knowledge
* Lack of caring

What bad code leads to
* Delays
* Project failure
* Job loss
* Death

Bad code samples

If you are doing something wrong note it, add comments about why so you know you need to fix it later

Bad Code Sample 1

<mx:VBox styleName="doubleLine"/>
.doubleLine {
    background-image: Embed("/assets/images/doubleLine.png");
}

* Bad use of container (don't use if it won't have children)
* Better to replace with mx:Image

Bad Code Sample 2

<mx:List itemRenderer="see below" selectable="false">
<!-- item renderer -->
<mx:VBox>
<mx:Image/>
<mx:Label/>
</mx:VBox>

* Use of list when you don't need it's features: virtualization, selectability
* Better to replace with mx:Repeater

Bad Code Sample 3

public function setDate(u:String, p:String):void {
    username.text = u;
    password.text = p;
}
<mx:TextInput id="username"/>
<mx:TextInput id="password"/>

* Properties set on controls instead of a model (race conditions, control names, additional fields)
* Modify the model let the view follow using Bindings

Bad Code Sample 4

<mx:Form currentState="{ModelLocator.getInstance().loginState}"/>
new CarignromEvent("changeState");

* View events handled in top level component
* Local property changing local state is best unless other people need to know about it

Bad Code Sample 5

<mx:VBox borderStyle="solid" backgroundColor="" otherCSSStyles>
<mx:Text/>
</mx:VBox>

* Inappropriate container nesting (mostly for styling, not child layout, i.e. container with only one child)
* Exception is mx:ViewStack and mx:TabNavigator require children be containers
* Better to use mx:TextArea as that supports background and border styles

Bad Code Sample 6

<comp:Comp1 id="menuChooser"/>
<comp:Comp2 menuForDisplay="{menuChoose.menuGroup.selection.label}"/>

* Bad coupling (two dots and you are out)
* Better to dispatch event that others can listen for

Bad Code Sample 7

<mx:Button enabled="foo &amp;&amp; (bar != ''  || bar == '') // etc."/>

* Being too clever (hard to maintain and debug)
* Move the logic into a function

Tags: design flex riaunleashedboston2009

November 22, 2009

Social Applications with Adobe Flash Collaboration Services (RIA Unleashed: Boston 2009)

Kevin Hoyt

Flash Collaboration Services: Collaboration in the cloud
afcs.acrobat.com for an account

SDK includes samples and an AIR application with lots of goodies in it: room console, local server (for easier testing/data only).

API
* Session and authentication (0 = nothing, 100 = owner, # = application assigned)
* Shared model components
* Shared managers
* Collaboration components (whiteboard, chat, are built in)

Room Concepts
* Users and roles
* Audio/video streams (including peer-to-peer via RTMP)
* Content from collections and nodes

Authenticator
ConnectionSession (Synchronization change events used for both connected and disconnected)
ConnectSessionContainer (show hides children based on connectedness)
SharedObject (RTC specific, different than standard Flex one) Used to share data into the cloud

Build in WebCamera wrapper that broadcasts video feed.

GPS Tracker Demo using Flex for web, AIR for data acquisition, and CS4 mobile application all talking to same room.

Golden rule: Do not take action until data arrives (including echo back)

Website Watcher Demo

Technology being used for education (RosettaStone), customer service call center, anywhere where you need real-time capabilities.

Audio echo is a big issue.

Tags: cloud flex ria riaunleashedboston2009

November 22, 2009

Keynote (RIA Unleashed: Boston 2009)

Ryan Steward

Three trends being focused on right now:
Rich Internet Application which Adobe have been doing for a long time.
Cloud Computing is coming to the forefront. Have your data available anywhere. SoA is becoming the norm. Clean separation between front-end and back-end.
Desktop and Devices making the experience available everywhere.

All rolled into contextual applications. Applications where and how your users want them.

finetune.com example of contextual applications. Explore with the traditional browser, then use desktop specific application, iPhone version, and Wii specific version.

Take advantage of device specific features.
Move data and state between contexts.

New runtime support:

Flash Player 10.1 geared for smart phones. Approximate 60% memory reduction with no code changes. Better battery performance.

AIR 2.0 extending ability to leverage native code. Native installer and application support.

Code an application in Flash CS5 and run it natively on iPhone.

New tooling support:

Flash Catalyst is all about designer having more control over UI without touching Flex.

Flex 4 is all about separating logic and look. Components based on states and skinParts.

Demo of Flash Catalyst.

Adam Lehman

New IDE for ColdFusion development called ColdFusion Builder also Eclipse based. CFML support for: code assist, insight, debugging, and ORM insight. Also have code assist for: HTML, DOM, CSS, JavaScript, AJAX (jQuery, ExtJS, etc.), and SQL. Code snippets, log viewer, AIR 2.0 Support. IDE can be extended through CFML extensions. CFScript allows tag-less components. Additional ORM support for CFCs based on Hibernate with CFML languages but still have access to low level settings. Expanded access to ColdFusion services for PDF, charting, document services, etc. all exposed through a SOAP & AMF interface with granular security control.

New CF SWC that will give AS3 / MXML libraries for accessing these functions like: , , , etc. Flash Remoting is 9 times faster in the latest versions. Now has full BlazeDS integration.

ColdFusion 9 has many PDF enhancements. Headers, footers, optimize, extract text and images, and converting Word to PDF. Has support for working with spreadsheets.

Demo of ColdFusion.

Ryan Steward

New Flash Builder adds data centric design features, better refactoring, performance optimizations, network monitor, and many others.

Demo of Flash Builder.

For people at the conference you have access to AIR 2.0 bits.

Tags: air coldfusion flash flex iphone riaunleashedboston2009