Skip to content
January 13, 2010 / ranacse05

Change UI on Deactive

I was working on Adobe AIR few days ago . Honesty i liked it very much . We needed a desktop app for our web application then we were worried about the various OS and languages , then suddenly i thought about AIR . So we did it using AIR , that makes it cross-platform and easy to develop because we used HTML,CSS & JS .

So i was thinking to make the UI fade if the app is not Active but the problem is when i tested the application i saw that after deactive the UI just become fade and after 2~3 seconds its fade effect gone again !

Here is the solution .

First we have to add a new addEventListener on boot . Suppose our function is onDeactive so it’ll be like

nativeWindow.addEventListener(air.Event.ACTIVATE, onActive);
nativeWindow.addEventListener(air.Event.DEACTIVATE, onDeactive); 

the onDeactive function is here

function onActive(){
			document.getElementById('BodyWarpper').style.opacity = 1;

function onDeactive(){
			document.getElementById('BodyWarpper').style.opacity = 0.8;

How its working ? Actually in AIR after every second the the EventListener called . So when we make the UI deactive it called the ondeactive function and set the opacity 0.8 but then again after 1 second it call the onDeactive and onActive and if we don’t use the checking


It just make the UI opacity 1 again .

Have fun !



Leave a Comment
  1. Joy / Jan 14 2010 3:00 am

    Nice to know. AIR is really a cool thing!

  2. Indian Social networking / Mar 21 2010 7:09 am

    🙂 very nice information

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: