something in the way

Here is a simple Video Chat application I built with Flex 4 and deployed on AIR for Android. The Application is just 30 lines of code and allows multiple users to join a chat room and “video chat”.

Video streaming is powered by LiveCycle Collaboration Services, a set of hosted Flash Services that enable developers to easily add real-time collaboration and social capabilities to their applications.

This application is obviously a bare-bones proof of concept. However, it is fully operational, and the same code can run on different runtime environments: AIR for Android, AIR on the Desktop, and Flash Player in the Browser. Users can participate in the same collaboration session regardless of the runtime environment they use.

Watch the video:

The 30 lines of code:

<?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:cs="AfcsNameSpace" currentState="logon" fontSize="28">

	<fx:Script>
		[Bindable] private var roomURL:String = "http://connectnow.acrobat.com/YOUR_ROOM_NAME";

		protected function connect():void {
			auth.userName = userName.text;
			currentState = "default";
			session.login();
		}
	</fx:Script>

	<s:states>
		<s:State name="default"/>
		<s:State name="logon"/>
	</s:states>

	<fx:Declarations>
		<cs:AdobeHSAuthenticator id="auth"/>
	</fx:Declarations>

	<s:TextInput id="userName" includeIn="logon" top="200" horizontalCenter="0"/>
	<s:Button label="Connect" click="connect()" includeIn="logon" top="250" horizontalCenter="0" height="50" width="150"/>

	<cs:ConnectSessionContainer id="session" roomURL="{roomURL}" authenticator="{auth}" autoLogin="false" width="100%" height="100%" includeIn="default">
		<cs:WebCamera top="10" left="10" bottom="10" right="10"/>
	</cs:ConnectSessionContainer>

</s:Application>

Last week at the Google I/O conference, we announced the public availability of the Adobe AIR for Android Developer Prerelease program. This week, we wanted to highlight a few excellent examples of AIR and Android powered enterprise applications developed by two members of our evangelism team, Christophe Coenraets and James Ward.

Both Christophe and James recently recorded inspiring video demonstrations of some of the sample applications they have been working on lately.

• Employee Directory Application sample using Flex and AIR for Android by Christophe Coenraets
• Android Trader Application with Flex 4 and AIR by Christophe Coenraets
• Flex on Android in Flash Player and AIR by James Ward

Mobile version of Employee Directory application by Christophe Coenraets.

Trading sample application by Christophe Coenraets.

Example of a Flex and AIR application that includes multi-touch support by James Ward.

This week at the Google I/O conference Adobe announced that a Flash Player 10.1 beta and an Adobe AIR prerelease are now available for Android devices. This is really exciting news for those of us building apps on the Flash Platform because now we can begin building apps in Flex for these mobile devices (and many others coming soon).

Take a look a some of the quick demos I’ve built with Flex running on Android in Flash Player and AIR:

You can get the source code for all of these demos from github.

Also Christophe Coenraets has posted some great Flex mobile demos. Check out his Employee Directory and Stock Trader demos.

These are very exciting times for developers!

If you want to check out the Flash Player 10.1 beta for Android it will be available in the Android Marketplace for Android 2.2 devices. You can try Adobe AIR for Android today by signing up for the prerelease.

Nos passados dia 3,4 e 5 de Dezembro teve lugar mais uma edição do Sapo Codebits onde perto de 600 pessoas estiveram presentes para assistir a mais uma vaga de apresentações assim como, participar no desafio de coding durante 24 horas.

Este ano, os vencedores foram o Nuno Morgadinho, Paulo Afonso e Jorge Varandas com a aplicação SUPOND The Idea – “Apple Time Machine”-like interface to your Lifestream

A aplicação é uma adaptação do time machine da Apple utilizado as APIs do novo serviço da SAPO – POND onde visualizamos a nossa timeline de conteúdos provenientes de vários serviços com um aspecto 3D, não recorrendo a Papervision3D mas às APIs 3D nativas do Flash Player.

O projecto foi desenvolvido em Flash Builder e Flash CS4, resultando numa aplicação web e desktop via AIR.

Mais informações na página oficial do Nuno.

Typically when I develop Flex apps for the browser or the desktop (via Adobe AIR) I do a lot of clicking to test every change I make. My mouse gets a little worn out and I waste a lot of time. Luckily there is a better way to test Flex apps. Flex supports automated testing of applications but you need software that does the record, playback, and test validation. FlexMonkey is a free and open source tool that does automated testing on Flex apps. It just reached the 1.0 release and it now contains a number of new great features like:

• Fluint / FlexUnit 4 Test Creation
• Ant and Hudson / CI Support
• Property and Bitmap Verification

If you’d like to learn more about how to use FlexMonkey check out “Testing Flex applications with FlexMonkey 1.0” by Eric Owens. FlexMonkey is a great tool that will give your mouse a break and save you some time. Check it out and let me know what you think.

AIR is very popular for creating twitter clients, Sönke Rohde just made it much easier to make AIR apps for twitter with an AS3 library for Twitter. This library is built on top of core oauth as3 library by iotashan.  Core OAuth as3 library is a standard OAuth library this can be used for your own OAuth backends or connecting to other OAuth services as well.

A very nice feature of this library, in addition to being coded cleanly and as3 style, is the ability to have the Twitter OAuth page render inside of Flash.

Instead of opening the Twitter authorization page in the browser the library also contains OAuthLoader which is a wrapper around HTMLLoader which enables to directly show the authorization page within an AIR window:

// use this in the requestTokenHandler instead of navigateToURL
var loader:OAuthLoader = new OAuthLoader();
loader.load(request);
loader.percentWidth = 100;
loader.percentHeight = 100;
var w:Window = new Window();
w.width = 800;
w.height = 400;
w.title = req.url;
w.addChild(loader);
w.open();

• Shannon Hicks core oauth as3 library
• High level AS3/Flex library for OAuth
• oauth-as3 Google Code page
• OAuth
• Twitter OAuth FAQ
• Twitter API Documentation
• Getting Started with OAuth

You’ve seen the demos. You like the idea of tracking tags in the real world to create visuals. And now you want to try augmented reality for yourself - and, incidentally, you’re a Flash developer.

Reader Eric Socolofsky writes to share a framework he’s created that makes it much easier to work with the Flash-based, open source FLARToolkit, called FLARManager. Version 0.4 is just released:

http://words.transmote.com/wp/20090618/flarmanager-v04/

FLARManager has a number of features that improve upon the existing work done by FLARToolkit:

• Building the apps themselves is easier. Fire up the framework with Flex Builder (or Flash, or Eclipse, or FlashDevelop), and you have access to all the libraries you need, so you can start playing more or less out of the box. Hello, world, indeed.
• You don’t have to rely on Papervision if you don’t want to. Papervision, the faux-3D library for Flash, is included with the distribution. But marker tracking is decoupled from Papervision, so you don’t have to use it if you don’t need it.
• Better event management. Marker adding, updating, and removal, multiple pattern detection and management, and the like are all extended in FLARManager.
• Great documentation. Eric has taken the time to read some fantastic getting started tutorials, all accessible from the site above so you can go play.

Now, you wouldn’t pick Flash for speed - that’s not the idea.

This is about the slowest implementation of ARToolkit you’ll find. But you’d use it for compatibility, because of easy deployment to the browser. Speaking of speed, the NyARToolkit Java implementation actually outperforms the original C version. I’m the last person you should talk to about writing efficient, optimized code, but I can tell you that the notion that Java is “slower” than C is simply wrong. There are a great many other, more important variables, and in some cases Java can in fact outperform C. That doesn’t mean that Java is always the right tool for the job any more than C is, though, and in fact because Java’s Garbage Collector and event scheduling aren’t really built for real-time performance, and because “native” code is suited to certain situations, there are in fact times when you wouldn’t want to use Java. Understanding the application is what really matters - and that’s why it’s nice that NyARToolkit and siblings are available for AS3, C#, the mobile Android platform, iPhone, and others.

Eric doesn’t just do this to fool around, either; he works in interactive design for museums, and has what has to be one of the world’s sweetest “day jobs” - working for the legendary Exploratorium. He’s also working with Processing and the wonderful reacTIVision library on a separate project that’s working with tangible table-based interfaces; more on that separately. Thanks, Eric!

If you get interesting work in augmented reality going, let us know. And if you need some inspiration, my current favorite is from our friend Marco Tempest, working with Zach Lieberman in OpenFrameworks on augmented magic.