Accessibility
Tim Buntel

Tim Buntel

Adobe

Created:
8 September 2009
User Level:
All
Products:
Flex

Integrating Flash Builder 4 beta with other Adobe products

Note: This article was created based on Flash Builder 4 beta 1. Minor changes in the description and code may be necessary before it can be applied to beta 2.

In previous articles, I have written about data-centric development and some of the other great new features in Adobe Flash Builder 4 beta. But it’s rare that a developer uses a single tool for every project. More often, you use a combination of tools, so it’s important that they work well together. You want tools that have helpful workflows built in, features that help bridge the gap between your application’s tiers, and capabilities that make it easy for you to work with other designers and developers across your organization. In this article, I’ll briefly introduce you to how Flash Builder 4 beta meets these needs in both data-centric and design-centric projects with four other great Adobe products: Adobe ColdFusion Builder beta, Adobe LiveCycle Data Services 3 beta, Adobe Flash CS4 Professional, and Adobe Flash Catalyst beta.

Requirements

In order to make the most of this article, you need the following software and files:

Flash Builder 4 beta

Prerequisite knowledge

Previous experience with Adobe products is helpful but not necessary.

Flash Builder and ColdFusion Builder

There’s no better server-side technology for Flex applications than ColdFusion. Really. Let me say that again; if you’re building a Flex app that needs to do something on the server (and most Flex applications do), then you won’t find a faster, easier, or more powerful server-side technology than ColdFusion. And now, with the introduction of the ColdFusion Builder beta, there is finally a new tool just for ColdFusion development. With the close connection between ColdFusion and Flex technologies, we’ve worked hard to make sure that there’s a close connection between the tools as well.

First, Flash Builder beta and ColdFusion Builder beta can both be installed together into a single Eclipse instance. This allows you to seamlessly switch between Flex and ColdFusion editing perspectives. You can be working on a Flex project and have your ColdFusion data sources visible at the same time; you can view the Flash Builder 4 beta network monitor and the ColdFusion log viewer at the same time; and so on, all from one environment.

More importantly, the tools work together to help you build applications quickly. My favorite feature in this category is the ORM code generator in ColdFusion Builder beta. You can browse to any ColdFusion data source with the RDS dataview, select a table, and right-click to reveal the ORM Code Generator option. This one command will automatically generate the ColdFusion components (CFCs) for a complete data service. Then, simply return to a Flex project and choose Connect To ColdFusion from the Data menu. The generated CFC will create a service with strongly typed data, paging, and data management already enabled—you don’t have to write a single line of code. There is also a code generator that will make non-ORM components for those of you who are not yet using ColdFusion 9 beta. In fact, the code generator feature is part of a larger feature for adding capabilities to ColdFusion Builder beta with extensions written in CFML. There is already a ColdFusion Builder Extensions category on RIAForge where these extensions can be shared.

Flash Builder and LiveCycle Data Services 3 beta

Adobe LiveCycle Data Services 3 beta introduces a data modeling language and platform code named Fiber. To make it easy for developers to use Fiber, the LiveCycle team has created a text-based and graphical modeling editor, which can be installed as a plug-in to Flash Builder 4 beta. With this Modeler, the LiveCycle Data Services server, and Flash Builder 4 beta, you can automatically generate the server-side code (Data Management Service destinations) and Flex client code from a common data model (see Figure 1).

The Fiber Modeler uses a service called RDS (which stands for Remote Development Services) to work with server destinations or SQL databases from within Flash Builder 4 beta. ColdFusion developers will recognize RDS as the remote development solution for ColdFusion for many years. The Modeler uses RDS to introspect JDBC data sources to build a data model. Once you have connected via RDS to a database, you can drag and drop tables in the Adobe Data Model perspective to add entities to the model. If you don’t already have tables in a database, the Modeler can automatically create them. Once the model is complete, switch back to the Flash perspective and you will see that a service has already been created in the Data/Services panel. The service will have all of the common database operations (for creating, reading, updating, and deleting records) and datatypes based on your model. There is no need for you to introspect a separate server-side component and configure its return type; both the server-side and client-side code is handled for you by the Modeler. You can then bind the results of the operations to Flex UI components just like you would for other service types (PHP, ColdFusion, Web Services, and so on). There are additional benefits to using the Live Cycle Data Services 3 Fiber model, including computed properties, custom business logic, and validation rules, among others.

Fiber Model

Figure 1. Fiber Model

The Fiber model approach is a simple and fast way to build complex data-centric Flex applications in Flash Builder 4 beta. To learn more, see the LiveCycle Data Services 3 Getting Started Guide.

Flash Builder and Flash CS4 Professional

Many designers and developers use both Flash Builder 4 beta and Adobe Flash CS4 Professional to create applications, so we added a number of features to Flash Builder 4 beta to improve the experience of creating and editing Flash components. In the Components panel of Design view, you will see options to add a New Flash Component and a New Flash Container. You can drag either onto the design surface, resize it, and position it. Then, either double-click it or select Create in Adobe Flash from the Property inspector to launch Flash CS4 and create the content. When you’re finished, click Done in Flash CS4 to return to Flex Builder 4 beta. All of the plumbing (as well as the file and library linking) is handled for you automatically. You can also invoke Flash CS4 to edit previously created Flash components. This functionality replaces the Flex Component Kit for Flash, and enables a much smoother workflow between Flash Builder and Flash CS4.

Flash Builder and Flash Catalyst

Flash Builder 4 beta also supports workflows with the new professional interaction design tool, Adobe Flash Catalyst. Flash Catalyst beta allows you to transform artwork created in Adobe Photoshop and Adobe Illustrator into functional user interfaces without coding. Flash Catalyst projects can then be opened in Flash Builder to add more functionality and integrate with servers and services.

Flash Builder 4 beta and Flash Catalyst both use a project archive format (files with the .fxp extension) to facilitate the workflow between them. An FXP file can contain a single project or multiple projects. Exporting projects from Flash Builder 4 beta to be later imported by Flash Catalyst is not currently supported.

Where to go from here

Since it’s built on Eclipse, Flash Builder 4 beta can also be used with thousands of other plug-ins in addition to these great Adobe products to support your workflows and projects. You can find plug-ins to support team development, database management, code management, testing, and more. Combine your favorite Eclipse plug-ins with Flash Builder 4 beta, and can create your own perfect RIA IDE.

If you have not already done so, take some time to check out the content that we’ve created to support the beta:

Creative Commons License
This work is licensed under a Creative Commons Attribution-Noncommercial 3.0 Unported License.

About the author

Tim Buntel is the Senior Product Manager for Flash Builder (formerly Flex Builder). Prior to joining the Flex team in 2007, he served for many years as the Senior Product Manager for Adobe ColdFusion.