{Technology Enthusiast & Developer}

From the Blog

Logo-templateI don’t have a lot of experience yet with tracking AIR applications developed with Flash or Flex. Adhese has a service called pubblegum that can be used directly from Flash without calling an external Javascript (which is the case with Google Analytics). So we decided to give it a try.

What exactly is pubblegum?

Whether it is Adobe® Flash®, Adobe® Air®, Microsoft® Silverlight®, Javascript or something as basic as an image. Pubblegum tracks your content in real-time from within the file and reports all available info, from custom interactions to URLs where your content was published.

Cool is that they have a specific API for AIR applications built in Actionscript 3 and the API also takes care of the fact that your application can be disconnected. If you want to use it, you can send them a mail to get a free trial. In our case we used the specific API for tracking user actions in the AIR application. And it is fairly easy to use. You only need to include the com.adhese.pubblegum.PubblegumAir class in your source code (a .swc file for Flex projects would also be nice guys) and write these two lines of code:

var api:PubblegumAir =
    new PubblegumAir("companyID", "campaignID", "creativeID", true);
api.action("action");

The first variable is provided by Adhese and should be your company name/identifier, the second and third parameter can be chosen freely. The last parameter specifies whether you are tracking an application. So true tells the API, that the client is an application.

That isn’t all that bad is it, and on top of that you get a nice dashboard where you can analyze your results.

Mar
31
Posted by Alain at 3:48 pm

air_appiconAt my company I developed an Adobe AIR application created in Flex for internal use. The application uses custom chrome because it has a specific designed interface. At the time we also decided to enable the transparency. To achieve this, you only need to change some settings in the AIR configuration file. This file is located in the root of your Flex project and ends with “-app.xml”. The first setting turns off the default OS specific chrome and the second one make the application transparent.

<systemChrome>none</systemChrome>
<transparent>true</transparent>

This is all very cool, and it worked out great for me. Sure, the application used a bit more CPU then expected, but that’s a known issue for AIR applications. But some of my colleagues complained that their CPU went through the roof (more than 50% while doing nothing) and the application became unstable. Wouter Martens (currently doing his internship) stumbled upon this blog post because he also had the CPU issue on his machine. It turns out that the problem is depended on hardware, and that explains why some people have issues and others don’t. We tested the same application without the transparency and the CPU issue was gone.

Luckily it turns out that we don’t really need the transparency, and that we can easily change the design without a lot of impact. Changing the transparent setting in the xml file to “false” did the trick.

<systemChrome>none</systemChrome>
<transparent>false</transparent>

This demonstrates that it’s not that trivial to create a cross-platform run-time, that also behaves consistent over all platforms and all hardware.

For an internal project I created an Adobe AIR application that connects to the Basecamp API. We have been using the application since the launch of Adobe AIR. Back then I had a problem connecting to the API using the HTTPService, because the combination of Basic Authentication and the https protocol was not supported. After several unsuccessful experiments I decided to go for an approach that uses a PHP Proxy on the server that delegates the calls to the Basecamp API. However the downside of this approach is that this setup needs extra configuration and a server-side deployment.

This week I got the chance to pick it up again and I stumbled upon this forum post on the Basecamp Forum. I found this piece of code posted on Verveguy’s blog. And it actually did the trick.

private function addAuthHeader(service:HTTPService,
                     username:String, password:String):void
{
    //add the header to request
    var enc:Base64Encoder = new Base64Encoder();
    enc.encode(username + ":" + password);
    service.headers["Authorization"] = "Basic " + enc.toString();
}

For everybody who needs to connect a Flex application to an API that uses https in combination with Basic Authentication, here is the solution. All credits to the original blog post.

Mar
14

lita_iconI have been working on a couple of AIR applications, one of them being Airbob an open source Cruise Control monitor tool. This was the first AIR application I wrote way back when Adobe AIR 1.0 was released. For local data I also used SQLite which is very useful for saving state and preferences of your application.

There are several administration tools available, but none of them were really that good. David Deraedt wrote a complete SQLite Administration Tool using Flex and Adobe AIR called Lita, and it is very good and pretty useful when you need to dive into thise .db files.

Check out the list of features:

  • A free, multiplatform administration tool for your SQLite Databases
  • Open, create, compact databases
  • Create, rename, delete, and empty tables
  • Create, rename and delete columns
  • Create, modify and delete records
  • Encrypt or reencrypt your databases
  • Easily run your custom SQL statements
  • Create and delete indices

Screenshot:

lita

So great work David, and for more information about this tool and the install link, got to his blog.

Mar
10

I am currently working on an AIR application developed using the Flex 3 SDK. The problem I am facing now, is that I need to restart my application from code. This sounds very easy, you would think. My first guess would be that there should be a method on the NativeApplication object like:

NativeApplication.nativeApplication.restart();

But this method does not exist. There is an exit method, but no restart method. So I “googled” around and came to some interesting articles describing how to do this.

The Joy of Flex blog wrote an article “Can an AIR application restart itself?” I tried it out, but this did not work for my project. The code actually steps through the methods but the application never restarts. The article also says that there are serious problems with this approach. So probably I am in the case where the exit beats the launch.

So my next approach was this article by David Tucker: “AIR Tip 11 – Launching an AIR Application from an AIR Application“. It actually described how to launch an AIR application from another application. This is what has been used in the first article, so back to start.

Then I found this interesting peace of code on Flex Internals:

package
{
  import mx.core.Application;
  import mx.core.WindowedApplication;
  import adobe.utils.ProductManager;

  public function reboot():void
  {
    var app:WindowedApplication =
        WindowedApplication(Application.application);
   
    var mgr:ProductManager =
        new ProductManager("airappinstaller");
   
    mgr.launch("-launch " +
        app.nativeApplication.applicationID + " " +
        app.nativeApplication.publisherID);
   
    app.close();
  }
}

Also make sure that the “allowBrowserInvocation” option is turned on in the AIR application descriptor template:

<allowBrowserInvocation>true</allowBrowserInvocation>

So this was actually what I needed, and it worked!
Any feedback is appreciated :)

Feb
14
Posted by Alain at 10:41 am

fx-gumboYesterday Adobe decided to remove the Fx prefix from the new Flex 4 (aka Gumbo) components. The debate was whether components in the next version of Flex should all start with the letters “Fx” or use namespaces to resolve possible conflicts with legacy components like Button, Panel and ScrollBar. After playing around with the new Flex components, it felt a little strange to use for example a FxButton for the new stuff because in the end it just a button. In other language has been be solved using namespaces so why not keep it clean and use a specific namespace for one architecture and another one for the new.

The Flex SDK team has decided and is going for the multiple namespace solution. Read more about this in this topic: “Kittens saved, Fx prefix will go away“. The cool thing is that when the topic came up for debate Adobe asked the community for input in this forum post. So now that’s out of the way I can’t wait using Flex 4.

code_smI recently discovered the Starred Projects feature in Google Code. As a developer I don’t want to write everything myself because there is already so much out there. The following list contains libraries that every Actionscript developer doing Flex should be aware of their existence:

  • antennae: Templates for building complex Flex projects with Ant. I have been using ANT for a while but have to check out this project to see if it can make things easier. It has been around for a while.
  • as3corelib: A must know library. The corelib project is an ActionScript 3 Library that contains a number of classes and utilities for working with ActionScript 3. These include classes for MD5 and SHA 1 hashing, Image encoders, and JSON serialization as well as general String, Number and Date APIs.
  • as3crypto: As3 Crypto is a cryptography library written in Actionscript 3 that provides several common algorithms. This version also introduces a TLS engine (TLS is commonly known as SSL.)
  • as3xls: Project that makes it possible to read and write Excel files in Flex. The example on the site does not work with my Excel file, but still it could come in handy.
  • as3yaml: as3yaml is an Actionscript 3 YAML 1.1 parser and emitter.
  • facebook-actionscript-api: The Facebook Actionscript API provides an interface between the Facebook REST based API and Flash/Flex based applications.
  • flash-thunderbolt: ThunderBolt is a logger extension for ActionScript 2 and 3 applications using Firebug. For logging without Firebug, especially for AIR applications, check out the ThunderBolt AS3 Console.
  • flex-object-handles: A very common UI element found in many applications are those little square handles around an on-screen object that allow you to move & resize it.
  • flexcairngorm: Extensions for the Adobe Cairngorm MVC Framework.
  • flexcover: Flexcover is a code coverage tool for Flex, AIR and AS3. It incorporates a modified version of the AS3 compiler which inserts extra function calls in the code within the SWF or SWC output file.
  • flexlib: The FlexLib project is a community effort to create open source user interface components for Adobe Flex 2 and 3.
  • flexundoredo: The Flex UndoRedo Framework provides all the facilities that you need for implementing undo and redo within your applications. The Framework can be used with or without Cairngorm.
  • gaforflash: This is an ActionScript 3 API for Google Analytics data collection.
  • openflux: OpenFlux is an open-source component framework for Flex which makes radically custom component development fast and easy.
  • papervision3d: Open Source realtime 3D engine for Flash.
  • swizframework: Swiz is a framework for Adobe Flex that aims to bring complete simplicity to RIA development. Swiz provides Inversion of Control, event handing, and simple life cycle for asynchronous remote methods. In contrast to other major frameworks for Flex, Swiz imposes no JEE patterns on your code, no repetitive folder layouts, and no boilerplate code on your development.
  • tweener: Tweener (caurina.transitions.Tweener) is a Class used to create tweenings and other transitions via ActionScript code for projects built on the Flash platform.
  • twitterscript: This is an ActionScript 3.0 library for accessing Twitter’s APIs. This was originally code from Twitter, but it is being open sourced so it can be maintained and kept current.
  • urlkit: UrlKit supports Adobe Flex applications that need to expose URLs and window titles in the browser to represent their state. These URLs can be bookmarked, accessed via the Back button, etc.
  • wick3d: Wick3d is a 3D engine in progress for ActionScript 3 my colleague David Lenaerts who does some pretty amazing things :)

The order of this list is pure alphabetic and contains must know libraries and useful stuff that could come in handy in future projects.

Dec
24
Posted by Alain at 5:05 pm

It has been a very interesting year and now might be the time to look back. I did several projects and used a lot of different technologies and frameworks like Flex, AIR, Silverlight, Java, Spring, BlazeDS, … Last year I decided to start a blog because I finally had something to say, or so I thought :) , I became the proud father of a beautiful boy named Robbe, I decided that RIA development would be my path, although I had to make a couple detours.

In the first part of the year I was involved in several Flex projects. The first project was a generic product selector build in Flex that was used by a very well known laptop manufacturer. It was used for a short time because the client decided to go for an AJAX version and my very generic product selector got replaced by the AJAX version. The other project was an internal time tracking interface that used Flex and AIR. We build this tool on top of the Basecamp API. For now the application is only used internal at Nascom, who knows what the future brings. I also released my first open source application Airbob.

Then I put on my other hat and did some Java development using Java, Spring, Hibernate and BlazeDS. We used the OpenAMF library for our server-side communication with Java, but BlazeDS makes the implementation a lot easier. You still had to code the Spring bindings yourself, but the good news is that Adobe is working with SpringSource to build it into the Framework. The other big project I worked on for most of the year was the footballfan.be community site. My role was building the HTML front end using SpringMVC. In a lot of ways it was an interesting project.

In between I did a Silverlight Research project, that has not been upgraded to the Silverlight 2 RTM version yet. The problem is that I used the agTweener library and the source has not been updated after Silverlight Beta 2. So for the time being Benny’s Bus Stop is no more. It might come back in the future if I find a decent tweener library.

So what’s up for 2009? I am reading the book “Beginning iPhone Development: Exploring the iPhone SDK” so that will be a challenge for next year. There are some cool Flex projects in the pipeline, more on that possibly later on. Will there be an interesting Silverlight project? Only Steve Ballmer knows ;)

Happy Holidays and see you next year!

Dec
08
Posted by Alain at 11:14 pm

This week I stumbled upon two interesting initiatives that could help Flex and Actionscript become more mature as an enterprise programming language.

Earlier this week Christophe Herreman announced on his blog that the Prana Framework has become an official Spring extension. The new name is Spring Actionscript and one thing I like about it is that it can be used together with existing frameworks like PureMVC and Cairngorm. I have worked with the Spring Framework on several Java projects in the past and I might use it for a Flex project as well. And let’s hope that in the future there will also be support for annotation based dependency injection. With annotations you need a lot less XML configuration. You can read more about annotations here.

Today Christophe Coenraets announced on his blog that Adobe is working together with SpringSource on enhanced Flex / Spring integration. From the press release:

Adobe Systems Incorporated today announced that it is working with SpringSource to simplify the development and deployment of rich enterprise Java(TM) applications through a collaboration that will provide integration between the Adobe(R) Flash(R) and SpringSource platforms. This collaboration will make it easy for Java developers to create enterprise-class rich Internet applications (RIAs) using Adobe Flex(R) software, a cornerstone of the Adobe Flash Platform, and Spring, the de facto standard for enterprise Java.

So now we can use Spring completely front to back. That will deffinately make the code more readable across languages.