Table of contents
20 June 2011
Knowledge of Flex and/or ActionScript
Note: Besides this article, you can watch Serge Jespers's accompanying video to learn more about Flash Builder 4.5.
Just twelve months on from the release of Flash Builder 4, we're excited to deliver a major update to our developer tooling that introduces a wealth of new features and enhancements to Flash Builder.
Our pre-release testers have described this as a game-changing release and we hope you agree that we're providing the most productive development environment for Flex and ActionScript developers.
In Flash Builder 4.5 we've focused our efforts on the following areas:
- Developing mobile and multiscreen applications
- Accelerated coding for Flex and ActionScript projects
- Improved designer/developer workflow
- Updated platform support and improved performance
This article will provide you with an overview of the new features, product enhancements, and workflows introduced in Flash Builder 4.5, as well as provide links to additional resources that will help you get started with this release.
Flash Builder 4.5 adds comprehensive support for developing, testing and deploying mobile AIR applications built using Adobe Flex 4.5 SDK or ActionScript. Using your existing skills and familiar workflows, you can now productively build web, desktop, and mobile applications with Flash Builder.
We’ve added support for defining either a Flex or an ActionScript mobile project in Flash Builder, from which you can package an application that targets one or more mobile platforms, including Google Android, Apple iOS and BlackBerry Tablet OS.
Adobe Flex 4.5 SDK introduces support for mobile application development, through the provision of mobile optimized mobile components and new application-level constructs that encapsulate common design patterns for mobile applications (see Figure 1). For projects using Adobe Flex 4.5 SDK, the coding environment in Flash Builder automatically suggests mobile optimized components through content assist, while design view provides full support for mobile application layout and visual preview for different device screen sizes and orientations.
For all mobile projects, Flash Builder enables convenient launch and debugging options, allowing applications to be previewed and debugged either on the desktop or using a connected mobile device.
When your application is finished and ready for deployment, Flash Builder provides a streamlined workflow for exporting a release build of the application.
For more information on developing mobile applications using Adobe Flex 4.5 SDK and Flash Builder 4.5 please read Narciso Jaramillo’s article on the Adobe Developer Connection site.
As we planned for this release, we listened to requests from developers to provide an even more productive coding environment - that's what we've delivered in Flash Builder 4.5. There are over 25 new features focused on making your coding experience faster, in addition to those we added in Flash Builder 4.
Flash Builder 4.5 adds support for code templates (often referred to as snippets), allowing you to use content assist to insert pre-defined blocks of MXML, ActionScript or CSS into your code. Flash Builder comes with over 100 built-in templates that are ready-to-use, such as for defining a package, class, for loop, while loop, switch block, etc. You can define your own set of custom templates, as well as import/export templates so that everyone on the development team has a consistent set of templates for use on projects (see Figure 2).
Quick Assists provide contextual access to convenient code-related operations and can be accessed in Flash Builder 4.5 using CTRL+1. In this release we’ve added support for renaming identifiers in file or workspace, organizing imports, converting local variables to field, assigning expressions to variables, generating getter/setters, generating event handlers, generating label functions and splitting variable declarations. Quick Assists can also be used to generate stub code when you reference a yet-to-be-defined variable, method, class or interface in your code. In these situations, Flash Builder provides a real-time warning, indicated by an orange squiggly line, allowing you to use Quick Assist to resolve the problem and continue with the development task in hand.
In addition to the above features, we’ve added support for metadata content assist, meaning that Flash Builder now provides you with code hints for both Flex SDK and custom metadata when you type ‘[‘ in code view; we’ve improved content assist so as to support proposal cycling for ActionScript, meaning that you can quickly filter code hints to only show templates, variables, functions, classes/interfaces, packages or namespaces; and we’ve added the ability to generate stub methods for parent class methods that you want to override or interface methods that you want to implement.
We also paid particular attention to a range of minor enhancements that collectively make a big impact on the coding experience - in Flash Builder 4.5 you'll benefit from the following improvements:
- Getter/setter supports Bindable metadata with dispatch event code
- Enhanced CSS content assist, navigation and refactoring
- Code formatting for MXML documents
- Content assist for event handlers in MXML shows existing functions
- Code completion inserts state syntax when a state is selected
- Next/previous sub-word navigation support
- Block selection and edit mode
For more information on using the coding productivity features in Flash Builder 4.5 please read Sameer Bhatt and Sreenivas Ramaswamy’s article on the Adobe Developer connection site.
With the release of Flash Builder 4 and Flash Catalyst CS5 we enabled designers and developers to begin to collaborate on the production of high-fidelity Flex projects, with the designer providing the developer with design assets and component skins. We knew however that further investment was required to support bi-directional workflows between designers and developers.
The Flash Catalyst team has also been working hard on a new release, Flash Catalyst CS5.5, which adds support for opening Flex projects that were created or edited in Flash Builder 4.5.
In addition to opening Flash Builder projects, Flash Catalyst has improved code generation, supports re-sizable user interfaces, and ensures that developer code referenced from user interface controls are protected from designer edits.
To support the new capabilities in Flash Catalyst CS5.5, we’ve introduced a number of new features in Flash Builder 4.5.
One of the key things a developer will need to consider while working with a designer is maintaining compatibility with sub-set of Flex features supported by Flash Catalyst; in addition, there are also some project configuration settings which are incompatible with Flash Catalyst. In Flash Builder you can turn on the ‘Flash Catalyst compatibility checker’ to provide warnings if any of the components, attributes or project settings might cause an issue upon import into Flash Catalyst—you can then resolve those issues or re-factor parts of the project into a Library before exporting the project for a designer.
Flash Catalyst enables designers to use the convert artwork to component skins workflow (introduced in the previous release) with custom skinnable components defined by the developer. In Flash Builder we’ve provided a convenient wizard to help you generate the required ActionScript classes in which you can specify the skin states, skin parts, and the component business logic.
For developers who are comfortable with both making code and design changes, we've also added a launch-and-edit workflow in Flash Builder. With both products installed, you can select a project in Flash Builder, select "Edit in Flash Catalyst", make the required design changes in Flash Catalyst and then return to Flash Builder to continue working on the updated version of the project. This speeds up the workflow and completely avoids the need to export and import FXP files.
There are a number of different approaches to using Flash Builder and Flash Catalyst together—for more information on designer-lead and developer-lead workflows, creating custom skinnable components and the restrictions that are in place for Flash Catalyst projects please see Jacob Surber's article on the Adobe Developer Connection site.
As part of this release, we’re now using the latest version of Eclipse (version 3.6.1 “Helios”) as the base for Flash Builder and hence all the improvements and bug fixes made in Eclipse are now visible to Flash Builder users. In addition, on Mac OS X we’ve updated Flash Builder to use the “Cocoa” version of Eclipse and are removing support for the older “Carbon” version.
Flash Builder also includes the latest support for Adobe technologies—including Adobe Flex SDK 4.5, Adobe AIR 2.6, and Flash Player 10.2. For non-mobile projects, Adobe Flex SDK 4.5 introduces Spark versions of the Form, Image and DataGrid components, all of which are supported in Flash Builder 4.5. For more information on Adobe Flex 4.5 SDK please read Deepa Subramaniam’s article on the Adobe Developer Connection site.
One area in which we have made improvements that may not be immediately obvious is in relation to the architecture of Flash Builder and the installer. There are no longer separate downloads for the standalone and plug-in versions (where you add Flash Builder to an existing Eclipse instance); instead, after installation of the standalone version, you use a small utility (found in the utilities directory) to configure Flash Builder to work with one or more existing versions of Eclipse.
In addition to updated platform support, we also spent a considerable amount of time examining large customer projects in Flash Builder to see where performance and memory usage can be improved. We identified three specific areas where significant improvements could be made - design view, refactoring and profiling. For the latter two areas, you will find that the time taken to complete operations has reduced by up to 65%, making it far more productive to work with projects that have a large number of source files or multiple dependent library projects. Design view has undergone a major overhaul in Flash Builder 4.5, reducing the time taken to switch from code to design view and making it robust enough to render complex projects.
There are a number of other features and minor enhancements that we’ve added to this release, based on customer feedback and feature requests we received through the Adobe Ideas site. Here are some of the improvements:
- You can define a “Spark only” project that does not have any of the MX components available for use.
- You can define an “ActionScript AIR” project.
- ActionScript and MXML files can be associated with Flash Builder, so as to support launch of these filetypes from the file system.
- Design view provides improved visual feedback when dragging and dropping components.
- You can choose to disable design view if it is not currently required for use on your project, so as to improve performance and reduce memory usage.
- For standalone preview and debugging (when not using a HTML wrapper) you can now define the Flash Player executable that you wish to use.
- You can use code templates to customize the code generated by Flash Builder
- You can specify trigger keys to invoke content assist and add keys used to accept auto-complete suggestions
- Files/file types can be excluded from the build output folder
- Developers can choose to use updated FlexUnit SWCs with Unit Testing features
- The profiler now reports retained heap, displays object properties and presents a tree view of object references
In addition to the great features and improvements already mentioned in this article, we’re also introducing a new version of Flash Builder aimed specifically at PHP developers. Flash Builder 4.5 for PHP is an integration of Flash Builder 4.5 and Zend Studio 8 that streamlines the development process for building web and mobile applications using Flex and PHP. The features include an integrated installer, new project wizards, improved connection to PHP services, and joint debugging workflows. For more information about this exciting new product, please read the article Introducing Flash Builder 4.5 for PHP.
For more information on the new features in Flash Builder 4.5, Flash Catalyst CS5.5, or Flex 4.5 SDK, check out the Adobe Developer Connection. You can also watch Serge Jespers's accompanying video to learn more about Flash Builder 4.5.
We hope that you're as excited as we are about this release—the entire product team looks forward to seeing what you build using Flash Builder.