Project resources

Projects consist of resources (folders and files) that you can manage from the Package Explorer. Projects are contained within a workspace. The Package Explorer provides a logical representation of the workspace in the file system. The Package Explorer is refreshed each time you add, delete, or modify a resource.

You can also edit project resources directly in the file system, bypassing Flash Builder and the Package Explorer.

    Create or delete files and folders in a project

    An application in Flex typically consists of an MXML application file, one or more views (mobile projects only), and one or more standard Flex components. You can also have one or more custom components defined in separate MXML, ActionScript, or Flash component (SWC) files. By dividing the application into manageable chunks, you can write and test each component independently from the others. You can also reuse a component in the same application or in other applications, which increases efficiency.

    You can use Flash Builder to build custom MXML and ActionScript components and then insert them into your applications. For information on building ActionScript components, see Create an ActionScript class.

    You can also build an MXML component directly using code.

    Create files and folders in a project

    1. In the Package Explorer, select File > New > File.

    2. If you have multiple projects in your workspace, select the project to which you want to add the file.

    3. Enter the filename and click Finish.

    You can also add folders and files that are located outside the current project; for more information, see Link to resources outside the project workspace.

    You can add folders to your project as needed. For example, you can create a folder to store all of your data models. Or, you can organize all the assets that make up the visual design of your application.

    1. In Package Explorer select File > New > Folder.

    2. If you have multiple projects in your workspace, select the project to add to the stand-alone folder.

      If you create the folder in the source path folder, it is treated like a package name. You can then place source files inside that folder, which the compiler recognizes.

      If you create the folder outside the source path folder, you can later make it the root of a package structure by adding it to your source path. After you complete this procedure, select Project > Properties and then select Flex Build Path. Click Add Folder and navigate to the newly created folder.

    3. Enter the folder name and click Finish.

    Delete folders and files

    Deleting folders and files from your project removes them from the workspace and, therefore, from the file system.

    Note: If you delete a linked resource, you delete only the link from your project, not the resource itself (see Link to resources outside the project workspace). However, if you’ve linked to a folder and you delete any of the files in it, they are removed from the file system.

    1. In the Package Explorer, select the resource to delete.

    2. Select Edit > Delete or press the Delete key, and click Yes.

      The resource is deleted from the file system.

    Create MXML application files

    1. In the Package Explorer, select the project to which you want to add the MXML application file.

    2. From the Package Explorer context menu, select New > MXML Application.

    3. The application file is created in the src folder, by default. You can select a different folder within the project, if necessary.

    4. Specify a name for the application file, and select a Spark Layout, if necessary. For more information about Spark Layouts, see About Spark layouts.

    5. The following apply only for mobile projects:

      1. Specify an application ID.

      2. Specify the application template.

        See Choose an application template.

      3. Specify the mobile application permissions for the Google Android platform.

        See Choose mobile application permissions.

      4. Specify the platform settings.

        See Choose platform settings

      5. Specify the application settings.

        See Choose application settings.

    6. Click Finish.

    Create an ActionScript file

    You can use a wizard in Flash Builder to quickly create an ActionScript file for your Flex and ActionScript projects.

    1. Select File > New > ActionScript File.

    2. Select a package name for your ActionScript file. If you don't specify a package, the default package is selected. If you specify a package folder that does not exist, the wizard creates it.

    3. Name the ActionScript file.

    4. Click Finish.

    Create an ActionScript class

    You can use a wizard in Flash Builder to quickly create ActionScript classes for your Flex and ActionScript projects. The wizard also provides an easy way to generate stubs for functions that must be implemented.

    1. Select File > New > ActionScript Class.

    2. Specify the basic properties of your new class in the dialog box, and then click Finish.

      After clicking Finish, Flash Builder saves the file in the specified package and opens it in the code editor.

    3. Write the definition of your ActionScript class.

      For more information, see Create simple visual components in ActionScript.

    Create an ActionScript interface

    You can use a wizard in Flash Builder to quickly create ActionScript interfaces for your Flex and ActionScript projects. An interface is a collection of constants and methods that different classes can share.

    1. Select File > New > ActionScript Interface.

    2. Specify the basic properties of your new interface in the dialog box, and then click Finish.

    3. Add any constants or methods to your ActionScript interface that different classes share.

    Create an ActionScript skinnable component

    You can use a wizard in Flash Builder to quickly create ActionScript components for your Flex projects.

    1. Select File > New > ActionScript Skinnable Component.

    2. Specify the basic properties of your new skinnable component, and then click Finish.

      Flash Builder creates an ActionScript class that extends from the base component or the skinnable component. By default, the base component is spark.components.supportClasses.SkinnableComponent. You can, however, change the base component to any other component that is a subclass of the skinnable component.

      You can also add any ActionScript interfaces that the new skinnable component can implement. For more information on creating ActionScript interfaces, see Create an ActionScript interface.

      The SkinnableComponent is created in the selected location and package. A reference to the component is added automatically, by default, in the main MXML file.

    Using ActionScript Workers

    Flash Builder supports multi-thread ActionScript programing by letting you run an ActionScript program as a worker. A worker runs in parallel to the main ActionScript program, and can communicate with the main ActionScript program and other ActionScript workers.

    ActionScript workers let you create more responsive games and applications by offloading tasks and computations to the background workers. The workers run concurrently, making your game-play more responsive. To understand more about ActionScript workers, see Using workers for concurrency.

    For a video on creating and using ActionScript workers, see this video by Adobe Evangelist Lee Brimelow.

    Create an ActionScript worker

    You can use a wizard in Flash Builder to create an ActionScript worker for your Flex and ActionScript projects by following these steps:

    1. Select File > New > ActionScript Worker.

    2. Specify a package name for your ActionScript worker. If you don't specify a package, the class is declared in the default package. If you specify a package folder that does not exist, the wizard creates it.

    3. Name the ActionScript worker file.

    4. An ActionScript worker extends from the flash.display.Sprite class by default. So, you can select only those classes that extend from Sprite.

    5. Add any interface that contains constants and methods that you want to use in your ActionScript worker.

    6. Specify any of the following code generation options:

      Generate Constructor from Superclass
      Generates a constructor with a super() call. If the superclass constructor takes arguments, the arguments are included in the generated constructor and passed up in the super() call.

      Generate Functions Inherited from Interfaces
      Generates function stubs for each interface method. The stubs include a return statement that returns null (or 0 or false for primitive types) so that the stubs compile.

      Generate Comments
      Inserts a "//TODO: implement function" in the generated functions or constructors.

    7. Specify the ActionScript worker usage. For more information, see Specify ActionScript worker usage.

    8. Click Finish to save the worker (.as filename extension) in the specified package and open it in the code editor.

    9. Write the code for your ActionScript worker.

      Flash Builder provides ActionScript worker code templates that let you quickly add code for a worker file. For more information on using code templates, see Code templates.

    To convert an existing ActionScript class into a worker, follow these steps:

    1. In the Package Explorer, select the ActionScript class that you want to convert into an ActionScript worker.

    2. From the Package Explorer context menu, select Set As ActionScript Worker.

    Whenever you create an ActionScript worker, the worker file is added to the list of ActionScript workers in the Project Properties dialog box.

    Specify ActionScript worker usage

    When you create an ActionScript worker, edit the worker, or convert an ActionScript class to a worker, you can specify the worker usage.

    You can choose to embed the worker or load it externally by selecting one of the following options:

    Embedded Worker
    Generates a SWF file for the ActionScript worker class that you want to embed. The SWF file is generated in the "workerswfs" folder of your project, instead of a user-selected output folder.

    When you choose to embed a worker, Flash Builder generates a class named Workers.as. The generated class contains code to embed the SWF file and also create a getter method. You can use the getter method to access the ByteArray class of the embedded ActionScript worker.

    Important: You should not modify the contents of automatically generated class.
    For example, if you create an embedded ActionScript worker called “MyWorker”, code like the following is generated:
    public class Workers 
{ 
    [Embed(source="../workerswfs/MyWorker.swf", mimeType="application/octet-stream")] 
    private static var MyWorker_ByteClass:Class; 
    public static function get MyWorker():ByteArray 
    { 
        return new MyWorker_ByteClass(); 
    } 
}

    Whenever you add, rename, move, or delete an ActionScript worker, Flash Builder modifies the generated code in the Workers.as file.

    If a file named Workers.as exists in the project, Flash Builder generates the class with these filenames in the specified order:

    1. WorkersManager.as

    2. WorkersHolder.as

    If files with all these names exist, then Flash Builder generates the class with a unique filename by appending numbers to these filenames sequentially. For example, Workers1.as, WorkersManager1.as, WorkersHolder1.as, Workers2.as, and so on. You can choose to rename these files if you want; Flash Builder remembers and uses the new filename to generate code.

    When you run or debug the project containing an embedded ActionScript worker, the "workerswfs" folder contains the debug SWF files. When you export a release build, the release SWF files overwrite the debug SWF files in the "workerswfs" folder.

    Externally Loaded Worker
    Generates the SWF file for the ActionScript worker class in a user-selected output folder.

    When you run or debug a project with an externally loaded ActionScript worker, the debug SWF files are generated in the "bin-debug" folder and the release SWF files in the "release" folder.

    Manage ActionScript worker files

    The project’s Properties dialog box lets you manage the worker files in your ActionScript or Flex project.

    1. In the Package Explorer, select a project.

    2. Select Project > Properties from the main menu or select Properties from the context menu. The project’s Properties dialog box appears.

    3. In the left pane, select ActionScript Workers.

    4. Add, edit, or remove worker files as needed, and click OK.

    Add an ActionScript worker or convert an ActionScript class to a worker

    Flash Builder provides you with an option to convert an ActionScript class in your project to a worker.

    1. Go to the project’s Properties dialog box and select ActionScript Workers.

    2. Click Add.

    3. Click Browse to select the class that you want to set as an ActionScript worker. Flash Builder displays only those classes that extend from Sprite and Public classes.

    4. Specify the worker usage. For more information, see Specify ActionScript worker usage.

    Alternatively, you can also use the context menu for a project in the Package Explorer, select Set As ActionScript Worker, and specify the worker usage preference.

    Search for resources in the workbench

    Flash Builder provides a search tool that lets you quickly locate resources.

    To search the document that is currently open in the editor, do the following

    1. Open the document to search.

    2. Do either of the following:

      • Press Control+F (Windows) or Command+F (Mac OS)

      • Select Edit > Find/Replace.

    3. Enter the text string to locate.

    4. (Optional) Enter the replacement text string.

    5. (Optional) Set the advanced search criteria.

    6. Click Find, Replace, Replace All, or Replace/Find.

      If the text string is located in the document, it is highlighted and, optionally, replaced.

    Note: To do an incremental find, press Control+J (Windows) or Command+J (Mac OS).

    To search all resources in the workspace, Flash Builder includes advanced search features that are more powerful than find and replace. Flash Builder lets you find and mark references or declarations to identifiers in ActionScript and MXML files, projects, or workspaces. For more information, see Find references and refactor code.

    Search for files

     Select Search > Search to conduct complex searches for files.

    Note: Click Customize to define what kinds of search tabs are available in the Search dialog box.

    Use the Search view

    The Search view displays the results of your search.

    Open a file from the list

     Double-click the file.

    Remove a file from the list

     Select the file to remove and click Remove Selected Matches.

    Remove all files from the list

     Click Remove All Matches.

    Navigate between matched files

     Click Show Next Match or Show Previous Match.

    View previous searches

     Click the Down Arrow next to Show Previous Searches and select a search from the pull-down list.

    Return to the Search view after closing it

    1. Select Window > Show View > Other.

    2. Expand the General category, select Search, and click OK.

    Link to resources outside the project workspace

    You can create links to resources outside the project and workspace location. You can link to folders and files anywhere on the file system. This option is useful when you have resources that are shared between your projects. For example, you can share a library of custom Flex components or ActionScript files among many different Flex projects.

    Folders that contain linked resources are marked in the Package Explorer (as the following example shows), so that you can distinguish between normal and linked resources.

    Linking to resources

    Other examples for linking resources include a folder of image file assets, or situations when the output folder is not in the project root folder.

    When you work with shared resources, the changes you make to the source folders and files affect all of the projects that are linked to them. Be cautious when you delete linked resources from your projects. In some cases you merely delete the link reference, and in others you delete the source itself. For more information, see Delete folders and files.

    Note: A best practice is to link other projects to your Library Project. Linked resources are encouraged only for third-party libraries with a SWC file.

    Link to resources outside the project workspace

    1. In the Package Explorer, select the project to add linked resources to.

    2. Select File > New > Folder (or File).

    3. Select the project or project folder to add the linked resources to.

    4. Enter the folder or filename. The folder or filename you enter can be different from the name of the folder or file you are linking to.

    5. Click the Advanced button.

    6. Select Link to folder in the file system. Enter or browse to the resource location.

    7. Click Finish to link the resource to your project.

    Use a path variable to link to resources

    Rather than linking to resources by entering the full path to the local or network folder where you store your files, you can define path variables. For more information, see Create a path variable.

    1. In the Package Explorer, select the project to add linked resources to.

      Path variables can also be used in certain project settings, such as the library path and source path.

    2. Select File > New > Folder (or File if you want to add files).

    3. Select the project or project folder to add the linked resources to.

    4. Click the Advanced button to display the advanced options.

    5. Select Link to folder in the file system. Click the Variables button.

    6. Select a defined path variable, or click New to create a path variable.

      If you selected a defined path variable, skip to step 9. If you clicked New, you’ll see the New Variable dialog box.

    7. Enter the path variable name and enter or browse to the file or folder location.

      Click OK to create the path variable.

    8. Select the new path variable in the Select Path Variable dialog box and click OK.

    9. Click Finish to complete the link to the resource.

    You can also define and manage path variables by using the Flash Builder workbench preferences (Open the Preferences dialog and select General > Workspace > Linked Resources).

    Move or share resources between projects in a workspace

      Move resources

      When you work with multiple projects in a workspace, you can move resources from one project to another.

      1. In the Package Explorer, select the resource to move.

      2. Do one of the following:

        • Drag the resource to a new project.

        • Cut and paste the resource to another project.

        When moving resources between projects, you can choose to update references.

        Note: You can move both normal resources and linked resources. For information about linking resources, see Link to resources outside the project workspace.

      Share resources

      To share resources between projects, place all shared resources into folders that can then be linked to each project by using the project’s source path. This is the best method for using shared resources such as classes, MXML components, and images. Updates to these resources are immediately available to all projects that use them. When your projects are compiled, the shared resources are added to the SWC file.

      Add an external resource folder to the source path

      1. Select the project in the Package Explorer.

      2. Select Project > Properties > Flex Build Path (or ActionScript Build Path if you are working with an ActionScript project).

      3. On the build path properties page, select the Source Path tab.

      4. Click the Add Folder button.

      5. Enter or and browse to the folder’s path, and click OK.

        The folder is added to the source path.

      You can also use the Source Path properties tab to edit, delete, or reorder items in the source path.

      Folders that are added to the source path are marked in the Package Explorer.

      Refresh resources in the workspace

      As you edit, add, or delete a project’s resources, the workbench automatically refreshes the various views that display these resources. For example, when you delete a file from your project, that change is immediately reflected in the Package Explorer.

      You can also edit resources outside Flash Builder, directly in the file system. These changes are visible only inside Flash Builder after you refresh the workspace.

      By default, in the stand-alone configuration of Flash Builder, the workspace is refreshed automatically. This option is configurable in Flash Builder preferences. Open the Preferences dialog and select General > Workspace. You can also change the Flash Builder default behavior so that it never refreshes the workspace automatically.

      Manually refresh the workspace

       In the Package Explorer, select Refresh from the context menu. All project resources in the workspace are refreshed.

      Turn off automatic refresh preference

      1. Open the Preferences dialog and select General > Workspace.

      2. Deselect Refresh Automatically.