AsWing 入门

环境准备 
说白了AsWing就是一套用AS3写成的类库,所以只要有编译AS3程序的环境,就能使用AsWing 

从编译环境来说基本就是2种,一个是Flash CS3,另一个就是 flex sdk。开发工具就很多了,官方的有 FlashCS3Flex Builder(推荐用FB3),或者使用开源的FlashDevelop(支持使用flashflex sdk编译),甚至手动调用mxmlc编译。 

有了开发环境,那么我们就要下载AsWing开发包,并且配置我们的开发工具。 

可以到 http://code.google.com/p/aswing/downloads/list 下载AsWing开发包。 

找到 aswing_a3_1.2_fx.zip aswing_a3_1.2_fl.zip 其中 1.2 表示版本号,一般下载最新的就行。后面的 fx fl 代表适合的编译环境。一般如果用flex sdk的话就下载fx结尾的包。用flashCS3的话就下载fl结尾的。 

当然你也可以通过svn客户端取出最新的AsWing代码,具体方法就不再赘述了,svn地址见:http://www.aswing.org/?page_id=4  

下面具体介绍下在FlexBuilder3FlashCS3中的配置方法。其他工具雷同。本人使用Windows操作系统,其他系统下的操作方式基本一致。 

FlexBuilder3:
 
将压缩包解压后,找到里面的aswing_a3_1.2.zip,解压,将 AsWingA3/bin 目录中的 AsWingA3.swc 复制到你存放AS代码库的目录。比如我将其放在 E:/AS3 目录中。然后再FB3中新建一个ActionScript项目,右键该项目打开项目属性窗口,选择ActionScript Build Path,然后切换到 Library path,点击 Add SWC… 浏览到刚才复制的那个文件,按照我刚才存放的路径就是 E:/AS3/AsWingA3.swc,然后点击OK即可。 
Flash CS3
 
同样先解压然后找到aswing_a3_1.2.zip并解压,由于Flash IDE不支持使用纯AS打包的SWC作为编译库路径,所以我们先将AsWingA3整个目录复制到所需位置,如 E:/AS3 
后打开Flash CS3,点击菜单栏中的 编辑 并打开 首选参数窗口点击左边列表中的ActionScript,然后点下方的 ActionScript 3.0 设置打开类路径设置窗口,将AsWingsrc目录添加进去,按照我的文件路径就是将 E:/AS3/AsWingA3/src 这个路径添加进去,然后点确定就可以了。 
P.S.
当然FB3也可以使用目录作为编译路径,就是在Library path 旁的 Source path中添加一个 AsWingsrc目录。 

第一个例子-Hello World 
FB
中在刚才建的ActionScript项目中新建一个ActionScript class文件,输入下面的代码。 

Xml代码 

1.        package {  

2.        import flash.display.Sprite;  

3.          

4.        import org.aswing.AsWingManager;  

5.        import org.aswing.FlowLayout;  

6.        import org.aswing.JButton;  

7.        import org.aswing.JFrame;  

8.        import org.aswing.JOptionPane;  

9.        import org.aswing.event.AWEvent;  

10.      

11.    public class HelloAsWing extends Sprite {  

12.      

13.        private var myFrame:JFrame;  

14.        private var myButton:JButton;  

15.      

16.        public function HelloAsWing() {  

17.            AsWingManager.initAsStandard(this);  

18.      

19.            myButton = new JButton("Click Me");  

20.            myButton.addActionListener(__buttonClicked);  

21.      

22.            myFrame = new JFrame(this, "My Frame");  

23.            myFrame.getContentPane().setLayout(new FlowLayout());  

24.            myFrame.getContentPane().append(myButton);  

25.      

26.            myFrame.setSizeWH(300, 200);  

27.            myFrame.show();  

28.        }  

29.      

30.        private function __buttonClicked(e:AWEvent):void {  

31.            JOptionPane.showMessageDialog("Hello", "Hello, World!");  

32.        }  

33.    }  

34.    }  


如果是使用Flash CS3,可以先新建一个ActionScript文件,输入代码后,保存为HelloAsWing.as,然后新建一个Flash (ActionScript3.0)文件,将该fla文件保存在与HelloAsWing.as的同一级目录中,然后将fla的文档类设置为 HelloAsWing 
实例详细分析 
使用AsWing,主程序不需要基于任何应用程序框架,AsWingUI组件都从flash原生的Sprite扩展而来,所以几乎每一个AsWing组件都能被单独放到DisplayObjectContainer中并能正常使用。 
我们的主程序仅需继承Sprite即可,下面分析一下构造函数中的代码。 

AsWingManager.initAsStandard(this);
 

建议在使用AsWing程序之前先调用这个方法,该方法封装了一些常用功能,调用了AsWingManagersetRoot方法,用于设置容纳AsWing组件的容器,这里的this就代表了当前AsWing组件的root。另外还会设置一些系统参数,如 alignscaleMode等。 

myButton = new JButton("Click Me");
 
myButton.addActionListener(__buttonClicked);
 

JButton
AsWing中基本的按钮组件,这里新建了一个JButton实例,并设置按钮的Label,第二句代码给按钮添加一个事件监听,当点击按钮后就会触发,这里的addActionListenerAsWing设计成简化了事件监听的写法,当然也可以写成这样 myButton.addEventListener(AWEvent.ACT, __buttonClicked); 
AwEvent
AsWing中最基本的事件类,ACT事件类型表示一些基本组件的触发事件类型,如JButton的鼠标点击事件,JTextField的回车事件等。这里按钮点击后就会执行 __buttonClicked 事件处理函数,函数中代码稍后讨论。 

myFrame = new JFrame(this, "My Frame");
 
myFrame.getContentPane().setLayout(new FlowLayout());
 
myFrame.getContentPane().append(myButton);
 

JFrame
是常用的窗口组件,有类似操作系统窗口的基本特性,如最小/大化,关闭,缩放,拖动能功能。JFrame的第一个参数指示该窗口所在的容器,第二个参数设置窗口头部的label(即title)。 
getContentPane()
方法获取JFrame容纳其他组件的容器,向JFrame中添加组件记得不要直接调用JFrameappend方法,JFrame 真正容纳其他组件的不是本身,而是其内部的一个容器,用getContentPane()方法获取。 
每个容器排列组件的方式都由Layout控制,setLayout就是设置容器的布局方式,关于布局请参考《AsWing布局管理入门》。 
然后就是调用容器的append方法将刚才的按钮加入到JFrame的容器中。 

myFrame.setSizeWH(300, 200);
 
myFrame.show();
 

这两句代码就比较简单了,设置JFrame的尺寸,并让JFrame显示出来。可能你发现没有使用addChild方法,没关系,JFrame继承 JPopup,所有基于JPopup的组件,AsWing都会自动替你添加到DisplayList中,调用show() 方法就可以设置为可见。 

下面看下很简单的事件处理函数 

private function __buttonClicked(e:AWEvent):void {
 
JOptionPane.showMessageDialog("Hello", "Hello, World!");
 
}
 

JOptionPane
是一个类似Alert的组件,showMessageDialog() 方法即显示一个消息框,第一个参数为消息框的title,第二个参数设置消息内容的字符。 

结束语 
如今基于flashplayerRIA技术非常流行,要开发这样的应用程序就免不了会用到与用户交互的UI组件,AsWing正是这样一套强大的组件 库,提供了常用的基本组件,开发者也可能很容易扩展出自己特制的组件。AsWing的灵活使得开发者不会被特定的条件约束,你可以在整个项目中完全使用 AsWing作为GUI交换组件,也可以仅把AsWing的某一个组件用在你的项目中,帮助你快速的得到所需的UI界面。 
AsWing
的开发者还在不断的改进AsWing,使其更强大,易用。 
本文仅介绍了最基本的AsWing使用,其更多强大的性能正等着你来发掘,请参考其他AsWing相关教程。 

下载资源 
AsWing
下载列表 http://code.google.com/p/aswing/downloads/list 
官方下载页,包括svn代码库地址 http://www.aswing.org/?page_id=4 
参考资料 
AsWing
官方网站 http://www.aswing.org/ 
API
文档 http://doc.aswing.org/a3/ 
案例展示 http://www.aswing.org/?page_id=7 

你可能感兴趣的:(Flex,Flash,开发工具,library,actionscript,flexbuilder)