Question

I have to create an mobile flex application with tabbed navigator view. One of the view must satisfy this condition: when the view is selected, an image will appear for one second and then disappear for half a second, then reappear at a random position on the screen of the view. This will repeat until another view is selected.

I’m new to Mobile Flex and I need your help.

Thanks you in advance.

Best regards,
HBLE

Answer 1

1. Use enterFrame event or a Timer to hide/show the image.
2. Set the image x and y properties to show the image at a specific position
3. Use Math.random() to generate a random number in the interval [0,1]

Important:
When tab is active call init();
When changing to other tab do not forget to stop the timer and remove event listeners.
(for performance reasons and to avoid memory leaks)

Sample code:

var isVisible:Boolean = false;

function init():void
{
   // we show / hide with a delay of 1 second
   var t:timer = new Timer(1000);
   t.addEventListener(TimerEvent.Timer, onTimer);
   t.start();
}

function onTimer(event:TimerEvent):void
{
   if(isVisible)
   {
       hideImage();
   }
   else
   {
       showAndMoveImage();
   }

   isVisible = !isVisible;
}

function hideImage():void
{
    myImage.visible = false;
}


function showAndMoveImage():void
{
    // we reposition image in screen, assume image size is smaller then screen
    myImage.x  = Math.random() * (stage.width - myImage.width);
    myImage.y  = Math.random() * (stage.height - myImage.height);

    myImage.visible = true;
}