How to fix overlapping objects on the stage in AS3

Question

I have a flash game where I have a picture designed to be the textbox for a prompt and textbox inside with the relevant text but the textbox is being hidden by the image. A

Answer 1

The other answer using setChildIndex will definitely work, however, I think a different design approach is really what you should be doing to remove the headache altogether.

For example in a game I might have different layers such as :

backgroundLayer
gameLayer
interfaceLayer

Those 3 Sprite layers would get added to the stage in that order. I would then add display objects to the appropriate layers. So anything I added to the backgroundLayer or gameLayer would ALWAYS be 'behind' my user interface on the interfaceLayer.

That allows you to not have to worry about the layering constantly. The answer with setChildIndex will fix the problem for that moment, but should something else be added to the container it will overlap your textbox, which is something I don't assume you want.

here's an example :

var backgroundLayer:Sprite = new Sprite;
var gameLayer:Sprite = new Sprite;
var interfaceLayer:Sprite = new Sprite;

addChild(backgroundLayer);
addChild(gameLayer);
addChild(interfaceLayer);

now, whatever you add to interfaceLayer, will ALWAYS be on top of objects you add to gameLayer or backgroundLayer.

So in the case of your text box, just add it to your interfaceLayer and any other objects you want behind it, you add to the gameLayer or backgroundLayer.