AS3的深度管理及排序

AS3的深度管理及排序 
感谢：Moondy’s Zone 
http://www.moondyzone.com 
AS3中，我们通过下面的方法来操作和管理物体的显示深度排序。 

numChildren : int
//返回此对象的子项数目。
getChildAt(index:int):DisplayObject
//返回位于指定索引处的子显示对象实例。
getChildIndex(child:DisplayObject):int
//返回 DisplayObject 的 child 实例的索引位置。
setChildIndex(child:DisplayObject, index:int):void
//更改现有子项在显示对象容器中的位置。
swapChildren(child1:DisplayObject, child2:DisplayObject):void
//交换两个指定子对象的 Z 轴顺序（从前到后顺序）。
swapChildrenAt(index1:int, index2:int):void
//在子级列表中两个指定的索引位置，交换子对象的 Z 轴顺序（前后顺序）。
removeChildAt(index:int):DisplayObject
//从 DisplayObjectContainer 的子列表中指定的 index 位置删除子 DisplayObject。

下面是这样一个例子：有四个圆，可以点击与拖动，实现每点击其中一个圆，就把它调到最上面来。 


代码如下: 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="400" xmlns:myCanvas3D="myCanvas3D.*" applicationComplete="init();">
    <mx:Script>
        <![CDATA[
            private var color_a:Array=[0xFF0000,0xFFFF00,0x0000FF,0x00FF00];
            private var pos:Array=[[200,150],[150,200],[250,200],[200,250]];
            private var block_mc:Sprite;
            private var block_box:Sprite;

            private function init():void{
                block_box=new Sprite();
                mycanvas.canvas.addChild(block_box);

                for (var i=0; i<color_a.length; i++) {
                    block_mc=new Sprite;
                    block_mc.graphics.lineStyle();
                    block_mc.graphics.beginFill(color_a[i]);
                    block_mc.graphics.drawCircle(0,0,50);
                    block_mc.graphics.endFill();
                    block_mc.x=pos[i][0];
                    block_mc.y=pos[i][1];
                    block_mc.buttonMode=true;
                    block_mc.addEventListener(MouseEvent.CLICK,change_depth);
                    block_mc.addEventListener(MouseEvent.MOUSE_DOWN,drag_item);
                    block_mc.addEventListener(MouseEvent.MOUSE_UP,nodrag_item);
                    block_box.addChild(block_mc);
                }
            }
            private function change_depth(e:MouseEvent){
                var obj=e.target;
                block_box.setChildIndex(obj,block_box.numChildren-1);
            }
            private function drag_item(e:MouseEvent){
                e.target.startDrag();
            }
            private function nodrag_item(e:MouseEvent){
                stopDrag();
            }
        ]]>
    </mx:Script>
    <myCanvas3D:Canvas3D id="mycanvas" width="400" height="400" backgroundColor="0xCCCCCC">

    </myCanvas3D:Canvas3D>
</mx:Application>

这个其实很简单，要调整到最上层的话，只要用setChildIndex把鼠标点击对象的深度值设为（容器.numChildren-1）就可以啦。setChildIndex常用有以下几种： 

置顶：
容器.setChildIndex(对象A,容器.numChildren-1);
置底：
容器.setChildIndex(对象A,0);
插入对象B的前面：
容器.setChildIndex(对象A,容器.getChildIndex(对象B));
插入对象B的后面：
容器.setChildIndex(对象A,容器.getChildIndex(对象B)-1);