Free Flex2 Development Environ...

来源:百度文库 编辑:神马文学网 时间:2024/04/28 10:37:15
Free Flex2 Development Environment
Posted on December 30th, 2006 by DannyT.
Categories:Uncategorized.
This is certainly not anything groundbreaking, however I thought it might be useful to offer a step by step guide to getting up and running for Flex2/AS3 development without spending a bean on software*.
*N.B. gaping flaw in comment: you will however need Windows to do all of this which is of course not free. Unfortunately this tutorial is for setting up a Flex2/AS3 development environment for Windows. I might get around to exploring a similar setup on Linux but at the moment this is my preferred setup as FlashDevelop will only run on Windows.
This tutorial is essentially an idiot proofing of the (already fairly idiot proof) instructions onFlashDevelop.org. However, I originally struggled with this and know of a few others who have also, so dont feel bad if you‘re reading this having struggled elsewhere (it‘s easy when you know how eh? I dont really think you or I am an idiot). This tutorial is aimed at those wishing to get into some Flex2/AS3 development but haven‘t had a chance to do much yet.
The Environment
We are going to step through the setup of our development environment and build a hello world Flex2/AS3 application using the following:
FlashDevelop (Release 2.02 at time of writing)Flash Player 9 Projector content debug releaseFlex2 SDKAS3 Intrinsic ClassesAS3 Top Level Declaration
Pre-requisites
Before anything will work you‘ll need to make sure you have a couple of things installed. Firstlycheck you have the Microsoft .NET 1.1 SP1 framework if not you need todownload Microsoft .NET 1.1 SP1 framework.
Secondly you‘ll need the flash player for Internet Explorer and it‘s worth getting the "projector content debug release" for ease of testing (saves having to open IE everytime you want to test) visit theAdobe Flash Player download page for these. Once downloaded, right click on a .swf file, select Open With and select "Flash Player 9 r28", this will mean when you test your movies they‘ll run in the standalone player.
You will also need the java 1.5 runtime installed (to check your version click Start, Run, type "cmd" hit enter, type "java -version" hit enter). That should hopefully be everything you need to complete the rest of this tutorial.
Installing FlashDevelop
The first step is to install FlashDevelop, download it fromFlashDevelop.org in the "Releases" forum, this tutorial is written at the time of release 2.0.2 (so don‘t blame me if things change for later versions). Run the installer and follow along as you would any other install.
NOTE: by default FlashDevelop comes ready to run for AS2 projects. If you plan to do AS2 and AS3 development (as I do) I would suggest changing the installed path to "C:\Program Files\FlashDevelop_AS2" or wherever you wish to install it, we will make a duplicate for Flex2/AS3 projects shortly. If you plan on using Flex2/AS3 only then ignore this comment.
That is all there is to installing FlashDevelop, easy eh? This is one of the reasons it‘s getting so much kudos in the OSFlash community.
What about Flex2/AS3????
Ah yes, that‘s what we‘re here for isn‘t it? As noted above, if you plan on doing AS2 development in FlashDevelop as well as AS3, I would recommend making a copy of the Program Files folder you originally installed FlashDevelop to. I made a copy to C:\Program Files\FlashDevelop_AS3, this means you can switch seemlessly between the two without having to change classpaths or settings. If you only plan to do Flex2/AS3 then carry on as you are.
Flex2 SDK
If you don‘t already have it, download theFlex2 SDK from Adobe and extract it somewhere on your PC (I extracted to c:\Flex2\flex_2_sdk). We now need to tell FlashDevelop where it is, look for a file called settings.xml in C:\Program Files\FlashDevelop_AS3\Settings\ (you might need to run FlashDevelop.exe and close it before settings.xml is created) (edit: thanks Phillipe) In FlashDevelop click Tools, Program Settings (or press F9) and make sure that the key ASCompletion.Flex2Sdk.Path has the correct path to the flex2 sdk we extracted earlier. This has now enabled the Flex2 mxmlc compiler.
AS3 Code Completion
In order to have the AS3 intellisense and code completion you‘ll need to download theAS3 Intrinsic Classes and extract them anywhere (I chose C:\Flex2\AS3_intrinsic_classes). Now open FlashDevelop and press Ctrl + F9 to open the global classpaths dialog, add the path to the AS3 intrinsic classes and close FlashDevelop.
Because we‘re using this setup for Flex2/AS3 development only we now need to remove all AS2 reminants. To do thisdownload the AS3 top-level declaration and extract anywhere (except for in the AS3 intrinsic classes folder, I chose C:\Flex2\as3_toplevel). Open FlashDevelop and hit Ctrl+F9 again to open the global classpath dialog and remove the first classpath (%userprofile%\Local Settings\Application Data\Macromedia\Flash MX 2004\en\Configuration\Classes).
Now go to program settings (F9) and set the ASCompletion.Macromedia.Classpath key to the path of the as3 top level declarations (in my case C:\Flex2\as3_toplevel) and also set the ASCompletion.MTASC.UseStdClasses key to false.
MXML completion
The final step is to enable MXML completion. To do thisdownload the MXML definition and extract it to your FlashDevelop‘s data folder (in my case C:\Program Files\FlashDevelop_AS3\Data).
And that is it for setup! You should now have a Flex2/AS3 development environment ready to go. If you want to jump straight in I would suggest reading up on theAS3/MXML custom @mxmlc quickbuild tag, however if you want to make sure everything is working stick with me for an amazingly exciting HelloWorld!!!!
HelloWorld! AS3
Open FlashDevelop (make sure you open the FlashDevelop.exe in your FlashDevelop_AS3 folder if you kept an AS2 version).
Click Project,
Click New Project,
Select Empty Project,
Enter the project name "HelloWorldAS3" and choose where you want the project created.
You should see in the right hand project explorer a panel with your project file,
right click that and select Add, New Class
Enter the class name "HelloWorld" click OK,
Your HelloWorld Class will appear,
Click Syntax, AS3. You can test this now by typing the following:
PLAIN TEXT
Actionscript:
package
{
import flash.display.Sprite;
import flash.text.TextField;
public class HelloWorld extends Sprite
{
function HelloWorld()
{
var t:TextField = new TextField();
t.text = "HelloWorld!";
addChild(t);
}
}
}
If you type the above (instead of copy paste) replacing the default class structure (that‘s AS2) you should notice you have AS3 intellisense and code completion! Cool eh?
Now to run the project, simply click the Quick MTASC Build button (grey cog with a red bug on it) and if all has gone to plan you should see your first AS3 swf file created and loaded for your viewing pleasure. If it worked congratulations! If not, post a comment here or on theFlashDevelop.org forums and I‘m sure we‘ll get it sorted.
HelloWorld! MXML
Now we all know AS3 isn‘t Flex2 and Flex2 isn‘t AS3, it all comes together when we introduce MXML, Flex2‘s markup language. Fortunately we‘ve just setup a very cool environment for creating this very thing, so without further ado:
Open FlashDevelop if it‘s not already running,
Click Project, New Project
Select Empty Project
Name the project "HelloWorldMXML", choose where you wish it to save and click OK,
In the project explorer on the right, right click HelloWorldMXML and select Add, New Xml File...
Name the file "HelloWorld.mxml" and click OK,
Now type the following into your mxml file:
PLAIN TEXT
XML:
xmlns:mx="http://www.adobe.com/2006/mxml"
horizontalAlign="center" verticalAlign="center"
>





Again, you should notice you have mxml intellisense and code completion making it a breeze to knock up an mxml layout.
Once done click the Quick MTASC Build button and whoosh, you should see your first Flex2 swf created and displayed. If so well done, if not post a message orhit the forums.
Next head over to theAdobe Flex2 quickstarts and start finding your way around Flex2 and AS3!
Any comments, suggestions, corrections, questions etc feel free to bang into the comments.
搭建免费的flex2&as3开发环境:flashdevelop2.0.2

1.下载软件及类库
a)Flex2sdk:http://www.adobe.com/products/flex/
b)java 1.5 runtime:http://java.sun.com/javase/downloads/index_jdk5.jsp
下面的Java Runtime Environment (JRE) 5.0 Update 10
c)在apache官方网站下载下载ant:http://www.apache.org/dist/ant/binaries/
d)Microsoft .NET 1.1 SP1 framework(dotnetfx.exe):http://download.pchome.net/php/dl.php?sid=12854
e)flashdevelop2.0.2:http://www.flashdevelop.org/downloads/releases/FlashDevelop-2.0.2-Final.exe
f)flashplayer9的独立运行调试播放器:http://www.adobe.com/support/flashplayer/downloads.html
下面的Adobe Flash Player 9 — Debugger Versions (aka debug players or content debuggers) for Flex Developers 中的Download the Windows Flash Player 9 Projector content debugger (EXE, 2.67 MB)
g)AS3 Intrinsic Classes(AS3基础类):http://www.returnundefined.com/fdas3/
h)AS3 Top Level Declaration(AS3顶级声明):http://www.flashdevelop.org/downloads/releases/as3_toplevel.zip
i)下载MXML语法schema文件:URLhttp://timwalling.com/downloads/Flex201_MXML_definition.zip
j)下载flex2和AS3的ant模板工程(ANT-based project templates)http://www.bit-101.com/flashdevelop/ProjectTemplates.zip
2.安装软件
a)下载flex2sdk后,解压到C盘或者其他开发路径下;
b)安装java1.5运行时环境
c)安装.net运行时环境
d)右击一个.swf文件,选择打开方式为flash player9.0 r28,这样设置了swf文件运行在调试版播放器下。
e)安装flashdevelop2.0.2开发工具
3.配置环境
a)配置Flex2编译器
- 检查java1.5运行时环境已经安装
- 选择flashdevelop的Tools/Programming Settings,或者按F9,打开设置窗口,检查ASCompletion.Flex2SDK.Path entry,设置(双击)它的值为flex2sdk的安装目录。
c)激活AS3自动完成功能
-将下载的AS3_intrinsic_classes.zip解压到任意目录,或者放到flashdevelop的安装目录下。
- 选择flashdevelop的Tools/Global Classpaths,或者按Ctrl+F9,打开全局类路径窗口,增加一个全局类路径,指向AS3_intrinsic_classes路径。
d)除去AS2语法干扰
- 解压as3_toplevel.zip到任意位置,或者放到flashdevelop的安装目录下。
- 在program settings中设置ASCompletion.Macromedia.Classpath为AS3 top-level路径,设置ASCompletion.MTASC.UseStdClasses为false.
d)激活MXML代码自动完成
- 将下载的Flex201_MXML_definition.zip解压,将其中的XMLCompletion.xml放到C:\Program Files\FlashDevelop\Data\下面。
f)配置环境变量:set ANT_HOME=c:\ant
set JAVA_HOME=c:\jdk1.2.2
set PATH=%PATH%;%ANT_HOME%\bin
g)解压模板工程,将05 AS3 Project和06 Flex 2 Project文件夹放到C:\Program Files\FlashDevelop\Data\ProjectTemplates下面。
h)关闭flashdevelop,并重新打开,使起设置生效。
4.测试开发
a)测试MXML应用
打开flashdevelop右下角的project面板,新建flex2工程,在app.mxml文件编写组件,可以发现自动完成功能非常好,输入“>”自动补齐上“/”。
双击build.xml文件,在command prompt进行ant编译部署时,注意build.properties中flex2.dir的定义要指向flex2sdk的路径,否则部署不成功。
b)剩下的就和danny的教程一样了http://danny-t.co.uk/index.php/tutorials/free-flex2-development-environment/
5. IDE下载
http://www.openria.cn/downloads/FlashDevelop_IDE_allInOne.rar