[Flex/Air]

Mai 2013

Code Behind with Flash Builder step by step

The basic idea is to use Action Script Classes instead of fx:Script tag and keep mxml only for design.

Here the full workflow and a Flash Builder project if you are lazy ;) Download Me

Step 1
Create your flex project



Step 2
Rename your main mxml file as Main.mxml



Step 3
Right click on src and add a package com.domain.project ( don’t put your MainClass in the root folder, FB can’t handle it )



Step 4
Add your brand new namespace




Step 5
Create your MainClass.as in your package. Note that class have to extends spark.components.WindowedApplication



Step 6
Switch back to Main.xml and link to the MainClass. Note the demo:MainClass tag



Step 7
Check if everything is Alright. Here i add a listener on the FlexEvent.APLLICATION_CREATED



Step 8
Design your view in creation mode if you have FB 4.6 and lower :/ (yup I won’t update FB)



Step 9
Add an ID to element that you want to manipulate in AS



Step 10
Then declare all those elements as public var



Step 11
Add some AS to handle interaction

And voilĂ  :)

Here a real life use case I worked on with this method : http://www.maison-deco.com/2d-3d


Vote in HexoSearch