Navigating Your Code and FDT's Workspace
From FDT Documentation
|Line 20:||Line 20:|
== Debug ==
== Debug ==
Open the [[Debug Perspective]] [[Image:Debug icon.gif]] by selecting it within the ''Open Perspective'' window [http://fdt.powerflasher.com/docs/File:06_004.jpg]. FDT will update the view with a new window layout, that you can change and save, as well as add the ''Debug'' icon to the list of perspectives on the top right [http://fdt.powerflasher.com/docs/File:06_005.jpg]. Check out [[Using
Open the [[Debug Perspective]] [[Image:Debug icon.gif]] by selecting it within the ''Open Perspective'' window [http://fdt.powerflasher.com/docs/File:06_004.jpg]. FDT will update the view with a new window layout, that you can change and save, as well as add the ''Debug'' icon to the list of perspectives on the top right [http://fdt.powerflasher.com/docs/File:06_005.jpg]. Check out [[Using Debugger]] for more information on how to use FDT's debugger.
== Profiler ==
== Profiler ==
Revision as of 19:30, 30 September 2010
With all the ins and outs of an IDE like FDT, a developer can get lost in seemingly endless windows and views. It's important to know how to get around the application and make sure you stay in control of what you're looking at.
This walk through will demonstrate working with views and perspectives, then show off some of FDT's code navigation features.
There are numerous options, windows and keystrokes to remember. In case you forget a particular key binding, right click within the Editor and a popup will appear that will display the available navigation options as well as their keybinding .
When working with Eclipse, the platform FDT is built upon, you develop in something called Perspectives. The perspective you are currently working in will determine which tools are available to you. As a Flash developer, you'll be primarily working within the Flash FDT Perspective. If you have purchased the Max version of FDT, which is highly recommended, you will also have access to the Debug Perspective.
Another way to browse Perspectives is to click on the Open Perspective icon located at the top right of the window .
Right clicking on the perpective icon will provide a popup where you can customize the perspective as well as how the icons appear - e.g. showing the name of the perspective or not  - and clicking on the icon perspective itself will switch to the selected perspective .
Open the Debug Perspective by selecting it within the Open Perspective window . FDT will update the view with a new window layout, that you can change and save, as well as add the Debug icon to the list of perspectives on the top right . Check out Using FDT's Debugger for more information on how to use FDT's debugger.
FDT now includes a Profiler. The Profiler Perspective is where developers can get detailed information about a .SWF that is currently running . Just like all other perspectives, windows can be dragged around and adjusted to your liking. Learn more about the profiler in the Intro To Profiling Applications tutorial.
Views in FDT are panels that display some type of information. In this example , the views that are open are:
Opening, Closing and Minimizing Views
If you need to open a particular View, just go to Window>Show View . Views can also be closed  or minimized . A view that has been minimized can be restored by clicking on the Restore button .
Views can also be dragged and dropped. This allows you to customize the display of the currently active perspective. Grab the tab of a particular view and drag it around as you see fit. Here I'm dragging the FDT Welcome Screen  to make a new Editor appear .
An important note with the Editor is, it will only give you ActionScript error checking and other Smart Editor features when the file it has open is located within a Source Folder. If you were to disable the src folder in this example , the Editor will no longer have features such as code hinting .
There are numerous FDT features that make moving around your code much easier and intuitive. Let's look at a few of them.
With a file is active within the Editor, hit Cmd+O (OSX) or Ctrl+O (Win) to call up FDT's Quick Outline . The Quick Outline is a great way to navigate the currently active Class. When activated, begin typing the name of the method or property you'd like to jump to , and then use the arrow keys or mouse to select it , then hit enter to have FDT open it for you .
Similar to the Quick Outline, the Type Hierarchy, Cmd+T (OSX) or Ctrl+T (Win), allows you to browse and select superclasses associated with the Class that is active in the Editor . Just like the Quick Outline, you can filter the results by typing with the text input at the top .
Show In Explorer
Type Dependency Outline
The Type Dependency Outline is works just like the Quick Outline and Type Hierarchy. Just hit Cmd+U (OSX) or Ctrl+U (Win) to bring it up .
New with FDT 4 is the Type Dependencies view and Package Dependencies view. Access these views by going to the Show View window  and going to FDT>Package Dependencies  or FDT>Type Dependencies 
This visualizer will display Classes (Objects) associated with the currently selected Class as well as their relationships. After opening the Type Dependencies view  either double click on a Class within the Flash Explorer or activate a Class within the Editor. After doing so, the Type Dependencies view will analyze the selected Class and build a visualization - showing the currently selected Class in yellow .
Some Classes will have many dependencies and this can mean that the view can be come very cluttered. To help with this, the Type Dependency view is also interactive, allowing you to click and drag the icons around the screen. Here the icons have been arranged to show superclasses on the left and Classes that are used or referenced are on the right .
Clicking on the Back button will return you to the Class you just came from .
Similar to the Type Dependency view, Package Dependencies will visualize referenced packages . To active click on a package within the Flash Explorer.
In this example the demo.powerflasher package contains a reference to the objects.display package . Contrast that to the demo.powerflasher package which does not have a reference to any other packages .