As noted in my previous post (Adobe Air Application Version) Adobe Air has a nifty update framework. Using this framework you can add a cool automatic update check and install feature in your Air app.
The framework gives you the possibility to use the default UI or a custom UI, and we will (of course) take the long and hard way to create our own UI. With long and hard I mean that we have to do the Alert creation and result handling by ourselves, which sounds a lot worse than it actually is
Step 1: Setting up the update descriptor file
We’re going to create an update descriptor file that will be placed online on our website (that we’ll call “www.example.com”). It will contain information about the latest release of our project (that we’ll call “Hello Update App”). Here’s the file:
<?xml version="1.0" encoding="utf-8"?> <update xmlns="http://ns.adobe.com/air/framework/update/description/1.0"> <version>2.0</version> <url>http://www.example.com/HelloUpdateAppV2.air</url> <description><![CDATA[ Version 2.0. This new version includes: * An increased version number! ]]></description> </update>
As you can see it’s a simple XML file containing a couple of properties:
- version: The version number of the new air installer file (this number MUST match with the version number in the application descriptor file of your project)
- url: An url to the new installer file
- description: A description of the update that can be presented to the user
Just put this file online wherever you like, for this example we’ll place the file in the root of our website and call it update-descriptor.xml (the file can now be found at www.example.com/update-descriptor.xml).
Step 2: Setting up the ApplicationUpdater object
This is probably the easiest part of the tutorial. Just copy-paste the below code and change the url to your location of the update descriptor file and you’re done!
public function checkForUpdate():void
{
var appUpdater:ApplicationUpdater = new ApplicationUpdater();
appUpdater.updateURL = "http://www.example.com/update-descriptor.xml";
appUpdater.delay = 1;
// TODO: add step 3 code here
appUpdater.initialize();
appUpdater.addEventListener(UpdateEvent.INITIALIZED, function(evt:Event):void
{
appUpdater.checkNow();
});
}
Step 3: Setting up the UI
As noted in the code above we have one TODO left: to add the event handlers.
Let’s start by handling the error events first. Just copy-paste the code below and add your own user error feedback or just log it and don’t bug the user with it.
appUpdater.addEventListener(StatusUpdateErrorEvent.UPDATE_ERROR, handleError); appUpdater.addEventListener(DownloadErrorEvent.DOWNLOAD_ERROR, handleError); appUpdater.addEventListener(StatusFileUpdateErrorEvent.FILE_UPDATE_ERROR, handleError);
You should be fine in the event of errors (little pun there!) as long as your handleError method looks like this:
private function handleError(evt:ErrorEvent):void {
// Todo: log the error, display it to your user or eat some cake, whatever you like
}
Next we add the event handler that checks if an update is actually available.
appUpdater.addEventListener(StatusUpdateEvent.UPDATE_STATUS, function(evt:StatusUpdateEvent):void
{
evt.preventDefault();
if(evt.available)
{
Alert.show("An update is available,\n" +
"would you like to install it?",
"Update available!",
Alert.YES | Alert.NO,
null,
function(evt:CloseEvent):void
{
if(evt.detail == Alert.YES)
{
appUpdater.downloadUpdate();
}
else
{
appUpdater.cancelUpdate();
}
},
Assets.img_warning);
}
});
If you want to display the download progress to your user you should also use these event handlers to check when the download starts and ends and update your progress bar (or whatever way you use to show the progress).
appUpdater.addEventListener(UpdateEvent.DOWNLOAD_START, function(evt:UpdateEvent):void
{
// TODO: hide some sort of progress report
});
appUpdater.addEventListener(ProgressEvent.PROGRESS, function(evt:ProgressEvent):void
{
// TODO: update your progress bar
});
appUpdater.addEventListener(UpdateEvent.DOWNLOAD_COMPLETE, function(evt:UpdateEvent):void
{
// TODO: hide the progress report
});
And finally we want to let the user know the update has been downloaded. Because you’re already running the application you can’t install the update immediately. The next time the user starts the program the update will be installed, but if you like you can have your application restart automatically by not calling the preventDefault method. However I (personally) don’t do that, seeing how the user might be working with data that he or she wants to save. I choose to display an alert that informs the user of the install progress, but it’s all up to you how you’d like to handle this event.
appUpdater.addEventListener(UpdateEvent.BEFORE_INSTALL, function(evt:Event):void
{
evt.preventDefault();
Alert.show("The update has been downloaded and\n" +
"will be installed the next time the program starts.",
"Update downloaded",
Alert.OK,
null,
null,
Assets.img_warning);
});
All you have to do now is call the checkForUpdate function in your ApplicationComplete event handler and you’re ready to go!
