Question

I have a function that draws a rectangle on the screen (see createInfoPanel())
While drawing rectangle, I am adding 2 text fields on it.
But as you may guess, it is adding those immediately.
I want to delay adding these text fields, then I want to remove these panels after a while.
The problem is, when I set an interval or timer, they won’t work after I using once (I had to stop them by clearing/removing, it didn’t set them again).
Since my panel is being created each time image changes, I need them to work every time image changes.

So, I have 2 questions:
1- How can I re-set interval each time my createInfoPanel() function works? It won’t work anymore after setting and claring once.

2- You can see infoPanel.addChild(titleField); line in addInfoPanel() function. How can I work a smooth animation here? I mean, text appears slowly?

Thanks in advance.

public class ImageRotator extends Sprite
{
private var ... ; //Some variables

public function ImageRotator(xmlPath:String = "images.xml", interval:int = 8301):void
{
    timer = new Timer(interval);
    loadXML(xmlPath);
}

private function loadXML(file:String):void
{
    urlLoader = new URLLoader(new URLRequest(file));
    urlLoader.addEventListener(Event.COMPLETE, parseXML);
}

private function parseXML(e:Event):void
{
    xml = new XML(e.target.data);
    loadImages();
}

private function loadImages():void
{
    for (var i:int = 0; i < xml.children().length(); i++)
    {
        var loader:Loader = new Loader();
        loader.load(new URLRequest(xml.children()[i].@src));
        imagesVector.push(loader);
        loader.contentLoaderInfo.addEventListener(Event.COMPLETE, sortImages);
    }
}

private function sortImages(e:Event):void
{
    imagesCounter++;

    for (var i:int = 0; i < imagesVector.length; i++)
    {
        imagesVector.reverse();
        addChild(imagesVector[i]);
    }

    //I have only 3 images, I needed to set indexes because
    //they were covering each other
    this.setChildIndex(imagesVector[2], 0);
    this.setChildIndex(imagesVector[1], 0);
    this.setChildIndex(imagesVector[0], 0);

    if (imagesCounter == imagesVector.length)
    {
        createInfoPanel();
        timer.addEventListener(TimerEvent.TIMER, autoChange);
        timer.start();
    }

}

private function createInfoPanel():void
{
    infoPanel.graphics.beginFill(0x000000, 0.0);
    infoPanel.graphics.drawRect(0, 0, 967, 138);
    infoPanel.graphics.endFill();

////Here I want to run addInfoPanel() function with 2 seconds delay,
////After it starts, I want to run removeInfoPanel() function with 2 more seconds delay

    addChild(infoPanel);

}

private function addInfoPanel():void {
    titleField.text = xml.children()[infoCounter]. @ title;
    titleField.x = 425;
    titleField.y = 0;

    description.text = xml.children()[infoCounter]. @ description;
    description.x = 427;
    description.y = 26;

    infoPanel.y = 300;
    infoPanel.addChild(titleField);
    infoPanel.addChild(description);
}

private function removeInfoPanel():void {

    infoPanel.removeChild(titleField);
    infoPanel.removeChild(description);
}

private function addActions():void
{
    //Some function
}

private function changeImage(e:MouseEvent):void
{
    //Image changing function
}

private function changeDepth(e:TweenEvent):void
{
    //Some function
}

private function autoChange(e:TimerEvent):void
{
    //Some function
}
}

Edit: How I used to work the intervals:

private function createInfoPanel():void
{
    //lines above code sample
    intervalInfoPanel = setInterval(addInfoPanel,2000);

    addChild(infoPanel);
}

private function addInfoPanel():void {
    //lines above code sample
    clearInterval(intervalInfoPanel);
    intervalInfoPanelRemove = setInterval(removeInfoPanel,3500);
}

private function removeInfoPanel():void {
    //lines above code sample
    clearInterval(intervalInfoPanelRemove);
}

Answer 1

1- How can I re-set interval each time my createInfoPanel() function
works? It won’t work anymore after setting and claring once.

how exactly are you resetting your interval? you don’t show the code here.
but normally you can reset + re-use a timer like this:

timer.reset();

this will stop and reset the timer’s currentCount to 0.
you can then later say timer.start(); and everything should work like it never ran before.

2- You can see infoPanel.addChild(titleField); line in addInfoPanel()
function. How can I work a smooth animation here? I mean, text appears
slowly?

use a tween. add the TextFields with txt.alpha = 0; and then tween the alpha value slowly to 1.0. TweenLite (http://www.greensock.com/tweenlite/) is a great tweening-engine.

import com.greensock.*;

txt.alpha = 0.0;
TweenLite.to(txt, 1, {alpha:1.0, delay:0.4});