Example AIR App - Dynamically Resizing Windows based on Content Area
** Updated for AIR 1.0 02/25/2008 **
The AIR windowing API offers some exciting new possibilities, and challenges, for Flash developers. With the Employee Directory Sample Application, we showcased a well-designed, real-world application that dynamically resizes itself to a changing content area. This is a powerful technique that simply isn’t possible within the confines of a browser window.
I thought it would be useful to distill this capability from the more complex directory application and provide a simple ‘kick-start’ application that demonstrates:
- Leveraging transparent windows to create high-quality custom window chrome with drop-shadows.
- Using the Flex Resize effect and event listeners to dynamically size a NativeWindow to the size of a changing content area
- Simple PNG-centric CSS styling example with advanced text anti-aliasing applied.
You may install via the AIR badge below, or if you have less than 9,0,63, you will have to manually install the runtime and AIR file:
| This application requires the following be installed:Please click on each link in the order above to complete the installation process. |
Source is available by right-clicking and selecting ‘view-source’ in the application.
One other factor with resizable applications not covered in this sample app is automatically keeping the application onscreen as the application resizes. This is a challenging problem that is addressed in the directory application (via a fairly convoluted solution), but is not covered here. Something I definitely hope to address more clearly in the future. Definitely check out the Employee Directory if you haven’t already.
Nice work, and nice to see you start blogging about it.
Comment by Renaun Erickson — January 29, 2008 @ 8:19 pm
Not sure why, but nothing happens when I click the “Install Now” badge.
Comment by Gareth — February 1, 2008 @ 5:07 am
Ah, I think there is a problem with the Flash detection. It should require 9,0,63 for the badge, but I have a feeling that its not working properly.
Thanks!
-D
Comment by admin — February 1, 2008 @ 9:10 am
Source is there if I right click on the header. But I cant get a zip of the source to play with it. Is the zip missing intentionally?
Comment by Anthony — February 13, 2008 @ 2:38 pm
Having issues when I try to add a handle to drag the size of the window. Is it possible to do that in your example very easily?
Comment by Anthony — March 9, 2008 @ 12:24 am
I haven’t tried to do that.
It shouldn’t be too hard to add that in, I wouldn’t think. What exact problem are you having?
You may need to change the app descriptor to allow the window to be resizable. It may be set to false.
Cheers,
-Daniel
Comment by admin — March 17, 2008 @ 2:36 pm
Nice example. I’m curious if you know the answer to this: Why doesn’t Adobe AIR’s advanced anti-aliasing allow subpixel rendering as it’s done in the Flash player? Text rendered with advanced anti-aliasing is smooth in AIR, but it’s smoother (on an LCD) with subpixel rendering in Flash…
Comment by Will — August 10, 2008 @ 2:17 pm
Did a little research - Turns out that any content published for SWF9 format no longer has *color* subpixel rendering in Flash, only monochrome. And since AIR 1.1 is SWF9 format or higher, color subpixel rendering is removed. I am not sure why this change was made. Just the facts.
Comment by admin — August 11, 2008 @ 1:29 pm
[...] that loves to tinker. So you may find some glitches (other features). Special thanks goes out to Daniel Wabyick who first introduced me to this [...]
Pingback by graviti - human centered design » Blog Archive » AIR Custom Chrome v.03 — September 18, 2008 @ 12:42 am