在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