Writing an OpenLaszlo AIR Application

A while back, I wrote about using OpenLaszlo to write Adobe AIR applications. A number of people asked me for step-by-step instructions. It’s taken me a while to get around to writing these, and I’m happy to post this finally.

The instructions below explain what to install, where I installed it, and the steps I took to create a chromeless AIR application. A chromeless AIR app is one that doesn’t have the operating system’s standard window around the embedded SWF. It’s trickier to create a chromeless app, than a windowed app. You can drag the application, and close it from within OpenLaszlo.

I use Windows XP and Cygwin, so the build script won’t work on Mac/Linux machines right away. It’s intended to serve as a guide.

Download the OpenLaszlo AIR Application Source and Installer.

OpenLaszlo Air Screenshot

Setup

  1. Download and install the Adobe AIR runtime, for your platform. You’ll need this to run your application. I used Adobe AIR Beta 3.
  2. Download and install the appropriate OpenLaszlo distribution for your platform. I used OpenLaszlo 4.0.9.1. If you’re new to OpenLaszlo, the Windows/Mac/Linux distributions include Apache Tomcat and OpenLaszlo. Install to the default directory. If you’re on Windows, you may need to download and install the Java SDK (i.e. the JDK) first (if you don’t have it already). You can get that from Sun’s website. Look for J2SE JDK 6.
  3. Download and unzip the Adobe Flex SDK. You’ll need this to act as a bridge between OpenLaszlo and the AIR runtime. I got Flex 3 SDK Beta , and extracted it to a new folder called C:\Program Files\flex3sdk_b3_121207.
  4. Download and unzip Adobe AIR SDK. I got AIR Beta 3, and extracted it to C:\Program Files\air_b3_win_sdk_121207.

Development

  1. Copy the OpenLaszlo source code/build script to (say) the my-apps directory. Check the paths set in build.sh – you may need to update them.
  2. Copy the Flex source code to the appropriate place in your Flex install directory. See the paths in build.sh as a guide.
  3. Copy the AIR source code to the appropriate place in your AIR install directory. See the paths in build.sh as a guide.
  4. To do a quick test, cd to your OpenLaszlo directory and run:
    ./build.sh -test
    That will compile your application and launch it (without installing). If all goes well, you’ll be facing your first OpenLaszlo AIR application.
  5. To build the installer, run:
    ./build.sh
    The .air installer will be build in the AIR source directory.

Installation

If you just want to test out the application, double-click the OpenLaszloAir.air file to install it.

7 thoughts on “Writing an OpenLaszlo AIR Application

  1. Hi

    Now OpenLaszlo can be compiled to swf9,then we want to compile Adobe’s AIR API.
    We want to manipulate Native OS Window from inside AIR’nized OpenLaszlo contents.
    Can we open native OS window from inside AIR’nized OpenLaszlo contents?
    Can the native OS window opened(if created) by AIR’nized OpenLaszlo contents communicate with the parent(AIR’nized OpenLaszlo contents)?

  2. Hi stera,

    When you say “Native OS Windows”, what do you mean exactly? Are you asking if you can open other OS applications (e.g. Microsoft Word) from within an AIR application?

    Personally, I don’t know whether this can be done or what the API to do that is. If you know the AIR API, it should be possible to call it.

    Note that you did not need SWF9 support to call an AIR API. The example I posted calls the AIR API for exiting the the application. I overrode the window’s close method and had it exit the application, instead of just making the window invisible. The only difference that SWF9 support may make here is that you *might* not have to use the bridge that I did for calling from OpenLaszlo JavaScript to the SWF9 runtime.

    -Antun

  3. Hi Antun,

    I want to create an AIR Application using OpenLaszlo.
    This Application is a News Ticker that reads RSS feed from several news sources
    and displays News titles using endless scroll.
    This needs is from the Hope to create more than BBC'”Desktop alerts”.
    URL: http://news.bbc.co.uk/2/hi/help/4735697.stm

    Specifications:
    1.The initial window size:height= 20 width= 100% position:x= 0 y 0.

    2.This window is draggable,but this window stick to upper side or bottom side when this window is moved within 20 pixels from upper or bottom side.
    When this window is on middle of Desktop then width=60%.

    3.The news titles given from RSS scroll endless.
    The scroll is paused when mouse cursor is over the News and resumes when cursor is out.

    4.The news sources are selectable using button that configures options and settings.
    The scroll speed is configurable.

    I tried to make such application specified by above Specs.
    I could satisfy Spec 1,3.
    But when I tried to satisfy Spec 4,then I struck to difficulties.
    Because when I used combobox to compose selecter of RSS feeds,it needs height=200.
    So I want to create new discrete Native OS Window(heigth=200) from inside AIR’nized OpenLaszlo content,
    and this newly created window needs communication with parent(AIR’nized OpenLaszlo content) to return the result of new configuration.

    By aid of your article,I can drag window (made of AIR’nized OpenLaszlo content) on Desktop.
    But about about other specs such as Spec 2 and 4,I have no idea.
    Will you help me?

    –stera

  4. Thanks, gave me enough to get it running on my system (Mac OS). I already had the SDK’s, just had to figure out how to put my app in it, and get rid of the cigwin oddities. It is in this repo at GitHub http://github.com/GerryG/OLAnnoteView/tree

    On problem, though. Scrollbars don’t work right. I disabled the drag so the mouse works, but I can’t drag the scroll indicator like normal. I guess it needs some magic to pass mouse gestures the the OpenLaszlo objects.

  5. Hi,

    Has anybody tried to run Openlaszlo on desktop as described above with later versions of Flex and AIR? The installer .air file seems to be built but the UI doesn’t show up. Any pointers or ideas are much appreciated.

    Thanks,
    Vaibhav

Leave a Reply

Your email address will not be published. Required fields are marked *