Ffd 05 2012

��
��
��
��
��
��
��
��
��
��
��

��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��
��

4
05/2012 (35)
Dear Readers,
This month we want to share an issue devoted to Flex 4. There is a big portion of fresh articles waiting for you!
As you will see there is a lot of helpful information. You can read for example about Flash Professional CS6,
Flex & FXG, Flex & PHP and many more. After reading this issue you will be richer in knowledge and new
skills.
I’m sure that everyone will find something for himself/herself!
Let’s start from the article about ‘Generating Sprite Sheets’ by Christopher Caleb.
As he wrote, Flash Professional CS6 makes it incredibly easy to create sprite sheets while using the
design and animation workflow that you’re already familiar with. With very little effort you’re able to create a
compact sprite sheet that can be used in ActionScript projects or even other languages such as Java Script
and Objective-C.
Ralph Hauwert in his article describes Flash Premium Features and Unity Content.
Adobe has recently announced “Premium Features for Gaming” for the Flash Platform which initially
includes only Fast Memory Opcodes and Stage3D when used simultaneously. They have also announced a
required 9% revenue share on Premium Features Licensed content that exceeds $50k in revenue.
The next articles written by Harit Kothari is mainly about FXG (SVG implementation). It is not really a
replacement for all scenarios. It isn’t really replacement to bitmapdata. Likewise skinned UIComponent, you
really do not need bitmapdata for its weight and scalability issues. SVG manipulation is much easier and clean
in terms of rendering, and that’s why Flex component, with its FXG skin looks beautiful in any size!
From the article written by Sandeep Sharma you can learn that HTML5 fight with Flex is on: Flex
SDK and Compiler open sourced MPL license, HTML 5 open standard WHATWG license, new 3d –
graphics,(transformation scene, camera, lighting, change pixel data, effects) Real-time connection(HTML5
has websocket vs Flex has flash.net.socket), Drag and Drop (drag and drop across application, cross
document, clipboard) with API’s flash. desktop.clipboard, Events.NativeDragevents, Flash.desktop.Transferabl
eData Vs HTML5 DataTransfer and DragEvent.
However, the article about Flash & PHP by Jigar Oza talks that as per the speed of the response is
concerned, Remoting is the fastest method followed by HTTP service and Web Service. So we can say that
Web Service is the slowest method for Flex and PHP connectivity.
In the last but not least article, Daniel Abu wrote that he is still going to use Flex in the next couple of years
as it allows him to create enterprise level desktop and mobile applications in a shorter time than any existing
technology.
Nevertheless, he is going to continue expanding his knowledge with new HTML5 frameworks as they
come out.
Find out something for yourself and enjoy reading!
Paulina Śliwka & FFD Team
Managing: Paulina Śliwka
paulina.sliwka@software.com.pl
Proofreaders: Patrick French
Betatesters: r0mk1n.work@gmail.com
Marketing Director: Paulina Śliwka
paulina.sliwka@software.com.pl
Editor in Chief: Ewa Dudzic
DTP Team: Ireneusz Pogroszewski
Art Director: Ireneusz Pogroszewski
ireneusz.pogroszewski@software.com.pl
Senior Consultant/Publisher: Paweł Marciniak
Flex/ActionScript 101 Section Editor: Marc Pires marcpiresrj@gmail.com
iPhone Development Section Editor: Ryan D’Agostino
Games Section Editor: Chris Hughes
Contributing Editors: Pedro de La Rocque, Ali Raza, Csomák Gábor
Publisher: Software Press Sp. z o.o. SK
ul. Bokserska 1 02-682 Warszawa Poland Worldwide Publishing
If you are interested in cooperating with us, please contact us by e-mail:
cooperation@software.com.pl
Whilst every effort has been made to ensure the high quality of the magazine,
the editors make no warranty, express or implied, concerning the results of
content usage.
All trade marks presented in the magazine were used only for informative
purposes.
All rights to trade marks presented in the magazine are reserved by the
companies which own them.
Thanks to the most active and helping beta testers:
Russell TangChoon, Lee Graham, Jassa Amir Lang, Ed Werzyn, Yann Smith-
Kielland, Justus, Csomák Gábor, Kevin Martin, Charles Wong, Ali Raza, Almog
Koren, Izcoatl Armando Estanol Fuentes, Lionel Low, Michael J. Iriarte, Paula
R. Mould, Rosarin Adulseranee, Sidney de Koning
To create graphs and diagrams we used program by
company.
Mathematical formulas created by Design Science MathType™
ATTENTION!
Distributing current or past issues of this magazine – without permission of the
publisher – is harmful activity and will result in judicial liability.
DISCLAIMER!
The techniques described in our articles may only be used in private, local networks. The edi-
tors hold no responsibility for misuse of the presented techniques or consequent data loss.
Editor’s Note

5
05/2011 (35)
CONTENTS
Creating Animations
06 Generating Sprite Sheets in Flash Professional
CS6
BY CHRISTOPHER CALEB
The domination of mobile devices and tablets has
brought about new challenges for developers and
designers. For animation, bitmaps are now preferred
above vector graphics, which typically require more
CPU resources. To improve the development workflow
and to maximize performance, bitmap sequences are
often packed into what is called a Sprite Sheet before
being used.
Unity Development Platform
14 Unity: Making (Flash) 3D Game Development
Easy and Fun
BY RALPH HAUWERT
As was revealed last year, and has been confirmed
again by Adobe in March, the list will be extended with
Flash, which carries an incredibly high global install
count. This is important to Unity Technologies as a
company that can offer its development community
another amazing option to be successful with the Flash
Platform.
Flex 4 and FXG
22 Flex 4 and FXG
BY HARIT KOTHARI
Flex application without real UI asset is like an amazing
structure of building, without walls and furnished box!
The core challenge is balancing UI and functionality. If
you provide rich UI, but weak functionality, it doesn’t
sustain long. In reverse, if you provide expected
functionality, but dull or default UI, it may give kind of
non touching feeling to user. Now the problem starts,
you provide good functionality, and equally good UI,
the application gives wow effect in demo, but in reality,
it slows down and consumes too much memory,
rendering being one of costly process!
Flex 4
28 Future of Flex & Flash : Gamification of ERP
enterprise software, Augmented Reality on
mobile apps, ipTV
BY SANDEEP SHARMA
Adobe outdoing competition for many years now has
system in place for bringing future like IPTV (http://
blogs.adobe.com/flashplatform/tag/iptv), mobile/tablet
OS interfaces,photo editorslike photoshop, Word
editors like Acrobat reader with compressed storage.
Adobe has company which have been working ahead
of time many years in many technology are like Acrobat
reader, Photoshop with image processing algorithm
implementations for naive users, for online picture
editor for image enhancements using image processing
algorithms (http://pixlr.com/editor/), Flex for AJAX/RIA.
Flex and PHP
32 Different ways of connecting Flex to PHP
BY JIGAR OZA
Flex as its name suggests is very flexible technology
framework. It can connect to almost all server side and
scripting languages to connect to database and do other
server stuffs. As it can connect to almost all languages,
it can be hosted on all kinds of server platforms.
The Future of Flex
34 What’s next for Flex? Will open sourcing it
breathe new life into it or has it been “left out to
die”?
BY DANIEL ABU
November 2011 will be a month long remembered
by Flash developers, Apart from announcing the
discontinuation of the Flash Player browser
plugin development for mobile devices, Adobe
announced its intention to donate the Flex
SDK to the Apache Software Foundation.
While the former, although perceived
by the tech community as the
demise of Flash, was seen by
many Flash developers as
a better use of Adobe
resources.

05/2012 (35)6
CREATING ANIMATIONS
T
he domination of mobile devices and tablets has
brought about new challenges for developers
and designers. For animation, bitmaps are now
preferred above vector graphics, which typically require
more CPU resources. To improve the development
workflow and to maximize performance, bitmap
sequences are often packed into what is called a Sprite
Sheet before being used.
One of the great new features of Flash Professional
CS6 is the ability to export your timeline animations
to a sprite sheet. Not only can sprite sheets be used
in Flash-based projects, they can also be applied to
a multitude of other technologies and frameworks.
Essentially, you can continue to use Flash Professional
as your animation tool, regardless of the development
language your project is targeting.
This tutorial will show you how Flash Professional
CS6 can be used to generate a sprite sheet from
several movie clip animations.
Getting Started
You’ll need Flash Professional CS6, a trial version
of which can be downloaded from www.adobe.com/
downloads.
For this tutorial, a FLA containing some animation has
already been prepared for you to work with. Download
it from www.yeahbutisitflash.com/downloads/sprite-
sheets-cs6-tut/monkey.fla and open it within Flash
Professional CS6.
Launching the Sprite Sheet Generator
Take a look at the FLA’s Library panel (Figure 1). There
you will see three movie clips named Dazed, Jump, and
Panic respectively. Collectively they represent a monkey
in various animation states for a fictional game.
Double-click the Jump movie clip to move into its
timeline. You’ll see that this particular clip is animated
Generating Sprite
Sheets
in Flash Professional CS6
Learn how to create and export a sprite sheet using Flash
Professional CS6.
What you will learn…
• How to place timeline animations within a sprite sheet
• How to manage the animations that appear within your sprite
sheet
• How to optimize the layout of a sprite sheet
What you should know…
• You should be comfortable working with Flash Professional
Figure 1. Movie clips within the library

Generating Sprite Sheets in Flash Professional CS6
05/2012 (35) 7
across three frames (Figure 2) and that the monkey is
built entirely from vector shapes. The other two movie
clips are constructed in a similar manner. Although
we’ll be exporting all the animation frames as bitmaps,
you’re still free to create your artwork using Flash
Professional’s familiar vector drawing tools.
When you’re generating a sprite sheet you need to
select a collection of clips whose frames you’d like
added to the sheet. Let’s add all three of our movie
clips to a sprite sheet. To do this, first click on the Dazed
movie clip within the library. Now hold the shift key
and click on the Panic movie clip. With all three clips
selected, right-click any of the clips from the library
and select Generate Sprite Sheet (Figure 3) from the
context menu.
Your sprite sheet will be generated and the Generate
Sprite Sheet panel will appear.
Viewing your Sprite Sheet
Within the panel you’ll be able to see the sprite sheet
that has been generated. It will contain a bitmap
representation of each frame of animation from
your three movie clips (Figure 4). Directly above the
sprite sheet are two tabs named Sprite Sheet and
Preview. For the time being, leave the Sprite Sheet
tab selected.
Given the sprite sheet’s fairly large dimensions you’ll
also likely see scroll bars allowing you to pan around
the sheet. At the bottom-left of the sprite sheet you’ll
find a zoom field. Try setting the magnification to 50%
for more comfortable viewing.
Previewing Animation Sequences
Before you export your sprite sheet, it’s possible to
preview the bitmap representation of each of your
animation sequences. Take a look at the Symbol
Figure 2. The Jump movie-clip’s three frames of animation
Figure 3. Generating a sprite sheet for the selected library clips Figure 4. The Generate Sprite Sheet panel

05/2012 (35)8
CREATING ANIMATIONS
information section on the left of the panel. It lists
the names of the movie clips that were used when
generating the sprite sheet.
At present, the Dazed symbol will be highlighted.
To preview its animation simply click the Preview tab
directly above the image of your sprite sheet. You’ll
see both frames from the Dazed animation being
played quickly one after the other. At the bottom of the
preview pane is a set of controls (Figure 5) allowing
you to pause the animation and step through it frame-
by-frame. Give it a go, and again, if you’re finding the
preview area uncomfortably small then you can adjust
its magnification to suit.
It’s important to note that what you’re looking at here
is a bitmap representation of your vector animations,
and not the vectors themselves. You are seeing your
animations as they will look when taken from the
generated sprite sheet.
Now preview the Jump and the Panic animations
also. Simply click on each from the Symbol information
section and step through their animation frames.
Before moving on, it’s worth noting that you can
exclude any of the symbols from your sprite sheet by
simply unselecting them in the Symbol information
section. To see the impact of this, first click on the Sprite
Sheet tab to see your whole sprite sheet again then
uncheck the Dazed symbol’s checkbox (Figure 6) in the
list. You’re sprite sheet will be immediately regenerated
with the animation frames from the Dazed movie clip
removed. Add the Dazed symbol back into your sprite
sheet by checking its checkbox again.
Image Dimensions and Format
When a sprite sheet is generated, Flash Professional
CS6 automatically selects a suitable size based on
the animation frames being added to it. It also selects
the image format that the sprite sheet is to be saved
as.
For this tutorial’s sprite sheet, its dimensions were
set at 1024 x 2048 pixels and a 32-bit PNG format
was selected to allow transparency on each frame
of animation. Both the sprite sheet’s dimensions and
its image format can be changed from the panel’s
Sprite Sheet output section (Figure 7). Let’s see
how our sprite sheet is affected when we change its
dimensions.
Although you can change the width and height to
any arbitrary value, the Generate Sprite Sheet panel
provides a drop-down list of common sizes. Select
1024x1024 from the Image dimensions field’s drop-
down list (Figure 8). You’ll see an exclamation mark
appear next to the field indicating that there is now a
problem. If you look at the bottom of your sprite sheet
Figure 6. Omitting a library symbol’s frames from the sprite sheet
Figure 5. The animation preview pane and playback controls
Figure 7. The panel’s Sprite Sheet output section
Figure 8. Manually selecting the sprite sheet’s dimensions

��
��
��
��
��
��
��
��
��
��

05/2012 (35)10
CREATING ANIMATIONS
you’ll see that part of the final bitmap has been cropped
due to the sheet’s reduced height. Correct this by either
manually setting a larger size or by setting the Image
dimensions field to Auto size.
You may have noticed that the size automatically
chosen by Flash Professional has a significant
amount of unoccupied space near the bottom of the
sprite sheet. Why doesn’t it simply crop the sheet’s
dimensions to create a tighter fit? Well when it comes
to graphics performance, a sprite sheet’s size can be
vitally important. In order to maximize performance,
applications often store their sprite sheets on the
Graphics Processing Unit (GPU). GPUs however work
best with dimensions that are of a power of two (1, 2, 4,
8, 16, 32, 64, 128, 256, 512, 1024, 2048).
Layout Optimizations
It’s important to know the maximum width and height
supported by any hardware your application is
targeting. For example, many GPUs have a size limit of
1024x1024 pixels. If you can’t squeeze everything onto
a single sheet then you’ll need to export several sprite
sheets to hold all your graphics.
Fortunately Flash Professional provides some options
that can be used to optimize the packing of your sprite
sheet’s contents. Let’s see if we can reduce our sprite
sheet’s height from 2048 pixels to 1024 pixels without
compromising our artwork.
Within the Sprite Sheet output section you should
see a Trim checkbox. Trimming removes any
transparent pixels from the border of your sprite
sheet’s frames. Check the Trim checkbox and you
should see the sprite sheet’s layout alter slightly. If you
examine the sprite sheet’s height you’ll see that it has
been reduced to 1024 pixels. The small savings that
have been made by trimming each bitmap has allowed
Flash Professional to organize your graphics within a
1024x1024 sprite sheet instead of a 1024x2048 sheet.
This is quite a saving!
It’s also possible to remove duplicate frames from
your sprite sheet. If you look closely at your sprite
sheet you’ll notice that frames 2 and 5 are identical, as
are frames 3 and 6 (Figure 9 illustrates this by clearly
marking the duplicate frames). Essentially there’s no
need to store duplicates as you can simply use the first
copy of each frame in your animations. To remove the
duplicates, check the Stack frames checkbox directly
Figure 9. Duplicate frames within the sprite sheet
Figure 10. Removing duplicates with the Stack frames option Figure 11. Markers clearly indicating stacked frames

Generating Sprite Sheets in Flash Professional CS6
05/2012 (35) 11
underneath the Trim checkbox (Figure 10). You’ll now
be left with free space within your sprite sheet, which
can be put to good use if you have other graphics
you’d like to pack onto the sheet.
Additionally, markers will appear over the frames
within your sprite sheet that are to be shared across
multiple animations (Figure 11). Each marker will
contain a number indicating just how many animations
the frame will be re-used in. If it helps, think of the
duplicate frames as having been stacked on top of one
another.
So far we’ve been using Flash Professional’s default
packing algorithm. However a more sophisticated one
is available that provides a higher packing ratio than
the basic algorithm. To see how it might benefit us, first
uncheck the Trim and Stack frames checkboxes. With
these options removed your sprite sheet should once
again be 1024x2048 pixels in size. Now, staying within
the Sprite Sheet output section,
find the Algorithm drop-down
box and select MaxRects.
Notice that the MaxRects
algorithm is able to pack your
graphics into a 1024x1024
sprite sheet (Figure 12) without
help from the Trim and Stack
frames options. It’s always
worthwhile experimenting with
the available algorithms to see
which one will work best with
your content.
Exporting the Sprite
Sheet
Okay, using the current
settings, let’s export our sprite
sheet. Two files will be created
– a bitmap image containing
the sprite sheet’s graphics,
and an XML file that defines
the position of the animation
frames within the sprite sheet.
First we’ll need to specify
which data format the XML
file is to be output as. Flash
Professional supports various
frameworks that can utilize
Figure 12. LHS: 1024x2048 sheet using Basic algorithm. RHS: 1024x1024 sheet using MaxRects
Listing 1. The sprite sheet's XML �le
<?xml version="1.0" encoding="UTF-16"?>
<TextureAtlas imagePath="monkey.png">


<SubTexture name="Dazed0000" x="0" y="0" width="293" height="418"/>
<SubTexture name="Dazed0001" x="0" y="418" width="293" height="418"/>
<SubTexture name="Jump0000" x="293" y="0" width="282" height="367"/>
<SubTexture name="Panic0000" x="575" y="367" width="314" height="277"/>
<SubTexture name="Panic0001" x="575" y="644" width="314" height="277"/>
</TextureAtlas>

05/2012 (35)12
CREATING ANIMATIONS
sprite sheets. However each framework requires the
sprite sheet’s XML in a different format. Let’s target the
popular ActionScript-based Starling framework. Simply
select Starling from the Data format drop-down box.
You can find it within the panel’s Sprite Sheet output
section.
Now all that’s left to do is specify a filename for the
sprite sheet. At the bottom of the Generate Sprite Sheet
panel is a Browse field. Enter monkey.png into the field
and click the Export button to its right. A PNG file named
monkey.png will be written to your FLA’s root folder along
with an XML file named monkey.xml.
Understanding the sprite sheet’s XML
Although the sprite sheet’s XML file is mostly taken care
of by your framework of choice, if you’re also taking
care of coding duties then you do need to know the
unique name that has been assigned to each of the
sheet’s animation frames. It’s these names that you
use when writing code to create animations or to simply
display a single frame from the sprite sheet. Let’s find
each frame’s name.
Open the newly created monkey.xml file into a text editor
and take a look at it.
Listing 1 shows the file’s XML. As you can see, the
XML is fairly straightforward and easy to understand.
There’s a top-level <TextureAtlas> tag, which defines the
name of the sprite sheet’s image file via the imagePath
attribute. This successfully ties the XML file to the
correct image.
The remainder of the XML file contains a collection
of <subTexture> tags, which are used to define the
rectangular region of each of the sprite sheet’s frames.
Notice that each <subTexture> tag contains a name attribute,
which is used to declare a unique name for each frame.
The names are constructed from the name of the
movie clip that the frame originally belonged to, and an
index position indicating its order within the animation
sequence. This is illustrated in Figure 13 where each
name is superimposed over its corresponding frame on
the sprite sheet.
Congratulations! You now know how to export a
sprite sheet using Flash Professional CS6 and also
understand the format of the XML file that represents
it.
Final Statement
Flash Professional CS6 makes it incredibly easy
to create sprite sheets while using the design and
animation workflow that you’re already familiar with.
With very little effort you’re able to create a compact
sprite sheet that can be used in ActionScript projects
or even other languages such as JavaScript and
Objective-C.
If you’d like to know more about sprite sheets or how
to use them within your Starling projects then take a
look at my Working with Sprite Sheets in Starling article
from the April issue of Flash and Flex Seveloper’s
Magazine. Alternatively pay a visit to the official Starling
Framework website at http://gamua.com/starling.
Figure 13. Your sprite sheet with frame names superimposed
CHRISTOPHER CALEB
Christopher Caleb is a professional
Flash developer and author of Flash
iOS Apps Cookbook. He is currently
lead Flash developer at WeeWorld – an
avatar-based social network and virtual
world for teens. Christopher blogs at
www.yeahbutisit�ash.com and tweets as @chriscaleb. If you
�nd anything he says vaguely interesting then feel free to
send him an email at info@christophercaleb.com.

05/2012 (35)14
UNITY DEVELOPMENT PLATFORM
A
s was revealed last year, and has been
confirmed again by Adobe in March, the list
will be extended with Flash, which carries an
incredibly high global install count. This is important
to Unity Technologies as a company that can offer its
development community another amazing option to
be successful with the Flash Platform. In short, it’s
another way to help level the playing field for Unity
developers.
Unity Technologies at a Glance
Unity Technologies was officially founded by David
Helgason, Nicholas Francis, and Joachim Ante in
Copenhagen, Denmark in 2004 but the Unity engine
unofficially began treading its path in 2001 with the
development of a game called GooBall. When it
became clear that the tools developed to make the
game were more successful creations than the game
itself, focus shifted to creating a complete 3D engine
and development toolset that anyone, anywhere could
use to create high-quality games.
The first version of Unity was launched at Apple’s
Worldwide Developer Conference in 2005. Since that
point, the popularity of Unity has risen steadily. In 2009,
the $200 indie pricing was cut in favor of making the
base product free for PC, Mac, and Web development
while the $1500 Unity Pro provided extra features that
“professional” developers desire. Support for mobile
platforms (iOS and Android) and all major consoles (Wii,
Xbox 360, PlayStation 3) has also helped position Unity
as one of the most widely adopted game development
tools in the world.
The Unity community, one of the most positive,
diverse, and helpful development communities on
the Internet, has grown to over 1,000,000 registered
developers with 300,000 of that number using the tools
on a regular monthly basis. The 250,000 new registers
in the last three months are also a pretty good indication
of the exponential surge in popularity of the platform.
Consequently the Unity Technologies employee count
has continued to rise to support growth and is now
around 175 employees spread across nine countries.
Unity is constantly in a state of development and the
latest update, Unity 3.5, brought some a great amount
of additions and changes such as the new Shuriken
particle system, massive improvements to lighting
options, improved occlusion culling, and pathfinding
systems at no additional upgrade cost.
The Unity 3.5 beta also brought with it the Flash
Developer Preview, giving all those who download the
beta the chance to check out the Flash deployment tool
and enter a creation contest to see who could build
the best game over the holiday break between 2011
and 2012. The contest saw around 500 submissions,
proving the Flash deployment add-on to be a great
success.
The Flash add-on preview is still available for anyone
that downloads Unity 3.5 (Free or Pro) so everyone who
Unity:
Making (Flash) 3D Game Development Easy and Fun
“Build Once, Deploy Anywhere”is a mantra that has helped propel
the Unity development platform to the healthy global status it
enjoys today. Up until now this idea of quick publishing to different
platforms has included PC, Mac,Web (through UnityWeb Player
and Native Client), iOS, Android, Xbox 360, PS3, andWii.
• what is the Unity Technology
• how to creating your own content using Unity Flash
• what is the unity Flash-in-a-Flash Competition
• basics Adobe Flash understanding

Unity: Making (Flash) 3D Game Development Easy and Fun
05/2012 (35) 15
loves making games for Flash can try it out! You can
find out more about this later in the article.
Unity and the Democratization of Game
Development
The core concept of “democratizing game development”
has been, and is still, the foundation for every change
and addition that is made to Unity. This means a
particular focus on creating a full-featured engine with
user-friendly tools for a price that anyone (especially
indie studios) can afford.
One of the biggest draws for Unity as a toolset
has clearly been its quick learning-curve. Later on in
this article, you will find a jumping-off point for Flash
developers. Hopefully you’ll see the UI’s accessibility
and efficiency as a testament to the amount of effort
put into its development given the breadth and depth
of Unity’s features. The interface manages incredible
transparency for important features while hiding the
less important guts so that only the few that really need
access to them will have to look.
The UI is presented visually to be familiar to those that
use 3D Studio Max or Maya but is easily understood
by all. Assets can be dragged and dropped into a
scene with ease. At the same time, properties can be
adjusted for objects individually or for “prefabs” that
carry information about everything from visual style to
control scripting with them across all instances of an
object in project.
The goal is to take the pain out of development and
nowhere is this clearer than in the platform deployment
tools where a click of a button is all it takes to convert
a project from one platform to the next. Unity does the
heavy lifting and developers are left with the clean-up
tasks of optimization and bug hunting. That means if
you’re developing a game for iOS or Android and you
want to move it to Flash (or vice versa), you’ll barely
have to lift a finger to make it happen.
Unity also provides the best prototyping and
gameplay testing environment in the industry. Games
can be played in the editor while adjustments can be
made on the fly. Values are adjusted without making
any permanent changes to any underlying scripts.
Instantaneous results make iteration efficient and fun.
Making Teams Smaller and More Efficient
While the tools and pricing are almost always the start
of any conversation regarding Unity’s strengths and
usefulness, two other democratization initiatives were
introduced at the end of 2010 to provide new potential
advantages to smaller developers: The Asset Store and
Union Business Division.
The Asset Store is an exchange for assets of all
types (art, scripts, sound, editor extensions) that can be
accessed directly from the Unity application. Creators
can upload assets to the store where developers looking
for an out-of-the-box solutions can purchase them. This
simple concept allows for coders to find art, artists to find
code, and everyone to add more functionality to Unity.
Once an asset has been purchased (or downloaded
for free) it can be immediately installed into the active
project. The assets are all royalty free and can be used
in any number of projects. The Store has seen great
success in its first year growing from 64 asset packages
to over 2,800 currently with some asset creators making
a good chunk of money monthly.
Union provides a distribution network to Unity
developers that falls outside the realm of normal
publishing. The service is free to all to join and has
the potential to hook developers up to new avenues of
distribution to emerging platforms such as smartphones
that aren’t iOS or Android, set top boxes like Roku, and
Smart TVs. Union will take care of porting the games
to each platform, freeing up development resources to
work on follow-up titles. Costs of porting the game will
be taken from profits after which Union takes a minor
20% revenue share.
Flash as a Unity Build Target
When Adobe announced Stage3D (then still known as
Molehill) to the world back in 2010, Flash became a
viable target for Unity export. Stage3D is a lower-level
hardware accelerated graphics API; which is needed for
the complex 3D graphics the Unity Engine can produce
in real time.
As mentioned earlier, one of the most attractive things
about the Flash Platform is its incredible reach. With
more than 1.3 billion PC installs of the Flash Player, the
potential target audience is huge. Unsurprisingly, Unity’s
userbase indicated they wanted access to this audience
so once Stage3D was announced, work commenced on
the Flash deployment add-on.
Porting the engine to work with Flash has been a
massive undertaking. On the already existing targets,
the engine runs as compiled native code directly
targeting the device. Compare this to the Flash Player,
where we cross-compile our engine, the Scripting
API code, and finally the project code to ActionScript.
Additionally, it cross-compiles shaders to Adobe’s AGAL
Shader language and rewrite all project assets to Flash
Player compatible formats.
The most important thing to take away from this is
that you, as a content creator, don’t have to worry about
what platform you are targeting with Unity. Unity does
that work so you can focus on creating your content
using all of the same advanced runtime features such
as physics, occlusion culling, particle systems and
navigation meshes, when targeting to Flash.
While the deployment tool is currently still in preview,
there are already many users creating beautiful content

05/2012 (35)16
for Flash. The power of authoring for Flash using the
Unity Editor will mean an acceleration in growth of great
content for it.
Unity’s Flash-in-a-Flash Competition
The “Flash in a Flash” competition was great validation of
how Unity helps developers are creating quality content
faster. The contest, which started in December 2011,
was in celebration of the release of the first version of
the tool. It challenged developers to create new games
or port their old ones over to Flash and judged both on
creativity and technical merit. Many people did just that
in a very short amount of time.
After the two week deadline; the amount of entries
into the competition alone shocked the Unity staff. With
close to 500 entries, there was a ton of content to play
and review! It turned out to be very tough to select the
winner and the ten runners up.
Considering the Flash exporter was in first beta at that
point in time, entrants did an incredible job of utilizing
it to create incredible games. Let’s have a look at the
winner and some of the runners up.
Winner: Tail Drift
By Cameron Owen
Tail Drift is a simple arcade racer in which you
maneuver a red plane along a 3D candy-striped tubular
track. The track runs below, above, and around floating
islands and hot-air balloons that you have to avoid
smacking into. It’s a bit like Retro Revolution meets
Mario Kart.
Ski Safari
By Brendan Watts
In Ski Safari, a charming casual game by Brendan
Watts, you are a resilient little skier outrunning a
deadly avalanche. Survive and gain points by making
impressive jumps, collecting coins, and riding on the
back of various animals that happen to be also zipping
down the mountain! Use penguins to glide further, Yetis
for increased toughness, and Eagles to soar to great
heights!
Aaaaa!!! for the Awesome
By Owlchemy Labs and Dejobaan Games
Landing yourself in traction was never so much fun.
In this game you free fall through a floating cityscape
high above the Earth’s stratosphere. Gather points by
skimming alongside buildings, but, use your parachute
to avoid crashing into them.

05/2012 (35) 17
Flatboyz
By Bento-Studio
You are a cardboard hero dangling from a rope
and gliding above the countryside. Below you are
surly looking mortals clad in red bikini bottoms. You
must pick them up to make them happy again – and
give them new clothes! But watch out for the trees,
rooftops, and other obstacles that can knock you off
your rope.
Start creating your own content using Unity
Flash!
The current release version of Unity 3.5 includes a
public preview of the Unity Flash deployment add-on.
It’s by no means final at this point but we wanted to
get this in the hands of as many as people possible,
as quickly as possible, to let everyone try it out and
give us feedback. On final release this will become
paid add-on to Unity but, right now, you can download
a free copy of Unity and start deploying your Unity
games to Flash.
Longtime Unity users will find it easy to simply deploy
their games to Flash as they would with any other new
platform. Flash developers new to Unity will also find
it exciting to build games for their favorite platform
but also have the option to then release the game to
multiple other potentially profitable targets. We will be
focusing this next section of the article for people with a
Flash / Flex background that are new to Unity. To follow
along, you can get the free version of Unity 3.5 with
our Flash Exporter preview at: http://unity3d.com/unity/
download/.
An Introduction to Unity for Flash Developers
Unity is a cross-platform development tool known for its
simple learning curve and rapid development, but how
does one get started using Unity? As a Flash user, it is
important to remember that your first glance at Unity
may seem alien, but our interface and workflow actually
carries with it many parallels with Flash.
Make a Scene! How Unity Content is Organized
To create Unity games, much like Flash – games are
arranged inside Scenes. These could be considered as
Flash scene equivalents, while the overall Project, an
equivalent to your .FLA files are folders containing the
entire Unity project.
The Scene you are currently working on is shown
in the Scene view in Unity. This view is effectively a
3D equivalent to the main Stage in Flash. The key
difference to note here is the infinite nature of 3D space
– for this reason Unity provides simple navigation
tools, akin to 3D modelling applications such as 3DS
Max, Maya, or Modo for example. Don’t fear if you are
unfamiliar with 3D navigation as the simple use of the
Hand tool in Unity, along with modifier keys Alt / Ctrl
allow you to pan, orbit, and zoom with ease.
This infinite three-dimensional space also means that
you should forget about the nature of dimensions as
defined in Flash for the stage. What is shown onscreen in a
3D engine such as Unity is defined by the use of Cameras
so try and think more in physical movie production terms
– anything the audience sees is simply what the camera
picks up. Naturally you can define the exported pixel
dimensions for your exported Flash swf, but it’s important
to ensure that you think three dimensionally. It may be
daunting at first, but it soon becomes exciting as you
begin to realise the possibilities and ease of realisation for
dramatic and fun effects for your games.
Scenes, along with other assets used to make your
game, are shown inside Unity in the Project panel. This
panel, accompanied by a Create button that allows you
to generate various Unity specific assets, is your main
focus for managing assets and handling import settings.
It is the equivalent of the Library window in Flash.
Hey! Nice Assets
Unity handles any assets you can throw at it – everything
from Photoshop files and 3D objects to video and audio.
The great thing about keeping these assets arranged in
Unity is that you’ll never need to reimport them. Import
any asset into Unity’s Project panel (or simply save
to the Assets folder, a subfolder of your main project
folder) and your asset is registered by Unity.
Need to update a file in an external package? This
is as simple as saving in the external package you
are working in (Photoshop for example) and switching
back to Unity. Unity detects the change in the file and
automatically re-imports and updates any part of the
scene that uses your file.
This straightforward pipeline ensures that your in
game content is always up to date, and the Project panel
itself gives you the opportunity to share assets and
their settings with others in a team by exporting Unity
packages. These are bundled files that incorporates
all of its current settings for Import and any files that it

05/2012 (35)18
depends upon. For example, a 3D model may require a
texture to accompany it.
MovieClips, Instances, Prefabs, and Game Objects
In Flash, we’re all familiar with the concept of creating a
MovieClip – a self contained data template stored in the
Library, and instanced via code or the editor – and it’s
especially important in game development. In Unity, this
concept is mirrored by what we call Prefabs. However,
there are some subtle differences to be aware of.
In Unity, any items in your scene are known as Game
Objects, these can be saved into the Project (Library)
as something called a Prefab (MovieClip). Once this
is done, each game object that belong to this prefab
is considered an Instance of it, but this is not just for
storage purposes. Unity takes the template system
one step further by allowing you to edit the Prefab by
selecting it within the Project panel and edit in within
the Inspector (akin to Flash’s Properties panel). This
then updates the properties of any instances of it in
your game’s Scenes, giving you flexibility to update
infinite objects in your game at any time. Keep in mind
that instances of a stored prefab can still be edited
as individuals without affecting the group. If you then
choose, edits made to this individual can be echoed
back to the prefab, which will in turn update all of the
fellow instances as a result.
Hierarchy vs. Timeline : Frames vs. Realtime
Another key difference to note when considering game
development in Unity, is that your game runs as a realtime
render. In Flash, we’re used to seeing objects we have
placed onto the Stage in the Timeline, with a range of
frames for duration of that item’s existence. Unity is a
realtime engine and therefore keeps objects in the scene
until a script tells the engine to remove the object.
As such, the equivalent to the Timeline in Flash is
the Hierarchy panel, but given its lack of need to show
duration, the Hierarchy is simply a Hierarchical list of
game objects in your current scene. Selecting any
object in this list and double-clicking its name will focus
the Scene view on it, and likewise, clicking on an item
visually in the Scene view will select it in the Hierarchy.
Oh Behave!
Putting Game Objects to work in Unity
While every object in your scene is a game object, the
behaviour and properties of these objects are controlled
by another core concept: Components. In Unity, you’ll
see a Component top menu item that allows you to add
various properties and potential behaviour to your game
objects such as the Rigidbody component which adds
Physics properties to an object. Once added, these
components are listed in the Inspector (Properties)
panel and can be adjusted visually or via scripting.
Any game development task will inevitably come with
a certain amount of scripting in order to achieve the
behaviour you desire for your gameplay. In Unity, scripts
are written in an individual basis, and applied to objects as
behaviour components. Scripts are attached to objects and
control them by addressing properties of the Components
attached to the object they are on – or by addressing
properties of another object in the active scene.
Scripts can be written in UnityScript (Unity’s own
API that uses JavaScript syntax), C#, or Boo. These
languages will look familiar and will be easy to pick up
for anyone with ActionScript 2 or 3 experience. Scripts
are not simply restricted to controlling gameplay either.
They can also be used to communicate with servers,
save states and load in new game content, much in the
same way that ActionScript does in Flash, and even to
create new functionality for the Unity editor itself!
Bouncing Ball: A Flash Classic Revisited
For every Flash vet, there is a fond memory of their first
Flash animation experience – the bouncing ball is very
much the “Hello World” of the Flash scene. So let’s take
that familiar concept and revisit it in Unity, as your first
attempt at working with the package. Don’t worry, you
won’t even need a classic motion-tween!
With Unity open, make a new empty scene by
choosing File > New Scene (Ctrl / Command – N) from
the top menu.
Now let’s make a ground plane for our action to take
place upon, go to Game Object > Create Other > Cube,
from the top menu. You will now see a new Cube in
your Scene view, and an accompanying new item in the
Hierarchy, named ‘Cube’. Now look at the properties of
this new object by looking at the Inspector panel. It is
a new cube object that in 3D terms we call a ‘primitive’
– these are simple shape objects such as a Cube,
Sphere, Capsule or Cylinder (Figure 1).
The Cube has 4 components attached to it, and these
are shown in the Inspector panel under the headings
Transform, Mesh Filter, Mesh Renderer, and Box
Collider (Figure 2).
Figure 1. Cube-will

05/2012 (35) 19
These components do the following jobs:
• Transform – defines the Position, Rotation and
Scale of the object
• Mesh Filter – holds the shape of the object
• Mesh Renderer – controls the appearance of an
object and can redefine appearance by having
materials assigned to it
• Box Collider – gives the object a physical presence
in the game, it can now collide with other objects as
a result
Now let’s make this cube into a floor – set the Position
values in the Transform component all to 0, and then
set the X and Z values of Scale to 100.
Now it’s a little dark in here right? Let’s add a light
to brighten things up. In Unity you are working with a
rendering engine, so lighting is controlled not simply
by light and dark areas in your graphics, but by lights
added to the scene.
Go to GameObject > Create other > Point Light, then
set the Position values for the new Point Light to X: 0,
Y: 5 and Z: 0.
You’ll now have a patch of light on the floor, a perfect
place to make our ball bounce! But first, we need a ball.
Go to GameObject > Create Other > Sphere.
As you’re such an ace at positioning by now, place
this sphere at X: 0, Y: 4, Z: 1.
Now it’s time for some Physics! You’ll be pleased to
know that Unity includes the Nvidia Physx engine, so
all the work is done behind the scenes for you to create
realistic simulations. Wiith the Sphere still selected in the
Hierarchy, choose Component > Physics > Rigidbody.
You will now see this component listed in the Inspector
panel on the right, and you should note that the Gravity
property is enabled by default, perfect!
Testing your Scene at any time in Unity is easy. Simply
Click the Play button at the top of the interface to see
what our bouncing ball looks like so far.
At this stage you will note that we have very little
bounce to our ball. Your Sphere falls to the ground
and stops in a wholly underwhelming manner. This is
because in Unity, the response of differing surfaces
colliding is handled by Physic Materials. In order to make
the ball’s collider (its physical presence) ‘bouncy’ we
must create a Physic material, with bouncy properties
and apply it to the Sphere Collider component of the
Sphere.
Click the Play button again to stop testing your game
– do NOT click Pause, as this will keep Unity in testing
mode, meaning that changes made during this mode
will not be saved. A great way to explore different
settings for parameters without committing to them.
On the Project Panel, click the Create button, and
from the Drop down menu, choose Physic Material.
Your new asset is created, and its name is highlighted
immediately for you to name. Call this Bounce and
press Return or Enter to confirm. Now, with this asset
selected in the Project panel, you will see its properties
in the Inspector panel.
To make a bouncy material, leave the Friction settings
on 0.4, but set Bounciness to 1 and Bounce Combine
to Maximum. Now, apply this asset to our Sphere by
dragging it from the Project panel, and dropping it onto
the name of the Sphere object in the Hierarchy panel.
This automagically applies this asset to the right
component – the Sphere Collider, and if you select the
Sphere now and look at this component you will see
the Bounce asset you just created listed as the Physic
Material this component is using. This means that
whenever you adjust the asset in the Project panel, the
behaviour of this ball will change (Figure 3).
Figure 2. Components-will
Figure 3. ballBounce-will

05/2012 (35)20
Congratulations, you just made a bouncing ball! Press
Play again to see it!
Now, to export this to Flash, we’ll select the File
dropdown menu and click on Build Settings. Switch the
target to Flash Player (preview) and click on “Switch
Platform”. After this is done go ahead and build your
project, selecting a name and location for it to save too.
After the build process is done, a new Finder or Explorer
window will open with a ready to go swf file, alongside a
template HTML file for you to run. Done!
Take Full Advantage of Your Target Platforms
For Unity 3, we supplied an example project called
Angry Bots; a great looking futuristic top-down shooter
in which you fight some very angry robots while
following the winding red lines to the exit of the facility
you are trapped in.
While Angry Bots is primarily a demo project to show
off some of the features of Unity 3, it’s also a fun game
to play.
Currently it’s available as a playable game on the iOS
and Mac AppStore, the Android MarketPlace, Google
Webstore (Native Client), and the Unity website (Unity
Web Player and Standalone). Now, with the addition of
the Flash exporter the exact same game is available
on game portals such Shockwave, MiniClip, and
Kongregate as a Flash game.
As a Flash developer using Unity, this is one of the
primary advantages of using Unity. You have the ability
to deploy content for all platforms we support now and
those we will support in the future. This enables you to
target platforms without having to learn platform specific
development kits or rewrite your entire project to fit the
target.
Angry Bots does a great job at showing how to
export the same project to different platforms, while
still adjusting the content to take full advantage of the
features of the specific platform. For example, while on
a normal PC the inputs are mouse and keyboard, on
a iOS device the only input is the screen. Adjustments
can easily be achieved using Unity’s platform specific
feature support.
It also provides a beautiful demonstration of switching
graphical quality based on the capabilities of the
target platform. While the game looks great on even a
modest smartphone or tablet, platforms with more gpu
power such as desktop machine are able to do more.
If you want that beautiful Depth-Of-Field effect on the
highest quality level on those more technically capable
platforms, it’s easily possible to do quality management
for the specific platforms through scripting, user defined
shader settings, and the Unity QualitySetting API.
Other platform specific things like asset conversion
to platform specific formats are automatically done by
the editor. For example, in the case of Flash it converts
all Audio to MP3 and all textures to compressed ATF
textures; the settings for these assets and how they are
imported are user definable per platform. For Flash both
of these formats are configurable compressed formats,
important for compact distribution over the web.
Take Full Advantage of Flash
Unity enables you to deploy to any Unity target with
the least possible effort, but also empowers getting the
best out of any of the target platforms. Some platform
specific implementations are fairly unique to the
platform itself and it can be advantageous to use these.
In the case of the Flash Platform, a good example is
the ability of peer-to-peer networking that is available
through its Cirrus service.
Since this is a quite large and Flash specific API,
encapsulating it in a Unity API isn’t possible.
Thus, when targeting Flash, it is possible to directly
write and include ActionScript in your project and
access it through an API called UnityEngine.Flash.Act
ionScript.
With this you are able to tap directly into Flash’s
availableAPI’s such as the Realtime Media Flow Protocol.
To start using ActionScript, in your project folder, create
an ActionScript folder and directly drop your ActionScript
.as files in there. It’s also possible to drop SWC libraries
in your project and use those instead.
To now communicate between your Unity C# scripts
and ActionScript, use the UnityEngine.Flash.ActionScript
API, which enables writing inline ActionScript in your C#
file; here’s one example of such inline ActionScript in C#.
ActionScript.Statement(„MyCustomActionScriptClass.Static
Function(v)”, v);
This way, you get the best of both worlds. While you
get the ease of use, portabilty, and strength of Unity’s
scripting, you can still directly access ActionScript and
Flash API’s.
While this allows you to use ActionScript inside your
Unity project, it’s also possible to use your Unity project
from a Flash / ActionScript project. This is important to
be able to use and communicate with Unity content in
your existing Flash project.
With every Unity to Flash compiled project a
UnityShared.swc file is written in the target build folder.
Embedding this SWC in your existing project, there
is an API available that allows you to load, size and
communicate with your Unity project. From within Unity,
you can now call Application.ExternalCall and this will be
sent to the Flash host, while from the Flash host, you can
use sendMessage to call functions on objects in Unity.
In the current Flash preview, we are still changing
these APIs based on user feedback and we invite you
to try them out and give us your feedback.

both are needed to target Flash. This means that Unity
authored Flash content will fall in the category of content
that will need a premium features license. While currently
only the combined usage of Stage3D and Fast memory
opcodes fall under the premium features licensing, Adobe
has announced that while the Flash platform is evolving
they will add features to the Flash Runtime that fall under
the premium features license. One example of this given
by Adobe is “instant play”, which enables client side asset
caching, using a local storage API; this feature will greatly
reduce download times for recurring play on large games,
further making the end user experience smoother and
stimulating returning players.
A Note on Flash Premium Features and Unity
Content
Adobe has recently announced “Premium Features for
Gaming” for the Flash Platform which initially includes
only Fast Memory Opcodes and Stage3D when used
simultaneously. They have also announced a required
9% revenue share on Premium Features Licensed
content that exceed $50k in revenue. To be able to
get the great performance and port the huge amount of
functionality and features currently in the Unity engine,
RALPH HAUWERT
Adobe® Flash® 3D veteran,Senior Developer at Unity
Technologies’ Copenhagen office
As a technical expert with more than a decade of experience in
online creative development and a strong background in Flash,
Hauwert has been involved in several high pro�le and critically
awarded projects, including the Anne Frank Annex Online 3D,
KPN’s House of Tomorrow, Earthmine and Papervision3D. As
an industry recognized leader and pioneer within the Flash
community, he has set milestones in the �eld of Flash 3D
and the open source Flash movement. Hauwert was one of
the speakers at Unity Technologies’ Flash Day designed to
introduce Flash users to the Unity development platform.
About UnityTechnologies
Unity Technologies is revolutionizing the game industry
with Unity, its award-winning breakthrough development
platform. Unity Technologies has more than 500,000
registered users worldwide – including Bigpoint, Cartoon
Network, Coca-Cola, Disney, Electronic Arts, LEGO,
Microsoft, NASA, Nickelodeon, Ubisoft, Warner Bros., large
and small studios, indies, students and hobbyists – all using
Unity to create games and interactive 3D, like training
simulations and medical and architectural visualizations, on
the web, mobile, consoles and beyond. Unity Technologies
is aggressively innovating to expand usability, power and
platform reach along with its Asset Store digital content
marketplace and Union game distribution service so that
it can deliver on its vision of democratizing interactive 3D
technology. Unity Technologies is headquartered in San
Francisco and has development offices worldwide. For more
information, visit: http://unity3d.com.
a d v e r t i s e m e n t

05/2012 (35)22
FLEX 4 AND FXG
N
ow the problem starts, you provide good
functionality, and equally good UI, the application
gives wow effect in demo, but in reality, it slows
down and consumes too much memory, rendering
being one of costly process!
Here comes FXG (SVG implementation) into picture.
Scaled Vector Graphics is XML representation –
definition of image or line art.
As per O’reilly Flex 4 cookbook, “A FXG fragment is
a grouping of graphical elements, such as shapes, text,
and raster images, along with optional masking and
filters that can be contained inline in MXML or within
a FXG document with the .fxg file extension. FXG is
a subset of MXML and does not include the ability to
reference external classes or respond to runtime events,
such as data binding and state changes. However, FXG
fragments can be declared inline in MXML to take
advantage of such features, which most skin classes in
the Spark architecture employ.”
SVG has been supported since Flex 3 with degrafa
library, but not with that much flexibility or customization.
Flex 3 was limited to: Listing 1.
Flex 4 is the way to deal with different approaches,
known as FXG component.
Just like any other Halo or Spark component, FXG
holds image definition (not extending UIComponent
Class, albeit).
With Flex 4 and mobile application development,
FXG is very much required feature. Mobile application
Flex 4 and FXG
Flex application without real UI asset is like an amazing structure
of building, without walls and furnished box!The core challenge
is balancing UI and functionality. If you provide rich UI, but weak
functionality, it doesn’t sustain long. In reverse, if you provide
expected functionality, but dull or default UI, it may give kind of
non touching feeling to user.
• Reason for using FXG, and possible scope
• Basics on FXG, easy migration from SVG
• Basic capabilities achieved in FXG
• Path for intermediate to advanced learning
• Familiar with ActionScript 3.0 language, basic Flex 4
understanding, comfortable with Flash Builder or similar IDE
• At least rough idea about Vector Graphics or SVG
Listing 1. Using SVG with Flex 3
<mx:Application xmlns:mx="http://www.adobe.com/
2006/mxml" xmlns:Degrafa="http://www.degrafa.com/
2007" layout="horizontal">
<mx:Script>
<![CDATA[
[Embed(source="assets/flex3.svg")]
[Bindable]
public var flex_svg:Class;
]]>
</mx:Script>
<mx:Image source="{flex_svg}"/>
<Degrafa:GeometryComposition graphicsTarget="{[cnv]}">
<Degrafa:Path data="M 0,0 L 100,0 L 100,100 L 0,100 z">
<Degrafa:fill>
<Degrafa:SolidFill color="#EECCEE" />
</Degrafa:fill>
<Degrafa:stroke>
<Degrafa:SolidStroke color="#FF00FF" weight="3" />
</Degrafa:stroke>
</Degrafa:Path>
</Degrafa:GeometryComposition>
</mx:Application>

Flex 4 and FXG
05/2012 (35) 23
has to be lightweight. It is well known fact that mobile
devices are limited in hardware resources and memory
availability. Components are best at its performance
when skinned with FXG, instead of pure bitmapdata
images. Another considerable approach to use FXG
is for certain repetitive symbols like bullets or icons.
Basically, FXG rendering and runtime manipulation
is cheaper and easier than bitmapdata image like
JPEG or PNG. The more effectively we use, better the
performance is, be it mobile or desktop – AIR.
FXG sources
Many Adobe products such as Adobe Illustrator,
Fireworks, Photoshop can export design to FXG file.
Adobe Creative Suite tools can be used to convert SVG
to FXG. Flex 4 supports version 1.0 and 2.0 of FXG. Of
course, need some change if it is version 1.
Dig into definition
As stated above, FXG is a component declaration in a
separate file, which holds image definition in XML like
Listing 2. Declaration block
<Graphic xmlns="http://ns.adobe.com/fxg/2008" version="2">
…..
…..
…..
</Graphic>
Listing 3. Tag Declaration
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:
fxgComponent="*">
<fxgComponent:flexLogo height="100" width="300" x="0" y="10"/>
</s:Application>
Listing 4. Script Declaration
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:
fxgComponent="*" creationComplete="drawLogo()">
<fx:Script>
<![CDATA[
import spark.core.SpriteVisualElement;
private function drawLogo():void
{
flexLogoInstance = new flexLogo();
flexLogoInstance.x = 0;
flexLogoInstance.y = 10;
flexLogoInstance.height = 100;
flexLogoInstance.width = 300;
addElement(flexLogoInstance);
}
]]>
</fx:Script>
</s:Application>

05/2012 (35)24
FLEX 4 AND FXG
format; it cannot hold reference to other FXG component.
FXG tags have an implicit depth order. The order in which
elements are defined defines their depth. Each tag is
effectively drawn above its previous sibling. Children are
drawn on top of their parents. FXG document has to use
following namespace: http://ns.adobe.com/fxg/2008.
Likewise in HTML, <html> is wrapper tag, FXG wraps
content with <Graphic> tag, and has to explicitelly define
version 2.
FXG document/component supports its own set of
datatypes such as angle, color, integer, length, number,
identifier, percentage etc. It does not support any
declarative syntax such of Flex such as <fx:Declaration>,
<fx:Metadata>, <fx:Binding>, <fx:Script>, <fx:Style> or
ActionScript 3 datatype such as <fx:Boolean>, <fx:Date>,
<fx:Function>, <fx:int>, <fx:XML>.
Deal with declaration
The FXG has to be available as separate compliable
component in form of .fxg file. Just like any other
component, FXG can be declared either as tag or inside
script block.
Listing 5. Sample FXG Component
<?xml version='1.0' encoding='UTF-8'?>
<fxg:Graphic xmlns:fxg="http://ns.adobe.com/fxg/2008" version="2">
<fxg:Path x="9.399" y="10.049" data="M 82.016 78.257 L 51.895 69.533 L 27.617 89.351 L 26.621 58.058 L 0.231
41.132 L
.749 30.52 L 37.714 0.241 L 56.944 24.978 L 88.261 23.181 L 70.631 49.083 Z">
<fxg:fill>
<fxg:SolidColor color="#FFFFFF"/>
</fxg:fill>
<fxg:stroke>
<fxg:SolidColorStroke caps="none" color="#FF00FF" joints="miter" miterLimit="4" weight="20"/>
</fxg:stroke>
</fxg:Path>
</fxg:Graphic>
Listing 6. Sample FXG Library
<Library>
<Definition name="YellowRect">
<Group>
<Rect height="5" width="5">
<stroke>
<SolidColorStroke color="#00FF00" weight=".75"/>
</stroke>
<fill>
<SolidColor color="#00FF00"/>
</fill>
</Rect>
</Group>
</Definition>
</Library>
<YellowRect x="0" y="0"/>
</Graphic>

Flex 4 and FXG
05/2012 (35) 25
Listing 7. Sample FXG component with richtext capabilities
<RichText>
<content>This text is BOLD , this text is 
UNDERLINED , and this text is ITALIC .This
is a new paragraph.</content>
</RichText>
</Graphic>
Listing 8. A sample application from O’reilly Cookbook – demonstrating bitmap mask applied to graphics
<s:Application xmlns:fx="http://ns.adobe.com/mxml/
2009"
xmlns:s="library://ns.adobe.com/flex/
spark"
xmlns:mx="library://ns.adobe.com/flex/
mx"
creationComplete="handleCreationComple
te();">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import spark.core.MaskType;
[Bindable] public var masks:
ArrayCollection;
private function handleCreationComplete():
void
{
masks = new ArrayCollection( [
MaskType.CLIP,
MaskType.ALPHA,
MaskType.LUMINOSITY ] );
maskList.selectedIndex = 0;
}
]]>
</fx:Script>
<s:layout>
<s:VerticalLayout />
</s:layout>
<s:DropDownList id="maskList"
dataProvider="{masks}" />
<s:Graphic id="group" maskType="{maskList.selecte
dItem}">
<s:Rect width="320" height="320">
<s:fill>
<s:LinearGradient>
<s:entries>
<s:GradientEntry color="#000000" />
<s:GradientEntry
color="#DDDDDD" />
</s:entries>
</s:LinearGradient>
</s:fill>
</s:Rect>
<s:mask>
<s:Group>
<s:BitmapImage source="@Embed('/
alphaBitmap.png')" />
</s:Group>
</s:mask>
</s:Graphic>
<s:Group enabled="{maskList.selectedItem==MaskType
.LUMINOSITY}">
<s:layout>
<s:HorizontalLayout />
</s:layout>
<s:CheckBox selected="@{group.luminosityInvert}"
label="invert" />
<s:CheckBox selected="@{group.luminosityClip}"
label="clip" />
</s:Group>
</s:Application>
[source : http://www.oreillynet.com/pub/a/flex/
excerpts/flex-4-cookbook/graphics.html]

05/2012 (35)26
FLEX 4 AND FXG
• Tag declaration (Listing 3)
• Script declaration (Listing 4)
This is about how to use; below is sample of an FXG
component: Listing 5.
Of course, when we export FXG from other applications
like Photoshop, we should ignore and remove some non
MXML graphic tags like <Library>, <Private>. Also such
exported FXG, after removing such metadata tags, the
tag has to declare with spark namespace, s:. This makes
it usable MXML component. <Library>, <Private> such
tags are supported in FXG, not in MXML. Similarly, FXG
library can be defined as under: Listing 6.
And with <fxgComponent:BlueShape/> declaration, it
makes instance.
width and height are two properties that identify
FXG’s original dimension, which can be altered with
viewWidth and viewHeight.
With this we are limiting discussion on declaration
and conversion. FXG can also include bitmapdata from
source image like PNG, JPG, GIF. This should be used
only if required. This is supported with <BitmapImage>
in FXG or <s:BitmapImage> in MXML. For our primary
purpose of making application lightweight, if we again
wrap bitmap to FXG, it doesn’t really serve purpose!
This decision should be wise.
In nutshell, if FXG is declared as part of application
i.e. <s:Application /> or so, it has to have prefix
namespace.
Text in FXG
Text is also supported in FXG; with <RichText> if its
version 2.0, <TextGraphic> if 1.0 .
FXG <RichText> tag supports the child elements like
<content>, <transform>.
A good example of FXG component, self explanatory:
Listing 7.
<content> child tag supports elements like , ,
 , <tcy>, <a>, <img>, <tab>, <linkNormalFormat>,
<linkHoverFormat>, <linkActiveFormat>
Mask
What explained so far is pretty short and primary, FXG
is much more. Mask and Effects are interesting parts
in this.
There are two types of mask – clip & alpha. In clip
masking, only the actual path, shapes, and fills defined
by the mask are used to determine the effect on the
source content. In alpha masking, the opacity of each
pixel in the source content is multiplied by the opacity of
the corresponding region of the mask.
Let’s see a nice example straight from kitchen
of O’reilly! (Listing 8). And when it runs, looks like:
Figure 1.
Wrapping Up
FXG is not really a replacement for all scenarios. It isn’t
really replacement to bitmapdata. Likewise skinned
UIComponent, you really do not need bitmapdata for
its weight and scalability issues. SVG manipulation is
much easier and clean in terms of rendering, and that’s
why Flex component, with its FXG skin looks beautiful
in any size!
Figure 1. Output
References
• SVG Primer for Flex – http://saturnboy.com/2009/06/svg-
primer-for-�ex/
• FXG and MXML graphics – http://help.adobe.com/en_US/
flex/using/WS145DAB0B-A958-423f-8A01-12B679
BA0CC7.html
HARIT KOTHARI
Harit is a Flex and RIA developer by profession, based in India.
He started career with Java development and quickly learned
and moved towards Flex. He has also consulted small projects
while working for short term in Dubai, UAE. Application
and functional level challenges are his primary interests.
Traveling and reading are his interests. He blogs at http://
harit.kotharee.com/ and whispers on twitter @harit.

05/2012 (35)28
FLEX 4
A
dobe has company which have been working
ahead of time many years in many technology
are like Acrobat reader, Photoshop with image
processing algorithm implementations for naive users,
for online picture editor for image enhancements using
image processing algorithms (http://pixlr.com/editor), Flex
for AJAX/RIA. Flash presented good threat to Microsoft
as instead of writing to OS people can write to Flash same
reason why Steve Jobs took stand against Flash. Adobe
hence started to silent revolution of RIA.
Photoshop, Illustrator, and the other design products
in its Creative Suite make up more than 50% of
Adobe’s revenue and have created a lot of loyalists.
Adobe presence in unified communication with its
connect platform for online meetings which competes
with Microsoft live meeting and communication server
(renamed Lync). People most often create documents
using Word processing software but once those
documents need to be stored in a fixed format for printing
and official forms, they’re almost always converted
to Adobe’s PDF format. Micorsoft XPS never stood
competition against PDF format.
Adobe Flex is a popular framework for building Rich
Internet Applications (RIAs). The Flex framework is
used to create SWF files that run inside the Adobe
Flash Player.
Today when we will see higher adoption of IP TV in
future Adobe is well positioned to take on. Earlier Adobe
flex write once and run on any browser (need not worry
browser dependency) to today write once run on any
device (Android, IPhone, or any tablet OS).
Technology Landscape
Technology is continuously evolving. Never people
thought before AJAX came in that all system will web
based. As in earlier system Client server system web
Future of Flex & Flash:
Gamification of ERP enterprise software, Augmented
Reality on mobile apps, ipTV
Adobe outdoing competition for many years now has system
in place for bringing future technologies like IPTV (http://
blogs.adobe.com/flashplatform/tag/iptv), mobile/tablet OS
interfaces, photo editors like Photoshop,Word editors like Acrobat
reader with compressed storage.
• Comparison of Flex competitors like HTML5 vs �ex
• Augmented reality using Abode products
• Gami�cation of Enterprise apps using �ex
• Future trends, future usage evolution of Flex
• Basic knowledge of computer technology with suffice
• Basic knowledge of AJAX
• Basic Adobe Flex, AJAX, Flash,HTML5
Figure 1. The evolution

Gamification of ERP enterprise software, Augmented Reality on mobile apps, ipTV
05/2012 (35) 29
client wait for completion for each request till then
browser hangs. With coming of AJAX Asynchronous
request does not need to wait for reply from Server
for completion of request. Today what we See from
Website to ERP like SAP PeopleSoft, oracle apps,
to Business intelligence systems virtually every UI is
Web Based. AJAX increased adoption of Web across
different platform devices and interfaces. Across all this
technologies the best choice of UI ends at flex.
Demand and salary to AJAX programmer crossed
Java programmers. Main component of AJAX was java
script. But problem came later no support for JavaScript.
In meanwhile Adobe was company very much into
multimedia software like Flash, Photoshop. Needed to
adopt to new Web paradigm. So necessity is mother
of invention. Abode had flash player which was heavy
when used with websites. So it came with AJAX product
first time Flex which is blend of Flash’s graphics + AJAX
(Evolution 1997 Flash player-->2000 Action Script 1.0-
-> see Figure 1). Issues with JavaScript like not clean
coding, no support form vendor, intuitive controls for
new fast AJAX web systems were solved. Rich Internet
Application evolved RIA evolved with Adobe Flex.
Flex came with editor where user can code using
Actionscript created with mix of JavaScript concept
into Flash scripts. Action scripts we can code complex
AJAX interface to be played on Flash player get support
from Adobe while for javascript no support available.
ActionScript program that has been optimized to
death by an AOT compiler can, almost trivially, beat a
JavaScript program that is optimized on the fly by the
JIT compiler. The only way out would be to let the JIT
compiler work till death, but that is not an option.
JavaScript programs are untyped, (relatively) small
programs that are shipped/loaded as source code, and
then compiled and run on the fly. In contrast,ActionScript
programs are typed, (relatively) large programs that are
compiled to byte code, shipped/loaded as byte code,
and then run on the fly.
Flex came with more intuitive UI which never existed
before like slider control, control for embedding video
tag which later on HTML 5 could bring in 5 yrs later. So
adobe was working 5 yrs ahead of time.
Still today concepts like onscroll pagination and
caching did not exit. some 5 yrs back for every website
server side code .NET or Java or PHP or SAP or
PeopleSoft but web client code was on Flex. Beautiful
intuitive UI controls from sliders, Maps, dynamic grids,
for OLAP olap grids, dynamic grouping and sorting it
could handle huge data seamlessly the JavaScript
latency issues also minimized. These features are now
stand replicated with Microsoft sliverlight, ExtJs and
other Java script libraries.
Competition to Flex
Technology wise competition to Flex include Curl,
OpenLaszlo, Ajax, Mozilla way back in 2002 introduced
XUL, from Sun Microsystem JavaFX, Microsoft
Windows Presentation Foundation, Silverlight and
HTML5. Examine the trend graph over period of time.
HTML5 popularity has dwarfed competition as it is open
source and work across platform (Figure 2).
• Flex had moved to new battled field Devices. Is new
java of devices write once and run on any device
android, iPhone blackberry or any tablet OS.
• Enterprise class programming Model: Use of
constructs like strong typing, inheritance, and
interfaces to program more efficiently. Extensive
mobile and traditional components help speed
Figure 2. source: trends.google.com showing search trends Flex competitors or related technology

05/2012 (35)30
FLEX 4
development. Flex applications can access device
capabilities such as GPS, accelerometer, camera,
and local database.
• End to End tooling for development: Build Flex
applications more easily using Adobe® Flash®
Builder® software, an enterprise-class Eclipse™
based IDE. Productivity features include on-device
debugging and mobile simulators for testing across
screen sizes and resolutions.
• Server Integration: Integrate with all major back
ends including Java™, Spring, Hibernate, PHP,
Ruby, .NET, Adobe ColdFusion®, and SAP using
industry standards such as REST, SOAP, JSON,
JMS, and AMF, PeopleSoft.
• AJAX design patterns: On Object oriented
programming on Action scripts design pattern are
readily available.
Even software claims today integration with flex for
choice of UI whether its ERP like PeopleSoft or SAP,
Oracle Apps, or Business intelligence system like
SAP Business objects Excelsious, IBM Cognos flex
interfaces. Each day new Members join group each
day product realize it needs to provide interface to
flex joins flex group. I remember on Cognos 8.0 did
not had features like geographic reporting interfaces,
intuitive grids with dynamic sorting and grouping,
maps etc which only after integration with flex were
possible for BI. Had no choice but to integrate Flex. I
recommend everyone at least one download tour de
flex and see the dynamic UI. I am sure you will start
loving it. From YouTube to Google finance or yahoo
finance everywhere you can see innovation of Flex
controls (Figure 3).
On contrary HTML5 is not threat but opportunity
for Adobe Flex
But Adobe has the most to gain if they become the major
player in the HTML5 field by providing tools, framework
and making the web standards evolve. And they are in a
good position to get there. Adobe has already two great
tools for HTML5, Muse and Edge.
HTML5 fight with Flex is on: Adobe online games are
beating HTML5 with over 1000 games written compared
with few hundred on HTML5. HTML5 is already almost
universally supported in mobile browsers and Adobe
realized that Flash would never get that ubiquity across
browsers. HTML is supported by 40% of web Browsers
while Flash 99%. Feature supported are browser
dependent with no 3D support while flash has plugin.
Security: Flash is miles ahead: In order to hack HTML5
Right click view source while in flash you need to get
swf file which is loaded through wrapper parent then
hacker needs to go through 2 layers of encryption and
obfuscation. Majority flash book games are flash. With
Flex 4.5 SDK build and deploy applications for Google
Android, Apple iOS and BlackBerry Tablet OS platforms
leverage one tool, one framework and one codebase
to deliver apps across leading mobile platforms, not to
mention web and desktop as well.
But then reality is still HTML5 has more issues with
Andriod and iOS while Flex has few.
Figure 3. source Finance.google.com (showing comparison of Adobe,Microsoft and Dow Jones index

Gamification of ERP enterprise software, Augmented Reality on mobile apps, ipTV
05/2012 (35) 31
SANDEEP SHARMA
Solution Architect/Product Manager, 10 + yrs experience
SAP/Oracle Peoplesoft, Flex, AJAX, Business Intelligence,
Datawarehousing, Enterprise Application Integration,
Security. Worked with companies like SAP, Oracle Peoplesoft,
Ness Technologies, Cognizant technologies. Loves Marathon
running, Soccer, and adventure sports like Mountaineering.
Flex is HTML 5 + more
Flex is no.1 choice for enterprise complex, high-fidelity
enterprise applications such as business dashboards,
line of business tools, real-time trading applications
and desktop replacement applications, and see
leading companies in healthcare, financial services,
communications and other industries standardizing
on it. HTML5 has not matured yet. Flex is a choice for
following reason:
• SDK and Compiler open sourced MPL license,
HTML 5 open standard WHATWG license, Adobe +
on Flex new 3d – graphics, (transformation scene,
camera, lighting, change pixel data, effects)
• Real-time connection (HTML5 has websocket vs
Flex has flash.net.socket), Drag and Drop (drag
and drop across application, cross document,
clipboard) with API’s flash.desktop.clipboard,
Events.NativeDragevents, Flash.desktop.Transferab
leData Vs HTML5 DataTransfer and DragEvent.
• Adobe provide better file system (in HTML5 input
type upload storage api vs Flex has File, FileStream,
Filemode) (read/write capabilities), Offline Access
Adobe air provides Resource(Windows application
Vs Application cache) State (air.Event.NETWORK _
CHANGE _ URLMonitor vs navigator online)
Data (flash.data.SQLConnection vs HTML5 has
Database, SQL Transaction, SQLResultSet, Local
Storage. New HTML 5 products which also use Action
scripts as base new HTML5 products, Adobe Muse(TM)
and Adobe Edge preview.
Cloud: Adobe’s creative tablet applications+, such
as Photoshop Touch, into everyday work – seamlessly
synchronizing and storing files in the cloud for sharing
and access on any device.
Adobe Typekit launched in Oct 2011, the Web-
based font library that pioneered the use of real fonts
on websites, delivering more than 700 typefaces from
leading foundries.
Adobe Edge, a ground-breaking HTML5 development
tool; and Digital Publishing Suite Single Edition, the
technology behind the delivery of digital magazines on
iPad.
Adobe new Open source strategy: As Flex moves
into a community-driven open source project, Adobe
will make initial technical contributions and will also
continue to provide a team of full-time Flex SDK
engineers to contribute to the Apache project.
Adobe is currently in the process of contributing the
core Flex SDK (including advanced data visualization
components), automation libraries, AIR SDK binaries,
documentation, and specifications to the Apache
Flex Project. Also contribute yet-to-be-released
Spark components including ViewStack, Accordion,
DateField, DataChooser, and an enhanced DataGrid.
Other future contribution to project include Falcon JS
new compiler for action script, Mustella a functional
testing framework, BlazeDS code is already available at
adobe.com/go/blazeds_source under the GNU Lesser
General Public License, Version 3.
BlazeDS provides Java based server-side remoting
and web messaging technology allowing Flex clients
to exchange typed binary data with the server and
receive notification from other clients and servers. The
messaging service also allows Flex applications to
exchange messages with other non Flex, JMS-enabled
applications.
Flex Sparks components and the recent addition of
the new mobile components provide a great and mature
framework basis for a real open source effort
Next generation Experiments on Flex.
Gami�cation of Enterprise Software like ERP, BI,
BPM etc
Enterprise gamification to date has really been about
marketing and customer engagement. By gamification
it introduces unrealized concepts of social collaboration
and create the ad hoc collaboration, engagement
metaphor help companies realize these lofty social/
collaborative goals. people are more engaged, more
able to understand and support the outcomes that
matter to the enterprise, and they are being recognized
and rewarded for these actions. Adobe with Flash based
online games and enterprise grade Flex development
platform is greatly positioned for that.
Augumented Reality
Augmented reality (AR) is a field of computer
science that involves combining the physical world
and an interactive, three-dimensional virtual world.
For a complete project with Flash on AR visit http://
www.adobe.com/devnet/flash/articles/augmented_
reality.html.
Video game industry is major employer of AR. Its not
the end of game we have business intelligence system
employing Augmented Reality (http://youtu.be/mTflf_
PqUYs).
AR for ipad, android, ERP like SAP, Business Process
management is getting lot of traction for all this Flex
and Flash is greatly positioned. On SAP TV watch
augmented reality (http://youtu.be/C4b2Npnbhz0).

05/2012 (35)32
FLEX AND PHP
F
lex as its name suggests is very flexible
technology framework. It can connect to almost
all server side and scripting languages to
connect to database and do other server stuffs. As it
can connect to almost all languages, it can be hosted
on all kinds of server platforms.
Now let’s focus on our title of the article. Flex can be
connected to PHP to connect to database and do other
database activities. There are 3 ways of connecting
Flex to any server side language: 1) Remoting, 2) Web
Services 3) HTTP service. PHP can be used in all 3
ways.
Flex with PHP by Remoting
AMFPHP is one of the remoting ways to do it. AMFPHP
is another open source framework provided by open
source community. You just need to download the
AMFPHP folder from its website and put that folder into
your root folder of web server. Then from the following
steps you can connect the PHP code through AMFPHP:
Using mxml
-----------------
<mx:RemoteObject id=”myRemote” destination=”phpclassname”
source=”folder.phpclassname”
endpoint=”{http://localhost/amfphp/
gateway.php}” showBusyCursor=”true”>
<mx:method name=”Select_Gender” result=
”onGetGender(event)” fault=”onFault(event)”/>
In the above code,
• Select _ Gender is the php function in which some
code is written to connect to database and get the
required infromation for a particular gender.
• destination is the php file name where the function
is written.
• and source is the folder where php file is located.
And result and fault event will have result handler and
fault handler functions to handle success and failure of
the php function call.
Another option for Remoting is WebORB which can
also be used by Remoting to connect Flex with PHP.
Flex with PHP by HTTP Service
HTTP service is another way of connecting Flex with
PHP. In this method you need to create PHP files on
some remote server or on same server as php file. You
need to call that php file by some Flex classes or tags
with the help of HTTP protocal just like you are opening
a url in a browser, and handle result and fault event of
it.
Following is the sample code for that:
<fx:Declarations>
<s:HTTPService id=”sampleTest”
url=”{„+phpurl+”}abc.php”
result=”sampleTest_resultHandler(event)”
Different Ways of
Connecting Flex to PHP
Flex is a client side technology originally developed by Adobe and
now Flex SDK transferred to open source Apache community and
Flash builder, the editor for Flex, is still there with Adobe which will
be supporting Flex SDK now.
• Basic idea about web server folder structure.
• Basic idea about web services.
• Basic idea about http services.
• You can do some php coding for select query also.
• You should have basic knowledge of Flex SDK and Flash
builder.
• You should have Object Oriented concepts clear of how to
create functions etc.
• You should have basic knowledge of Action script.

Different ways of connecting Flex to PHP
fault=”sampleTest_faultHandler(event)”
/>
</fx:Declarations>
<fx:Script>
<![CDATA[
protected function initialize():void
{
sampleTest.send();
}
]]>
</fx:Script>
In the above code we have added an HTTP Service
tag and added an actionscirpt function to call that http
request by send method of the HTTP service. And
we need to handle result and fault of that call in result
handler and fault handler functions we have declared
in the HTTP service tag.
Flex with PHP by Web Service
Web Service is the most common way to interact a
service side technology to any client side technology.
Because Web Service follows a common standard to
sending and receiving data. There is the sample of code
for connecting Flex with PHP by web service:
<mx:WebService
id=”sampleTest”
wsdl=”http://localhost/flexapp/myfile.php?wsdl”>
<mx:operation name=”SelectGender”
resultFormat=”object”
fault=”mx.controls.Alert.show(event.fault.faultStr
JIGAR OZA
Currently Working at Rightway Solutions as Flex
Developer I have experience of 4+ years in Flex
with .Net, PHP. I have worked on web applications,
Desktop Applications and Mobile Applications in
Flex. I have worked with almost all databases like
MySQL, SQLServer, MS Access.
ing)”
result=”sampleTest_resultHandler(event)”/>
</mx:WebService>
In the code above we have declared a Web Service
which is accessing a PHP web service defiled in
WSDL property of Web Service tag. And we have
called the php method by operation tag under Web
Service tag. We have handled result and fault of
the web service by result handler and fault handler
functions.
After presenting all 3 methods, I would like to focus on
some more aspect of Flex and PHP connectivity.
Security
Remoting and Web Service are more secure ways than
HTTP Service because HTTP service allows browser
add ons such as FireBug to see what request was
sent to server and what response came back. While
remoting and web service doesn’t allow that.
Speed
As per the speed of the response is concerned, Remoting
is the fastest method followed by HTTP service and
Web Service. So we can say that Web Service is the
slowest method for Flex and PHP connectivity.
a d v e r t i s e m e n t
www.flexer.info

05/2012 (35)34
THE FUTURE OF FLEX
N
ovember 2011 will be a month long remembered
by Flash developers, Apart from announcing
the discontinuation of the Flash Player
browser plugin development for mobile devices, Adobe
announced its intention to donate the Flex SDK to the
Apache Software Foundation.
While the former, although perceived by the tech
community as the demise of Flash, was seen by many
Flash developers as a better use of Adobe resources.
Flash platform developers rarely targeted the mobile
browser plugin and it made no sense to continue
investing in it, given that there were hundreds of devices
it needed to support and several mobile browsers while
almost each one required special attention (by Adobe
as the plugin developer and by the Flash developers
themselves for the content), this sort of fragmentation
did not bode well for the mobile browser plugin along
the years.
The latter caught Flex developers truly by surprise.
Some were thrilled to hear that now Flex truly goes
open-source, allowing the community to contribute and
to extend the platform as it sees fit.
But some, mainly from the enterprise market, saw it
as if Adobe was trying to “get rid” of Flex.
The fear of the enterprise market was understandable,
how can there really be a future to the Flex framework when
Adobe controls AS3 and the Flash and AIR runtimes?
If at any point, Adobe decided to stop development on
either, what will become of Flex?
Sure, Flex is open-source but without the runtimes, it’s
pointless. In the FAQ published on the Adobe website a
few days after the announcement, one of the questions
was: “Does Adobe recommend we use Flex or HTML5
for our enterprise application development?”
And the first paragraph said it all “In the long-term, we
believe HTML5 will be the best technology for enterprise
application development. We also know that, currently,
Flex has clear benefits for large-scale client projects
typically associated with desktop application profiles”.
Although the rest of the FAQ focused on how committed
Adobe was to Flex, how it’s still a viable technology and
the fact that they are committed to their runtimes for what
seems like a minimum of 3-5 years, the general feeling
was as if Adobe has abandoned Flex and its developers.
Did this move kill off Flex completely? Absolutely not!
Will it make developers think twice before using Flex
in a project? Perhaps.
HTML5
Let’s say that you were given a certain project and you
had to complete it in Flex and in HTML5, there’s a high
chance that the HTML5 project would take longer to
complete thus making it more expensive.
Moreover, bringing the HTML5 project to its Flex
counterpart’s robustness and quality may be deemed
impossible in the state of HTML5 today.
Flex developers, understandably, feel that HTML5
has nothing better to offer than Flex has in its current
The Future of Flex
What’s next for Flex?Will open sourcing it breathe new life into it or
has it been“left out to die”?
• Recent developments since Adobe decided to contribute Flex
to the Apache Foundation
• Is Flex still the right choice for large scale desktop
applications?
• no prior knowledge is required

The Future of Flex
05/2012 (35) 35
state. If anything, they feel like they’ve taken a step
backwards in terms of framework capabilities.
Nevertheless, there are large efforts being put into
HTML5 frameworks by many companies, Sencha, for
example, apart from investing in its HTML5 frameworks
also invests heavily in professional training to Flex
developers, easing their switch to HTML5 and the
Sencha framework.
Adobe, on the other hand, stated that is currently
doesn’t have plans to develop any product targeted at
enterprise scale user interface development.
As it is well known, they are investing in tools for
HTML5 development (that’s the main reason that
they’ve moved away from Flex), just not an HTML5-
based platform like Flex.
FalconJS
What is FalconJS?
Adobe’s website describes FalconJS as “an ActionScript
to JavaScript cross-compiler based on Falcon, Adobe’s
nextgeneration,multi-threadedActionScriptcompiler.From
a distance, Falcon’s architecture looks pretty much like any
other compiler architecture: a language front-end parses
source code and creates an abstract syntax tree (AST),
which gets reduced to machine code by a code generating
backend. In Falcon’s case the language front-end parses
ActionScript and the backend generates byte code that can
be interpreted by an ActionScript Virtual Machine (AVM2)
like the Flash Player. We call that byte code “abc”, which is
the abbreviation of “Action Block Code”…
.. “Most people are probably more familiar with SWF
and SWC, which are just different package formats for
abc byte code.
The FalconJS compiler can truly be a breath of fresh
air, as it mitigates the fear of Flex’s demise in case of
the discontinuation of the Flash and AIR runtimes by
Adobe.
FalconJS as a concept, allows Flex to be “fully” open-
source as it detaches itself from the Flash Player and AIR
runtimes and exports content that can be run in a plug-in
free environment. There are 2 problems with this:
• Javascript is inferior to Flex in terms of application
development, moreover, Javascript isn’t truly object
oriented meaning that porting a complex Flex-
based application to Javascript will require some
sacrifices in terms of functionality and robustness
• FalconJS’ release date is currently unknown
Business Market
Flex was mainly developed to fill a certain need in
the enterprise market, Adobe worked hard to provide
businesses with the tools required to create large scale
applications and to make Flex the #1 choice for creating
such applications.
But what now?
Is it still safe to start developing a new large scale
applications using Flex?
This is indeed the question every team leader and
every CTO needs to face nowadays when approached
with a new project.
The answer is yes, given that you’d like to see your
application in production in the very near future.
Enterprises realize that the Flex framework is stable
and here to stay for the foreseeable future, even though
its name and the Flash Platform’s name as a whole
were tarnished in recent years.
Enterprises also understand that it’s currently
time consuming to keep up with the latest HTML5
frameworks (let alone know if they will be around for
years to come), moreover, these frameworks may not
be mature enough for their needs at the moment.
Projects need to be cost-effective and currently
there’s nothing more cost-effective than releasing your
application using the Flex framework.
With the latest Flex SDK (4.6) you can release your
large scale projects to the web, to iOS and to Android
with the same codebase in no-time!
Summary
Now that Flex is in the hands of the community we’ll
see if indeed the community will be able to bring new
life and the expand the Flex framework. Since the Flash
Player itself is not open source and since its release
cycles are still controlled by Adobe, the community will
only be able to expand the framework according to the
limitations of the latest Flash Player at that moment.
I, for one, am still going to use Flex in the next couple
of years as it allows me to create enterprise level
desktop and mobile applications in a shorter time than
any existing technology.
Nevertheless, I’m going to continue expanding my
knowledge with new HTML5 frameworks as they
come out. Although it’s become cliché to say it, you
as a developer need to choose the right tools for each
project.
The technology is just a means, as long as the end-
product meets the requirements of the project, you
know you’ve done the right choice. So what will be the
future of Flex? It’s in your hands now.
DANIEL ALBU
Daniel Albu is a freelance Flash platform
developer with more than ten years
of experience in the production and
deployment of rich media websites,
games and applications. You can visit his
website at www.danielalbu.com, read
his blog at www.�ashdeveloper.co or follow him on Twitter
(@danielalbu)

Ffd 05 2012

More Related Content

What's hot (9)

Similar to Ffd 05 2012 (20)

More from Sandeep Sharma IIMK Smart City,IoT,Bigdata,Cloud,BI,DW (20)

Recently uploaded (20)

Ffd 05 2012