Skip to content

Working with AIR2.0 beta and nativeProcess – walkthrough

Like I mentioned in my previous post I decided to wrap up what I’ve learned working with AIR2.0 and share it with community. Air2 beta was released 2 days before I was told to research on a scenario of running a native application along with AIR app. There are a few solutions available that can already do it and you don’t actually need to use AIR2 nativeProcess if you have similar requirement but I decided to look into AIR2 a bit closer.
Because the app is not going to be publicly available and it is going to be installed manually along with runtime (not over the web) the risk of the app misbehaving or not working at all is massively reduced. That’s only IF. The big IF was if the application is going to behave as expected and after putting a few lines of code I must admit that it does. If it hasn’t I would have probably gone with Shu or Zinc. But luckily I didn’t have to thanks to nativeProcess fuctionality available in Air2.

So, what can you do with nativeProcess? You can run any native process on user’s machine (exe for Win users, dmz for Mac).
In my case I was porting an online app to work offline and the problem was that app was heavily reliable on external services and making it work without those simply wasn’t going to work. I had to have services running on localhost and serving whatever the live service would have served. Thank God it only had to work on Windows but I will explain why later.

Prerequisites
In order to get anything done and actually to be able to test anything there are some prerequisites like I mentioned in previous post, which is getting the runtime and overlaying Flex SDK with AIR SDK. The next step is to change descriptor namespace to

xmlns="http://ns.adobe.com/air/application/2.0beta"

. The next thing in order to get access to nativeProcess is to set up one more parameter in the descriptor.

<supportedProfiles>extendedDesktop</supportedProfiles>

.
This was a really gotcha because I found one article not stating anything about it, second one stating it should already be there and doing more research I discovered it has to be added manually. That’s all what’s required to take advantage of a nativeProcess

I would expect those descriptor changes to be included in final release of AIR2. I assume the xml namespace will be generated automatically and supportedProfiles is going to be commented out like the rest of params you can set in the descriptor file.

Using nativeProcess
First thing to do is worth checking in native process is available by checking if

NativeProcess.isSupported

returns true.
If it does, the rest should look like this:

private var file : File;
private var nativeProcessStartupInfo : NativeProcessStartupInfo;
private var nativeProcess : NativeProcess;

private function preinitializeHandler(event:Event):void
{
    if (NativeProcess.isSupported)
    {
        trace("NativeProcess.isSupported");
        //get the directory
        file = File.applicationDirectory;
                // point to the file
        file = file.resolvePath("bin/mynativeProccess.exe");

                //define process startup information
        nativeProcessStartupInfo = new NativeProcessStartupInfo();
        nativeProcessStartupInfo.workingDirectory = File.applicationDirectory;
        nativeProcessStartupInfo.executable = file;
       
                //instatiate the process
        nativeProcess = new NativeProcess();
                // start the process
        nativeProcess.start(nativeProcessStartupInfo);
    }
}

Setting the workingDirectory on nativeProcessStartupInfo to be application directory is required if you need the process to know where the files are. Running the exe standalone was showing the process folder to be where it was called from, but running it through AIR was changing it to C://Documents and Settings/user folder for some strange reason.

That was it for me. I didn’t have to write any data to the process directly because my service was doing it for me. However if you need to communicate with the process you can do it.
Here is an article on how to do it:
http://www.adobe.com/devnet/air/flex/quickstart/interacting_with_native_process.html

Other thing worth mentioning is the fact that AIR will kill the process you have started when you exit the AIR application. There is no need for additional handler to kill it. You can also stop the native process anytime you like by calling

nativeProcess.exit()

.

Packaging it all up
At this stage everyting seems to be working as expected so it is time to release the app. Because I am using Eclipse with FlexBuiler plugin (3.0) I would normally do Project -> Export Release Build from the navigation, but when you are wrapping a native process this option is not available to you. You need to use ADT in order to achieve this (more on ADT here).

First thing to do would be to add FlexSDK+AIRSDK/bin folder to PATH in Environment Variables. This will allow you to type “adt” in any folder or your machine from the command line. I recommend checking you have the correct version by typing

adt - version

to see if you are using the right version of ADT. If you get “2.0.xxxxxx” you are good to go. I only realised that after a couple of attempts and I was getting really frustrated by ADT misbehaving. I was pointing to ADT in a different SDK and version of it was 1.5. This version of ADT didn’t quite understand what it had to do.

Moving forward was getting the certificate. You need it for ADT to publish an app and the easiest way to get it is simply by publishing the application through Project -> Export Release Build. There is an option there to publish certificate as well. I think that’s the easiest and quickest way to get one.

With all those tasks done, the next step is to finally run ADT and get the actual AIR application. So, from the command line, go to your bin folder of your project where your descriptor.xml and application.swf is located along the all the files you want to include (your should have your native process there) and run:

adt -package -storetype pkcs12 -keystore yourCertificate.p12
-storepass yourPassword -target
native yourApplicationName.exe
yourDescriptorFile.xml yourApplication.swf
yourFolderToInclude1 yourFileToInclude2 ...

Make sure it’s all in one line as well.

This should result in ADT spitting out yourApplicationName.exe which is a native AIR installation file. Good enough for me. I am working on a PC, I get an exe I can run, it’s all good. Hold on, what if I wanted to release it for a Mac as well? That simply wouldn’t work, it turns out I would need a mac to do it!

In my case this wouldn’t work anyways, because my nativeProcess is a service build on Microsoft .NET, but hypothetically I could have had someone written the same functionality of my native process for a Mac. Then I could do a simple check of system capabilities and launch appropriate native process dependent on that. This scenario shows how with using native process you loose the key AIR feature, which is AIR being cross-platform. “Loose” is maybe a bit too strong, but making it harder and more confusing for a developer to develop cross platform. I wonder why this is done in such a weird way without the ability to publish to multiple platforms. If you have Flex+ AIR SDK installed on your machine it means you actually have both runtimes: Win and Mac. They both sit in SDK/runtimes folder and this is what ADT needs, unless there is something else that needs including and is probably licensed. I don’t see any other explanation for this. Also worth mentioning is the fact that Adobe doesn’t mention anything on how to run a native process on Linux.

Conclusion
New features of AIR 2 are really impressive. I am particularly interested in multitouch and gestures. Native applications have also a great potential. But I am a bit concerned about security here, especially if a developer has bad intentions. Imagine you had a worm packaged with your air app or any other form of malicious crap. It does sound scary. Apart from that I don’t see anything else that would do more harm than good. The same applies to beta apart from the fact it’s only a beta.

Releasing the app as AIR2 beta app is not something I would recommend unless you will have control over the machines it will be installed on. If you release your app as Air2 beta it will only work on a machine with this specific runtime installed. The runtime will not update itself from 1.5 to 2.0 beta, like it has for example from 1.4 to 1.5 when application needed it. In order to take the advantage of those new features in 2 beta the runtime needs to be installed manually. According to Developer FAQ runtime will upgrade itself automatically only to final 2.0 runtime when it’s released but it’s got nothing to do the same with beta. Also Air 2 beta will expire.

Because you can only have 1 runtime installed if you decide to go with this beta you put at risk all other AIR apps a user can be running. I have had the beta runtime installed for over 2 weeks now, I am running a few AIR apps almost the whole time (BBC iPlayer, TweetDeck) and I haven’t noticed anything wrong with the runtime. None of the applications have never crashed or anything like it, but the fact it is only a beta proves Adobe still isn’t totally confident with it.

If you want to play with it I would highly recommend checking out release notes:
http://labs.adobe.com/wiki/index.php/AIR_2:Release_Notes
for what’s new, what the known bugs are, etc. and reading the Developer FAQ:
http://labs.adobe.com/wiki/index.php/AIR_2:Developer_FAQ

You will notice some inconsistencies in the documentation, but if you have time and enjoy investigating, it might actually be loads of fun. I really enjoyed it.

Any questions, problems, suggestions just give me a shout.

Posted in development.

Tagged with , , , , , , .

4 comments

By admin – November 30, 2009

Air 2.0 beta NativeProcess.isSupported gotcha

If you wanna start playing with new AIR 2.0 there are a couple things you need:
1. Runtime
2. Air 2.0 beta SDK (installed on top of Flex SDK)
3. New app.xml descriptor namespace which is

xmlns="http://ns.adobe.com/air/application/2.0beta"

But if you want to launch a native app from air, they forgot to mention in the documentation that you need to add

<supportedProfiles>extendedDesktop</supportedProfiles>

to the same xml.

Now if you check

NativeProcess.isSupported

you should get true, which means you can run a native app. You don’t have to be packaging your air app throught ADT or do anything else to see this boolean to be true. It should work in FlexBuilder straight away. Packaging it up is probably a good material for another post. Hope that helps.

Posted in development.

Tagged with , , , .

4 comments

By admin – November 18, 2009

Dependency Injection, frameworks and other latest AS3 trends, Robotlegs, Dawn, Parsley?

Attending last LFPUG meetup got me thinking about all the latest Flash and Flex development, especially in the way in which this development is going. I think the community is becoming much more mature and this can be observed by the number of frameworks that have recently poped up. Everyone is blogging about it, and you can actually get lost in all those differences each of the frameworks has. But almost all the frakeworks are build on design paterns, which is definitely a good thing. When it comes to Design Patterns it is pretty straight forward. If you don’t know what they are I suggest doing some research because using design patterns makes your code much more elegant and structured.
Here is what wikipedia says, and remember that wikipedia is ALWAYS right:

n software engineering, a design pattern is a general reusable solution to a commonly occurring problem in software design. A design pattern is not a finished design that can be transformed directly into code. It is a description or template for how to solve a problem that can be used in many different situations. Object-oriented design patterns typically show relationships and interactions between classes or objects, without specifying the final application classes or objects that are involved.

The whole article can be found here.

Bear in mind that not all the design patterns apply to AS3 because of it’s uniqueness (being an OOP language on client side, not server side). Practical use of design patterns in AS3 was well presented by Eamonn Faherty during the LFPUG’s first session. Eamonn seemed to be pretty confident talking about various patterns and I highly recommend you watch the presentation on LFPUG’s site

If that’s not enough for you, you can always get O’reilly’s book for your iPhone/iPod “Actionscript 3 Design Patterns”. Simply search for “O’reilly Design Patterns” in the app store and this book should come up. I got it myself and I find it really handly to have it will me all the time even if you are only using it to show off what cool apps have. It does the job.

Second session on Frameworks was presented by Richard Lord. Richard is well known in the flash community especially because he’s the man behind Flint, the particle system for flash. That is not the only thing Richard is well known for. Second thing is frameworks. He was even presenting on this year’s Flash on the Beach about frameworks and if you look at his blog it looks like he can call himself an expert. I didn’t make it Richards presentation on FOTB because the conference room got filled out to the max. So for those who had seen it, I recommend you watch what he presented on LFPUG because it seemed that what he added to his FOTB presentation was the most interesting stuff, mainly Parsley and Robotlegs.

I assume all of us heard of Cairngorm, PureMVC and roughty heard of Mate and Swiz.
We constantly hear to stay away from Cairngorm because it’s simply shite (although many of the people who say that have never actually used it), PureMVC is not fun to work with, Mate being only flex framework and Swiz being apparently really good but also working only with flex.

I must admit I am a fan of PureMVC because I believe days of cowboy coding are over. There has to be a unified way of writing code in this industry and PureMVC was the first one to make it happen, especially in the flash department. It’s got it’s pros and cons, but it definitely serves it’s purpose. Code in pureMVC is (usually) neatly organized and if you don’t know it, it means you are way behind.

So what is next?
To me it looks like the next big thing is Dependecy Injection and frameworks build on it. Basically all the frameworks apart from Cairngorm and PureMVC rely on DI. The easiest definition I found:

At the simplest, Dependency Injection is that act of supplying objects with their instance variables or properties. When you pass a variable to the constructor of a class, you are using Dependency Injection. When you set a property on a class, you are using Dependency Injection. If you aren’t coding your AS3 in a strictly procedural or linear fashion, the odds are that you are making use of Dependency Injection right now.

Dependecy Injection always comes with a second term Inversion Of Control. IoC container is nothing else than a container that uses DI, it’s pretty straight forward.

DI and IoC are just one of many things that came to Actioscript from other OOP languages. And I think it’s great. It means we are not re-inventing the wheel, we simply apply the best patterns, aka problem solvers from much more mature languages like Java to AS.

So, looking at what we have available in terms of DI and IoC in Actionscript are the following:

Spring Actionscript (formerly known as Prana).
Prana was the first framework using Inversion of Control for ActionScript 3.0. It was nothing else that a port of Spring Framework for Java. I have never used and I don’t think many people actually have. I think it is mosty the Java reference that puts people off but that’s just my opinion.

SmartyPants IOC
SmartyPants apart from it’s really interesting name it is the one that started the whole Dependency Injection trend. SmartyPants is not a framework itself it is only the IOC container. It is a bit verbose but it’s pretty good to get your head around DI, because it is the only thing it covers.

And here is where we come to the main reason why I wanted to write this post.

Robotlegs
Robotloegs is awesome. Robotlegs is a MVCS framework based on on Dependency Injection using Flash Events. Why MVCS? Well the author, Shaun, decided to split the model tier of the architecture into Model itself, accessed via internal API and the service where the external data is loaded into the application. Which sounds pretty resonable approach and it’s a minor change in terms of MVC approach. I personally quite like it. THe next thing you would expect is SmartyPants to handle DI. Wrong! Guys working on Robotlegs decided to write their own dependecy injection tailored to Robotlegs. And so they did giving it anoter original name SwiftSuspenders. Cool thing about Robotlegs it that you are not limited to using SwiftSuspenders. You can choose your own Dependency Injector if you don’t like the one it comes with by default. I started digging a few days ago into RobotLegs and I must admit it is really fun thing to work with.
It’s not what we had with pureMVC where you were told how to use it and that was it.
There are a lot of discussions how Robotlegs should evolve, what should be added, removed and if you have anything good to suggest, you will be heard.
I suggest you start following the Robotlegs google group.

I personally think it will be the next big framework, the pureMVC 2.0. The sooner you get into it the better. It works with Flex as well as Flash, which many of those other frameworks lack, they have no love for Flash. But is it the only solution that works with Flash as well as Flex? Certainly not.

Other player here is Parsley. Parsley has been developed by PowerFlasher, same guys who developed FDT. I haven’t played with it yet, it is definitely on my list. But following people opinions (which I don’t think is the best thing to do), I hear although it is pretty well documented, there is no community behind this framework. This is not gonna put me off but it definitely is a huge disadvantage.

Is that all?
There is one more candidate on the horizon. Probably not many people have heard about this framework. It’s called Dawn. Dawn relies on SmartyPants it’s own DI and is also inspired by Guice (just like the SmartyPants itself). If you are into checking it out, I suggest you visit their site and if you live around London, Sam, the author, will be presenting it on next FLUG on 17th of November 2009.

Summary
Robotlegs is gaining loads of momentum, it is definitely worth checking it out. I guess the whole DI stuff if fairly new and it is interesting how things are gonna go with it. But keep your eyes open on Parsley as this it the framework that apparently Adobe uses and their Caringorm 3 is pretty much gonna be like Parsley, from what I’ve heard. Also have a look at Dawn it might turn out to be also big.

If you have any questions, comments, or you disagree let me know :)

Posted in Uncategorized, development.

Tagged with , , , , , , , , , , , .

20 comments

By admin – November 9, 2009

FlexBug – great tool for flex debugging

At last Flex London User Group meetup one of the guys presented FlexBug, great tool for flex debugging with runtime actionscript injection. It is an adaptation of FlexSpy

Flexbug comes with an example on how to use it, which is really handy. To see what FlexSpy looks like in action click here.

flexbug

Posted in development.

Tagged with , , , .

No comments

By admin – October 4, 2009

Going to Flash On The Beach ??

There is a pre-Flash on the Beach pre-party burgers on Sun 6PM @ GBK in Brighton.
More info here:
http://upcoming.yahoo.com/event/2824261

Posted in Uncategorized.

Tagged with , , .

1 comment

By admin – September 18, 2009

Flash player bug: content disappearing on macs when mouseX used

I discovered a bug in flash player which is quite hard to debug if you don’t have a mac. It’s got to do with mouseX values going crazy on macs. It occurs in Safari, Firefox and most likely on IE.
MY issue was that i had parralax scrolling in place. Parralax scrolling was repositioning background and content based on mouseX value.
Now when a user clicks away from the browser to any other application mouseX valuse goes mental. I was getting something like -1787232.

Apparently Adobe is already working on it, but when is it going to be realeased is unknown. Quick fix for this would be to wrap whatever you are doing by checking if the mouseX value is actually within the stage:

if (mouseX > 0 && mouseX < stage.stage.width)
{
// do stuff
}

You obviuosly need to make sure you have access to stage as well.

I hope that helps. It is really painfull to fix if you don’t have access to a mac and even if you do you would probably need to install FF, content debugger, flash tracer, etc. etc. Remembering this will save you from all of that :)

Posted in development.

Tagged with , , , , .

5 comments

By admin – September 17, 2009

Away3d equalizer

Last week I attendened 2 day course on Away3d which was presented by Away’s 3d core developer himself, Rob Bateman. The course was organized by LFPUG (btw there is more training coming up, have a look yourself) and it was really worth the money. First day was about 3d basics, second covered more advanced stuff like extrusion tools, away3d flartoolkit, wiimote etc.
There was some free time to experiment and I came up with this simple 3d equilizer. Have a look below.
Controls:
Mouse down and spin,
Mouse scroll or Key.UP, Key.Down – zoom

You can also add more blocks to the grid with buttons on the clip.
There is some weird computeSpectrum bug in FF. It fails randomly. If it fails, reload :)

This movie requires Flash Player 9

Source here.

You will obviously need away3d lib and an mp3.
Full browser view here

Posted in Uncategorized.

Tagged with , , , .

No comments

By admin – July 20, 2009

LFPUG recap

To those who didn’t have a chance to go to LFPUG last night here is a quick recap. It was all about 3d if flash by the guys who developed Papervision 3d (if you don’t know that yet:)

First session was called “Papervision. Simplified” and was presented by Seb Lee Delisle.

Seb explained how the whole 3d world works in flash and showed basic calculations with a few examples. He showed spinning earth and a few basic things that everyone who is into 3d should know. At the end he showed his latest project called Big and Small that  can be found here: http://www.bbc.co.uk/cbeebies/bigandsmall/

It is a really nice 3d website who’s audience are generally kids. Really worth checking out.

Other interesting stuff Seb showed was the sky box. The effect is that you are flying through the infinite 3d space passing various objects. You achieve it by creating a cube and putting the camera in the center. You have to have a specific texture that joins smoothly on the edges of the cube. Adding simple particles that come along with PV3d makes it looking really complex but is really easily achievable with just a few lines of code. Last but not least was Lunar Lander 3d he build for a 5k competition. Seb explained the concept of it and showed how he approached it. It’s amazing how much can you achieve with only 5K. And 5K is not the budget it’s the filesize.

More info on Seb’s site (www.sebleedelisle.com).

The second session was called “We make. You Enjoy” by Carlos Ulloa. It was a bit of an ad for his agency but was interesting as well.

Carlos explained how he created the HelloEnjoy.com logo and he also showed what he is currently working on.

Along with the logo that has got a dynamic bitmap and shades he also showed his latest achievement which is a really slick looking monster truck. Basically it is a 3d scene put together with physics engine, shades rendering and some lighting. Carlos went through the entire process of explaining how it works, how physics engine works, how collision detection works and how do certain elements respond to it (suspension of the car for example). I hope to see this stuff online soon. You can always check his website here (http://www.carlosulloa.com)

If you want to find out more visit the LFPUG website and check out the Presentations section. Tink promised to get videos up there pretty soon so you should be able to see it for yourselves.

Posted in development.

Tagged with , , , .

4 comments

By admin – May 1, 2009

Windows 7 beta, Flex Builder and debugging.

I recently got a new laptop and I decided to install Windows 7 on it. After installing Flex Builder I thought everything was ok until I needed to debug one of my projects. I got this annoying message: Waiting for Flash Player to connect to debugger. It was timing out every single time. Pretty annoying! After a couple of attempts of changing UAC settings, looking up ports etc I found a solution here. Basically what you need to do is specify where your application is running. Right click on the flash content -> Debugger, select Other Machine,  enter “127.0.0.1″ and click Connect. Also make sure you have the debug player installed.

Posted in development.

Tagged with , , , , .

14 comments

By admin – March 8, 2009

Are you a flash developer? Use Flex Builder

After completing a flex project build in Flex Builder I got so much into using FB’s features that going back to FDT didn’t sound to optimistic. I figured out there was no reason why I acutally had to do it. Going through the pain of getting Eclipse, FDT, setting core libraries, etc.  was enough pain to stick to Flex Builder. I absolutely love the debugger and working without it is almost like writing code in Notepad.  It is really simple to set up. Flex Builder comes with 60 day trial, so it is definitely worth checking it out. Plus it is actually cheaper than FDT ( FB  is 249USD, FDT Basic is 299Euro).  Once you install ir and run it just goto File -> New -> ActionScript Project. In the popup specify the Project Name and Location. Clicking on Finish and you’re done! What FB will do is set up the entire project for you. When you compile (shortcut F11) it will create a swf from your class, wrap it up in html and launch it in the browser. Forget about FLAs, Flash IDE, Class Documents and all that crap!

Give it a go and you will never want to go back! Now, if you really like it there is a much better way to set it up.

If you create a new Flex Project instead of ActionScript Project FB will set up bin, src, libs, html template folder and create your application MXML. What you have to do next is create your new Main class in the src folder. Now right click on the Project Name and go to Properties and choose Flex Modules. In there click “add” and locate your Main class.  Make sure you choose “Do not Optimize” in order to get the class compiled as a seperate swf rather than pulled into your main swf compiled as a flex app. Now the only thing you have to do is to load your swf into your flex project.

Goto your main MXML file and add this

<mx:SWFLoader source=”Main.swf”  />

Now if you compile it, everything from your src folder will be copied to your bin folder (without the classes of course). That’s where I add my content folder with all the assets and my com folder with the code specific to this project. Now add your libraries to libs folder, add it to source path (Project Name -> Properties -> Flex Build Path)  and you’re ready to go!I find it really well organized to be honest it’s achievable with just a few clicks! Flex Builder ROCKS!!

Posted in development.

Tagged with , , , , .

7 comments

By admin – February 17, 2009