Question

When we click on an image it should come in front as the selected image, but I dont want to change the index value of that image

canvas1.setChilIndex(Image(event.target), numChildern-1) 

The above line is changing the index value of the selected image and setting it to maximum-1 (for ex: 5-1 = 4 as index value). I Need alternate for above line that keeps the same index for the image.

Any help is appreciated.

Answer 1

What you can do, is in your click handler store the index of the item clicked, then on the next click (or whenever you want), send the item back to its previous index:

var previousImg:Image;
var previousIndex:int;

function selectImage(img:Image):void {
    deselectImage(); //if there is already a selected image, put it back before moving this new one to the top

    previousImg = img;    
    previousIndex = canvas1.getChildIndex(img);
    canvas1.addChild(img); //brings it to the front
}

function deselectImage():void {
    if(previousImg){
        canvas1.setChildIndex(previousImage, previousIndex);
        previousImg = null;  //null the var in case you call this method manually
    }
}

so in your click handler, do this instead of the line you have in your question:

selectImage(Image(event.target));

With this method, anytime you call selectImage, it will put the last click one back where it belongs. You could also call deselectImage manually if you so desired.