Thursday, June 17, 2010

Using FLASH BUILDER 4 Debugger to Debug Flash Professional Projects

In my previous two posts (Create Flash Professional Project in Builder- Part 1 and Part 2) I talked about how to create a Flash Professional Project in Adobe Flash Builder 4, which opened the door for Adobe Flash Professional CS5 to use the Adobe Flash Builder 4 debugger and profiler.
Once a user create a Flash Professional Project in Flash Builder a debug SWF will be generated by Flash Professional CS5 in the bin-debug folder of the project location. This SWF will get updated every time actionscript code in the project changes and is saved in Flash Builder. If you need to rebuild after tweaking assets in Flash Professional, you would need to trigger the debug SWF generation manually in Flash Builder just by modifying an actionscript file in the Flash Professional Project in Flash Builder, then saving.
Remember:
1. Adobe Flash Builder 4 debugger can only debug external actionscript classes. NO debugging for frame script.
2. When creating your Flash Professional Project, a default application class gets created automatically that has the same name as the project name. If you delete this file, the debugger will not work since it’s looking for an application file to start the debugging process.
In the below tutorial, I am going to demonstrate how to debug a Fla file that has a document class using Flash Builder 4 debugger.
1. Launch Adobe Flash Professional CS5.
2. File > New (ActionScript 3.0) Fla file.
3. File > Save the Fla file inside a folder on your machine. In my case, I am going to save it as (FBDebugger.Fla).
4. Window > Properties to open the Properties panel if it is not already.
5. Under Publish category in the PI. Add document class name. In my case, I am going to call it “DocClass” as follows :

6. Click on “Edit class definition” button .

7. Select Flash Builder when prompted with the following dialog :

8. Click OK which should launch Flash Builder if it is not launched already.
9. In Flash Builder, click “Finish” when prompted with the following dialog :

10. Since the document class did not exist, Flash Builder will prompt you to create one as follows :

11. Click “Finish” button.
12. Now let’s look at the Flash Professional Project structure that got created.
a. Project Name: The project name is always the same as the Fla file name.
b. Default Application File: This file is not used by the Flash Professional Project at all, BUT it is very important to have for the Flash Builder debugger to work. PLEASE DON’T DELETE THIS FILE SO THE DEBUGGER/PROFILER WORKS. In our case the default application file for the project is FBDebugger.as which is again not being used at all, but it is since Flash Builder requires that file to exist.
c. FBDebugger.swf (Debug swf) and FBDebugger.html inside the bin-debug folder. This swf is going to be used by the Flash Builder debugger to debug your project.
d. Reference Libraries: This has all the links to your libraries and classes.

13. Open DocClass.as in Flash Builder and add a break point for the document class constructor as follows :

14. Run > Debug FBDebugger as follows:

15. Click Yes when prompted with the following dialog :

16. Flash Builder Debugger session should get started as follows :


 In future posts I am going to demonstrate how to use Flash Builder 4 profiler for Flash Professional Project.
Enjoy!








12 comments:

  1. Hi,

    Found the series pretty useful. But I'm having a little trouble when I come to the last step and press debug. Flash builder gives me a cannot launch file error.

    It debugs fine in Flash mode though.

    ReplyDelete
  2. The same issue as above.
    can't find the html files in the bin-debug folder

    ReplyDelete
  3. can some one help me debug this flash code it is for my character to move in my game?

    ReplyDelete
  4. when i switch my pc on, it shows--- "DR.WATSON DEBUGGER HAS ENCOUNTERED A PROBLEM AND NEEDS TO BE CLOSED"?

    ReplyDelete
  5. if FB says it can't find the html, just copy the one you already have working, change the name of the swf inside the html and debug again..then it works

    ReplyDelete
  6. I don't think this will work, as soon as you declare a library instance with say a dynamic textfield in it Flash Pro knows it's a textfield and can refer to it by instance name, FB won't know about it. Even if you declare an instance of textfield in the linked class it still wont instantiate it :(

    Would love to be proved wrong though...

    ReplyDelete
  7. What is the difference between Adobe Flex and Adobe Dreamweaver?

    ReplyDelete
  8. can some one help me debug this flash code it is for my charcter to move in my game?

    ReplyDelete
  9. What is the difference between Adobe Flex and Adobe Dreamweaver?

    ReplyDelete
  10. Why does my program only flashes and exists really quick whenever i debug it?

    ReplyDelete
  11. can some one help me debug this flash code it is for my charcter to move in my game?

    ReplyDelete
  12. Why does my program only flashes and exists really quick whenever i debug it?

    ReplyDelete