FDT and Ant Tutorial

From FDT Documentation

(Difference between revisions)
Jump to: navigation, search
(Customizing The Build and Using Multiple Targets)
Line 1: Line 1:
-
Sometimes the build process can get pretty complex. For example, you may create several SWCs, SWFs, some HTML files to be dynamically updated and files copied and uploaded.  In these cases the launcher on it's own won't cut it. This is where Ant comes in.
+
Sometimes the build process can get pretty complex. For example, you may create several SWCs, SWFs, have some HTML files to be dynamically updated and files to be copied and uploaded.  In these cases the launcher on it's own won't cut it. This is where Ant comes in.
FDT ships with built in Ant tasks for you to use and at the same time, Ant provides a lot of useful tasks already. This intro will help get you acquainted with using FDT and Ant.
FDT ships with built in Ant tasks for you to use and at the same time, Ant provides a lot of useful tasks already. This intro will help get you acquainted with using FDT and Ant.
=Getting Started=
=Getting Started=
-
Begin by importing this project into FDT ( learn about importing and exporting via Creating Project Templates). Or create your own.
+
Begin by importing this project into FDT ( learn about importing and exporting from the [[Sharing and Archiving Projects]] tutorial). Or create your own.
=Create Your Build File=
=Create Your Build File=
-
With the project open [[File:09_001.gif|10px]], let's begin by creating our 'build' Ant file. Right click on the project and choose '''new>other…''' [[File:09_002.gif|10px]].
+
With the project open [[http://fdt.powerflasher.com/docs/File:09_001.gif]], let's begin by creating our 'build' Ant file. Right click on the project and choose '''new>other…''' [[http://fdt.powerflasher.com/docs/File:09_002.gif]].
-
Type '''xml''' in the filter field, choose '''XML''' from the '''XML''' folder and then click '''Next''' [[File:09_003.gif|10px]]. Name the file '''build.xml''' (it can be anything but 'build' is the standard), save it within the root directory and then click '''Finish''' [[File:09_004.gif|10px]].  
+
Type '''xml''' in the filter field, choose '''XML''' from the '''XML''' folder and then click '''Next''' [[http://fdt.powerflasher.com/docs/File:09_003.gif]]. Name the file '''build.xml''' (it can be anything but 'build' is the standard), save it within the root directory and then click '''Finish''' [[http://fdt.powerflasher.com/docs/File:09_004.gif]].  
As of now, the file is a standard .xml file. We can edit the file as is and it will work but it would be immensely helpful if we had the syntax highlighting and auto completion like we have when editing ActionScript files. To do this, we want to make sure FDT opens this file up as an Ant build file.
As of now, the file is a standard .xml file. We can edit the file as is and it will work but it would be immensely helpful if we had the syntax highlighting and auto completion like we have when editing ActionScript files. To do this, we want to make sure FDT opens this file up as an Ant build file.
-
For FDT to recognize this .xml file as an Ant file, all we need to do is to  do is add in this syntax [[File:09_005.gif|10px]]:
+
For FDT to recognize this .xml file as an Ant file, all we need to do is to  do is add in this syntax [[http://fdt.powerflasher.com/docs/File:09_005.gif]]:
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
Line 25: Line 25:
Close the file and then open it back up within the editor. We need to do this because the first time FDT opened the file, it opened it as a generic XML file - using the XML Editor. When the file is opened up and the Ant file syntax is recognized, it will open the file with the Ant Editor.
Close the file and then open it back up within the editor. We need to do this because the first time FDT opened the file, it opened it as a generic XML file - using the XML Editor. When the file is opened up and the Ant file syntax is recognized, it will open the file with the Ant Editor.
-
When the file is opened up again, you will immediately recognize that FDT has detected an error: '''target element appears without a name attribute''' [[File:09_006.gif|10px]].  This is great, FDT now will tell us about syntax errors and any incomplete arguments (attributes) with our tasks.
+
When the file is opened up again, you will immediately recognize that FDT has detected an error: '''target element appears without a name attribute''' [[http://fdt.powerflasher.com/docs/File:09_006.gif]].  This is great, FDT now will tell us about syntax errors and any incomplete arguments (attributes) with our tasks.
We also now have code hinting and auto completion.  Move your cursor to the '''target''' task and begin typing '''name''' and then '''Ctrl+Space''' (autocomplete) and the '''name''' attribute will be filled in.  Add a name, let's use '''default''', then save the file to have the errors recalculated in our '''Problems''' view.
We also now have code hinting and auto completion.  Move your cursor to the '''target''' task and begin typing '''name''' and then '''Ctrl+Space''' (autocomplete) and the '''name''' attribute will be filled in.  Add a name, let's use '''default''', then save the file to have the errors recalculated in our '''Problems''' view.
=Your First Task: Compiling & JRE Error=
=Your First Task: Compiling & JRE Error=
-
Within the '''task''' element, begin typing '''fdt.launch.application''' and use FDT's auto-complete to fill in the remainder of the element [[File:09_007.gif|10px]]. With the element created, add these three attributes to the element: '''projectname''' , '''mainclass''' and '''target'''.
+
Within the '''task''' element, begin typing '''fdt.launch.application''' and use FDT's auto-complete to fill in the remainder of the element [[http://fdt.powerflasher.com/docs/File:09_007.gif]]. With the element created, add these three attributes to the element: '''projectname''' , '''mainclass''' and '''target'''.
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
Line 38: Line 38:
-
This is the minimum needed to create a .swf with FDT and Ant. Just like many other tasks in FDT, there are a few different ways to run Ant tasks.  The easiest way is to execute tasks via the '''Ant View'''. If the view isn't open already, open it via '''Window>Show View>Ant''' [[File:09_008.gif|10px]]. With the Ant view open, drag the '''build.xml''' file into the '''Ant''' panel [[File:09_009.gif|10px]] and then expand the elements and you'll see how the Ant View's contents match the build.xml file in the Editor [[File:09_010.gif|10px]].
+
This is the minimum needed to create a .swf with FDT and Ant. Just like many other tasks in FDT, there are a few different ways to run Ant tasks.  The easiest way is to execute tasks via the '''Ant View'''. If the view isn't open already, open it via '''Window>Show View>Ant''' [[http://fdt.powerflasher.com/docs/File:09_008.gif]]. With the Ant view open, drag the '''build.xml''' file into the '''Ant''' panel [[http://fdt.powerflasher.com/docs/File:09_009.gif]] and then expand the elements and you'll see how the Ant View's contents match the build.xml file in the Editor [[http://fdt.powerflasher.com/docs/File:09_010.gif]].
-
To start the build, just select the target ( '''default''' in our case ) within the Ant View [[File:09_011.gif|10px]] and then click the '''Run''' button[[File:09_012.gif|10px]].
+
To start the build, just select the target ( '''default''' in our case ) within the Ant View [[http://fdt.powerflasher.com/docs/File:09_011.gif]] and then click the '''Run''' button[[http://fdt.powerflasher.com/docs/File:09_012.gif]].
Immediately we encounter an error:
Immediately we encounter an error:
Line 50: Line 50:
We need to have the Ant build execute within the same JRE as FDT in order to have access to FDT's custom Ant tasks. Otherwise, it will run in a sandboxed environment that doesn't know anything about FDT.  
We need to have the Ant build execute within the same JRE as FDT in order to have access to FDT's custom Ant tasks. Otherwise, it will run in a sandboxed environment that doesn't know anything about FDT.  
-
Fortunately for us, this is a simple fix - from the '''External Tools''' menu choose '''External Tools Configurations''' [[File:09_013.gif|10px]]. With the '''External Tools Configurations''' open [[File:09_014.gif|10px]] navigate to the '''JRE''' tab [[File:09_015.gif|10px]] and check the radio button next to '''Run in the same JRE as the workspace''' [[File:09_016.gif|10px]]. From here we can simply click '''Run''' to have the build execute. [[File:09_017.gif|10px]]
+
Fortunately for us, this is a simple fix - from the '''External Tools''' menu choose '''External Tools Configurations''' [[http://fdt.powerflasher.com/docs/File:09_013.gif]]. With the '''External Tools Configurations''' open [[http://fdt.powerflasher.com/docs/File:09_014.gif]] navigate to the '''JRE''' tab [[http://fdt.powerflasher.com/docs/File:09_015.gif]] and check the radio button next to '''Run in the same JRE as the workspace''' [[http://fdt.powerflasher.com/docs/File:09_016.gif]]. From here we can simply click '''Run''' to have the build execute. [[http://fdt.powerflasher.com/docs/File:09_017.gif]]
-
The build will run and from the output [[File:09_018.gif|10px]] we see that our .swf has been created. The important bit to read is this:
+
The build will run and from the output [[http://fdt.powerflasher.com/docs/File:09_018.gif]] we see that our .swf has been created. The important bit to read is this:
'''[fdt.launch.application] 644 bytes written to file /Users/OSX/_dev/fdt/AS3Project/bin/Main.swf in 2429 ms
'''[fdt.launch.application] 644 bytes written to file /Users/OSX/_dev/fdt/AS3Project/bin/Main.swf in 2429 ms
Line 61: Line 61:
With the basics down, lets extend our Ant build. It won't be very realistic, but it will demonstrate  ways of extending Ant.  
With the basics down, lets extend our Ant build. It won't be very realistic, but it will demonstrate  ways of extending Ant.  
-
First thing I want to do is give my build a name so it's not referred to as '''project'''  and change the name of my target to '''compile'''[[File:09_019.gif|10px]].
+
First thing I want to do is give my build a name so it's not referred to as '''project'''  and change the name of my target to '''compile'''[[http://fdt.powerflasher.com/docs/File:09_019.gif]].
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
Line 74: Line 74:
-
Next, I'll add a task to create a .SWC [[File:09_020.gif|10px]]:
+
Next, I'll add a task to create a .SWC [[http://fdt.powerflasher.com/docs/File:09_020.gif]]:
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
Line 88: Line 88:
-
Then add some more tasks [[File:09_021.gif|10px]]:
+
Then add some more tasks [[http://fdt.powerflasher.com/docs/File:09_021.gif]]:
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
Line 114: Line 114:
This is all pretty straight forward.  The new '''browse''' target will launch my browser navigate it to the '''Main.swf''' and the '''zip''' and '''move''' tasks are built into Ant.  For more info on that, check out an [http://ant.apache.org/manual/tasksoverview.htm overview of Ant tasks].  
This is all pretty straight forward.  The new '''browse''' target will launch my browser navigate it to the '''Main.swf''' and the '''zip''' and '''move''' tasks are built into Ant.  For more info on that, check out an [http://ant.apache.org/manual/tasksoverview.htm overview of Ant tasks].  
-
Last, I'm going to include a '''run.all''' target [[File:09_022.gif|10px]] and then set it as my default [[File:09_023.gif|10px]]:
+
Last, I'm going to include a '''run.all''' target [[http://fdt.powerflasher.com/docs/File:09_022.gif]] and then set it as my default [[http://fdt.powerflasher.com/docs/File:09_023.gif]]:
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
Line 122: Line 122:
-
Setting the default task is handy. Running the file from the command line won't need a target argument, double clicking on the build file within the Ant view will run it, and the task in the Ant view is now blue - making it easier to read [[File:09_024.gif lang="xml"].
+
Setting the default task is handy. Running the file from the command line won't need a target argument, double clicking on the build file within the Ant view will run it, and the task in the Ant view is now blue - making it easier to read [[http://fdt.powerflasher.com/docs/File:09_024.gif lang="xml"].
-
To run everything, just double click on the Ant build file icon within the Ant view, and all the magic will start [[File:09_025.gif|10px]].
+
To run everything, just double click on the Ant build file icon within the Ant view, and all the magic will start [[http://fdt.powerflasher.com/docs/File:09_025.gif]].
Here is the build file in it's entirety:
Here is the build file in it's entirety:

Revision as of 20:19, 27 September 2010

Sometimes the build process can get pretty complex. For example, you may create several SWCs, SWFs, have some HTML files to be dynamically updated and files to be copied and uploaded. In these cases the launcher on it's own won't cut it. This is where Ant comes in.

FDT ships with built in Ant tasks for you to use and at the same time, Ant provides a lot of useful tasks already. This intro will help get you acquainted with using FDT and Ant.

Contents

Getting Started

Begin by importing this project into FDT ( learn about importing and exporting from the Sharing and Archiving Projects tutorial). Or create your own.

Create Your Build File

With the project open [[1]], let's begin by creating our 'build' Ant file. Right click on the project and choose new>other… [[2]].

Type xml in the filter field, choose XML from the XML folder and then click Next [[3]]. Name the file build.xml (it can be anything but 'build' is the standard), save it within the root directory and then click Finish [[4]].

As of now, the file is a standard .xml file. We can edit the file as is and it will work but it would be immensely helpful if we had the syntax highlighting and auto completion like we have when editing ActionScript files. To do this, we want to make sure FDT opens this file up as an Ant build file.

For FDT to recognize this .xml file as an Ant file, all we need to do is to do is add in this syntax [[5]]:

<project>
	<target>
	</target>
</project>


Close the file and then open it back up within the editor. We need to do this because the first time FDT opened the file, it opened it as a generic XML file - using the XML Editor. When the file is opened up and the Ant file syntax is recognized, it will open the file with the Ant Editor.

When the file is opened up again, you will immediately recognize that FDT has detected an error: target element appears without a name attribute [[6]]. This is great, FDT now will tell us about syntax errors and any incomplete arguments (attributes) with our tasks.

We also now have code hinting and auto completion. Move your cursor to the target task and begin typing name and then Ctrl+Space (autocomplete) and the name attribute will be filled in. Add a name, let's use default, then save the file to have the errors recalculated in our Problems view.

Your First Task: Compiling & JRE Error

Within the task element, begin typing fdt.launch.application and use FDT's auto-complete to fill in the remainder of the element [[7]]. With the element created, add these three attributes to the element: projectname , mainclass and target.

<fdt.launch.application projectname="AS3Project" 
    mainclass="src/Main.as" target="bin/Main.swf"/>


This is the minimum needed to create a .swf with FDT and Ant. Just like many other tasks in FDT, there are a few different ways to run Ant tasks. The easiest way is to execute tasks via the Ant View. If the view isn't open already, open it via Window>Show View>Ant [[8]]. With the Ant view open, drag the build.xml file into the Ant panel [[9]] and then expand the elements and you'll see how the Ant View's contents match the build.xml file in the Editor [[10]].

To start the build, just select the target ( default in our case ) within the Ant View [[11]] and then click the Run button[[12]].

Immediately we encounter an error:

Problem: failed to create task or type fdt.launch.application

This may seem frustrating at first, but when you understand how Ant, Java, FDT and your operating system work together it makes sense why this happens. By default, development with Eclipse (the platform FDT is built upon) recommends using separate Java Runtime Environments (JRE) when developing and testing applications. That's great for Java developers, but we don't need that type of sand boxing when creating .SWFs.

We need to have the Ant build execute within the same JRE as FDT in order to have access to FDT's custom Ant tasks. Otherwise, it will run in a sandboxed environment that doesn't know anything about FDT.

Fortunately for us, this is a simple fix - from the External Tools menu choose External Tools Configurations [[13]]. With the External Tools Configurations open [[14]] navigate to the JRE tab [[15]] and check the radio button next to Run in the same JRE as the workspace [[16]]. From here we can simply click Run to have the build execute. [[17]]

The build will run and from the output [[18]] we see that our .swf has been created. The important bit to read is this:

[fdt.launch.application] 644 bytes written to file /Users/OSX/_dev/fdt/AS3Project/bin/Main.swf in 2429 ms BUILD SUCCESSFUL

Customizing The Build and Using Multiple Targets

With the basics down, lets extend our Ant build. It won't be very realistic, but it will demonstrate ways of extending Ant.

First thing I want to do is give my build a name so it's not referred to as project and change the name of my target to compile[[19]].

<project name="AS3Project Build">
	<target name="compile">
		<fdt.launch.application projectname="AS3Project" 
                     mainclass="src/Main.as" target="bin/Main.swf" />
	</target>
</project>


Next, I'll add a task to create a .SWC [[20]]:

<project name="AS3Project Build">
	<target name="compile">
		<fdt.launch.application projectname="AS3Project" 
                      mainclass="src/Main.as" target="bin/Main.swf" />
		<fdt.launch.library projectname="AS3Project" target="bin/Main.swc"/>
	</target>
</project>


Then add some more tasks [[21]]:

<project name="AS3Project Build">
	<target name="compile">
		<fdt.launch.application projectname="AS3Project" 
                      mainclass="src/Main.as" target="bin/Main.swf" />
		<fdt.launch.library projectname="AS3Project" target="bin/Main.swc"/>
	</target>
 
	<target name="browse">
		<fdt.browse location="${basedir}/bin/Main.swf" />
	</target>
 
	<target name="zip">
		<zip destfile="${basedir}/deploy.zip" basedir="${basedir}/bin"/>
		<move file="${basedir}/deploy.zip" todir="${basedir}/deploy" />
	</target>
 
</project>


This is all pretty straight forward. The new browse target will launch my browser navigate it to the Main.swf and the zip and move tasks are built into Ant. For more info on that, check out an overview of Ant tasks.

Last, I'm going to include a run.all target [[22]] and then set it as my default [[23]]:

<target name="run.all" depends="compile,browse,zip">
</target>


Setting the default task is handy. Running the file from the command line won't need a target argument, double clicking on the build file within the Ant view will run it, and the task in the Ant view is now blue - making it easier to read [lang="xml".

To run everything, just double click on the Ant build file icon within the Ant view, and all the magic will start [[24]].

Here is the build file in it's entirety:

<?xml version="1.0" encoding="UTF-8"?>
<project name="AS3Project Build" default="run.all">
	<target name="compile">
		<fdt.launch.application projectname="AS3Project" 
                     mainclass="src/Main.as" target="bin/Main.swf" />
		<fdt.launch.library projectname="AS3Project" target="bin/Main.swc" />
	</target>
 
	<target name="browse">
		<fdt.browse location="${basedir}/bin/Main.swf" />
	</target>
 
	<target name="zip">
		<zip destfile="${basedir}/deploy.zip" basedir="${basedir}/bin" />
		<move file="${basedir}/deploy.zip" todir="${basedir}/deploy" />
	</target>
 
	<target name="run.all" depends="compile,browse,zip">
	</target>
</project>
Get FDT5