gembin

OSGi, Eclipse Equinox, ECF, Virgo, Gemini, Apache Felix, Karaf, Aires, Camel, Eclipse RCP

HBase, Hadoop, ZooKeeper, Cassandra

Flex4, AS3, Swiz framework, GraniteDS, BlazeDS etc.

There is nothing that software can't fix. Unfortunately, there is also nothing that software can't completely fuck up. That gap is called talent.

About Me

 

AsWing 入门

ActionScript3.0简介

ActionScript3.0 是Adobe公司为基于flash player 平台开发的一种脚本语言,开发者可以使用其开发出基于flash player运行的多媒体应用程序。

为什么选择AsWing 以及 AsWing

请参考,《AsWing介绍文档》。

环境准备

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

从编译环境来说基本就是2种,一个是Flash CS3,另一个就是 flex sdk。开发工具就很多了,官方的有 FlashCS3,Flex Builder(推荐用FB3),或者使用开源的FlashDevelop(支持使用flash和flex 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

下面具体介绍下在FlexBuilder3和FlashCS3中的配置方法。其他工具雷同。本人使用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 设置… 打开类路径设置窗口,将AsWing的src目录添加进去,按照我的文件路径就是将 E:\AS3\AsWingA3\src 这个路径添加进去,然后点确定就可以了。

P.S.当然FB3也可以使用目录作为编译路径,就是在Library path 旁的 Source path中添加一个 AsWing的src目录。

第一个例子-Hello World!

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

package {
import flash.display.Sprite;

import org.aswing.AsWingManager;
import org.aswing.FlowLayout;
import org.aswing.JButton;
import org.aswing.JFrame;
import org.aswing.JOptionPane;
import org.aswing.event.AWEvent;

public class HelloAsWing extends Sprite {

private var myFrame:JFrame;
private var myButton:JButton;

public function HelloAsWing() {
AsWingManager.initAsStandard(this);

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

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

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

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

如果是使用Flash CS3,可以先新建一个ActionScript文件,输入代码后,保存为HelloAsWing.as,然后新建一个Flash (ActionScript3.0)文件,将该fla文件保存在与HelloAsWing.as的同一级目录中,然后将fla的文档类设置为 HelloAsWing。

运行后可以看到类似这样的界面,你可以试着对该窗口进行各种操作:

点击 Click Me 按钮后,会弹出一个提示窗口,如下图:

 

这就是使用AsWing创建UI组件的一个非常简单的实例程序,下面我们简单分析一下该程序的代码。

实例详细分析

使用AsWing,主程序不需要基于任何应用程序框架,AsWing的UI组件都从flash原生的Sprite扩展而来,所以几乎每一个AsWing组件都能被单独放到DisplayObjectContainer中并能正常使用。
我们的主程序仅需继承Sprite即可,下面分析一下构造函数中的代码。

AsWingManager.initAsStandard(this);

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

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

JButton 是AsWing中基本的按钮组件,这里新建了一个JButton实例,并设置按钮的Label,第二句代码给按钮添加一个事件监听,当点击按钮后就会触发,这里的addActionListener是AsWing设计成简化了事件监听的写法,当然也可以写成这样 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,第二个参数设置消息内容的字符。

结束语

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

下载资源

参考资料

posted on 2008-08-11 18:36 gembin 阅读(1536) 评论(0)  编辑  收藏 所属分类: ActionScript3


只有注册用户登录后才能发表评论。


网站导航:
 

导航

统计

常用链接

留言簿(6)

随笔分类(440)

随笔档案(378)

文章档案(6)

新闻档案(1)

相册

收藏夹(9)

Adobe

Android

AS3

Blog-Links

Build

Design Pattern

Eclipse

Favorite Links

Flickr

Game Dev

HBase

Identity Management

IT resources

JEE

Language

OpenID

OSGi

SOA

Version Control

最新随笔

搜索

积分与排名

最新评论

阅读排行榜

评论排行榜

free counters