在Flex 3内创建一个定制化窗口环境

John Bauschatz

我是Wheaton学院的一名二年级学生，主修计算机。应本学期的一个课程要求，我将发表一个关于课程项目的教程。该教程将说明如何在Flex 3内为一个定制化窗口环境编制代码。



该教程将说明怎样在Flex 3内创建一个定制化窗口环境，这个环境包括可拖放和可折叠内容窗格，其内容和风格可以由程序员轻松变改。下面就是个范例。

我在做一个项目时，不得不创建了该系统。项目由几个相互独立的图形元素组成（一个吉他琴颈图，一个节拍器和一个五度圈）构成。我希望用户能够按照自己的意愿拖放这些元素，或隐藏之。我不打算为每个目标编写代码了。结论就是：创建一个超类，封装窗口的所有通用函数。

我们现在创建一个类窗口，以绘制基本的标题条和背景，并具备点击和拖动功能。我们的范例子类是菜单。窗口的一个特点就是，菜单类无需对被绘制的形式进行调整。下面是窗口的一个样式：

package
{
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.text.*;
public class Window extends MovieClip
{
protected var h:int;
protected var w:int;
protected var header:String;
public static var barHeight:int = 20;
public function Window(w:int, h:int, header:String)
{
this.w = w;
this.h = h;
this.header = header;
}
public function draw():void{
//draw the large frame in gray
graphics.beginFill(0x000000,.5);
graphics.drawRect(-2, -4-barHeight, w+4, barHeight+6+h);
//draw the title bar in blue
graphics.beginFill(0x0000ff, .5);
graphics.drawRect(0, -2-barHeight, w, barHeight);
//write the header text
var t:TextField = new TextField();
t.textColor = 0xffffff;
t.text = header;
t.width = 100;
t.selectable = false;
addChild(t);
t.x = -3;
t.y = -barHeight+3;
//draw content background in gray
graphics.beginFill(0x00ff00, .5);
graphics.drawRect(0,0,w,h);
childDraw();
}
public function childDraw():void{}
}
}

本文来自：http://www.actionscript.org/resources/articles/960/1/Creating-a-custom-window-environment-in-Flex-3/Page1.html