ActionScript 3.0 Cookbook 6.1
问题
你想添加一个新的可视化对像到可视化列表中,让它显示在屏幕上
解决办法
用 DisplayObectContainer 类的addChild() 和 addChildAt() 方法
讨论
Flash Player是由两个主要部件的功能,共同组成一个单位, actionscript的虚拟机(AVM)和渲染引擎. AVM负责执行actionscript代码,渲染引擎是绘制对像在屏幕上. 因为Flash Player是由这两大块, 绘图对像在屏幕上有两个步骤:
-
可视化对像需要被建立在AS 引擎中
-
可视化对像然后被在渲染引擎建立和被绘制在屏幕上
第一步是用 new 操作符来建立一个可视化对像的实例完成的。任何准备被添加在可视化列表中的对像必须是 DisplayObject 的直接或者间接的一个子类,像 Sprite,MovieClip,TextField,或者一个自定义类,建立一个 TextField 实例,你需要使用如下的代码:
var hello:TextField = new TextField();
上面一行的代码,在AVM中建立一个 TextField 可视化对像,但是对像没有被绘制在屏幕上,因为对像在渲染引擎中不存在。为了在渲染引擎中建立对像,对像需要被添加到可视化列表中,可以调用 addChild()或者 addChildAt()方法来完成,因为它们是DisplayObjectContainer 实例的方法,它本身已经在可视化列表层级中了。
addChild()方法带有一个单独的参数:可视化对像,下面有一个完整的代码,示范了怎么样在AVM中建立一个对像和在渲染引擎中建立对像,添加它到可视化列表中:
package {
import flash.display.DisplayObjectContainer;
import flash.display.Sprite;
import flash.text.TextField;
public class DisplayListExample extends Sprite {
public function DisplayListExample( ) {
// Create a display object in the actionscript engine
var hello:TextField = new TextField( );
hello.text = "hello";
// Create the display object in the rendering engine
// by adding it to the display list so that the
// text field is drawn on the screen
addChild( hello );
}
}
}
这里的 DisplayListExample 类是主程序类,它扩展至Sprite类,
一个TextField 可视化对像被建立在 DisplayListExample 构造函数中,在AVM内部建立对像。在这里,对像不会出现在屏幕上,因为渲染引擎至今不知道它,它只在对像被添加在可视化列表后,通过调用 addChild()方法显示TextField。
注意:addChild() 和 addChildAt() 方法只添加可视化对像,作为可视化对像容器的孩子。它们没有必要添加可视化对像到可视化列表中。孩子们只被添加到可视化列表中,如果容器它们被添加,同样地,添加到可视化列表。
下面的代码片断示范了 addChild()方法怎么样不保证一个可视化对像被添加到可视化列表中。建立一些文本在一个容器里面,但是因为容器没有在可视化列表中,文本不会显示:
// Create a text field to display some text var hello:TextField = new TextField( ); hello.text = "hello"; // Create a container to hold the TextField var container:Sprite = new Sprite( ); // Add the TextField as a child of the container container.addChild( hello );
为了让文本显示在屏幕上,文本容器需要被添加到可视化列表中。完成这个,需要一个可视化容器已经在可视化列表中,像 root 或者 stage,调用 addChild(),传递 文本容器可视化对像给它。
// Cast the special root reference as a container and add the // container that holds the text so it appears on-screen DisplayObjectContainer( root ).addChild( container );
package {
import flash.display.*;
public class DisplayListExample extends Sprite {
public function DisplayListExample( ) {
// 建立不同颜色的圆
// change their coordinates so they are staggered
// and aren't all located at (0,0).
var red:Shape = createCircle( 0xFF0000, 10 );
red.x = 10;
red.y = 20;
var green:Shape = createCircle( 0x00FF00, 10 );
green.x = 15;
green.y = 25;
var blue:Shape = createCircle( 0x0000FF, 10 );
blue.x = 20;
blue.y = 20;
// Create a container to hold the three circles, and add the
// circles to the container
var container1:Sprite = new Sprite( );
container1.addChild( red );
container1.addChild( green );
container1.addChild( blue );
// Add the container to the display list
addChild( container1 );
// Create a second container and add it the display list
var container2:Sprite = new Sprite( );
addChild( container2 );
// Reparent the red circle from container 1 to container 2,
// which has the net effect of the red circle being drawn
// on top of the green and blue ones.
container2.addChild( red );
}
// Helper function to create a circle shape with a given color
// and radius
public function createCircle( color:uint, radius:Number ):Shape {
var shape:Shape = new Shape( );
shape.graphics.beginFill( color );
shape.graphics.drawCircle( 0, 0, radius );
shape.graphics.endFill( );
return shape;
}
}
}