Quick guide to moving existing Flex 3 projects to Flash Builder 4

If you’ve been reading about all the new features in Flash Builder 4, but are still working in Flex Builder 3 because you’re working on an existing project, then you might want to check out the article I’ve written for the Adobe Developer Centre.

The article explains how you can benefit from most of the new features in Flash Builder 4 whilst working on existing Flex 3 projects (and you don’t have to migrate the application to use the Flex 4 SDK if you don’t want to).

In the article I cover the following scenarios:

• I want the new Flash Builder 4 features, but can’t switch SDK versions
• I want the new Flash Builder 4 features and the faster Flex 4 compiler, but I need to maintain my application’s existing behaviour
• I want the new Flash Builder 4 features and all the new Flex 4 language features, but don’t want to adopt the new Spark component architecture
• I want the new Flash Builder 4 features, all the new Flex 4 language features and I want to add the Spark-based components to my existing application

Moving your Flex 3 project into Flash Builder 4 can be as simple as just importing it, optionally you can choose to undertake some migration to use Flex 4 SDK features if you have the time for your current project.

Remember that you can use the Adobe Forums for Flex 4 and Flash Builder 4 should you have any questions about moving or migrating your application.

Advertisement

What's new in Flash Builder 4? All of this…

If you haven’t had time to explore the previous public beta releases of Flash Builder 4, you might be wondering what’s new in Flash Builder 4 – even if you have, there are some new additions post beta 2 and maybe some features that you’ve missed.

Our product marketing team have done a great job at summarizing the new features here, but in case you want the detail on every new feature included this version of the product (and there are 70+ new features) I’ve listed them out below, together with links to documentation so that you can learn more.

Working with projects

Convert to server project – converts a non-server Flex project to a server project (using PHP, ColdFusion, BlazeDS, LCDS or .NET)

Convert to AIR project – converts a Flex project targeting Flash Player to an AIR project

Package explorer – provides a hierarchical view of the project, packages, classes, referenced libraries and other assets

Expand compiled assets – introspect classes within a referenced SWC library

HTML wrapper – wrapper code for Flex application uses SWFObject

MX-only workflow – take advantage of Flex 4 language features and compiler, without using the Spark component set

FXP export – save a Flex project as an FXP file

>> More information on working with projects can be found in the Flash Builder documentation.

Code editing

Updated content assist – code hinting/completion for all Flex 4 language features, classes and components

Generate getter/setter – replace an existing public variable definition with private variable and public getter and setter

Generate event handler – create an event handler function for an event on a component

Generate service call – generate a method for calling an operation for a defined service

File template support – edit default templates for MXML, ActionScript and CSS files

ASDoc content display – hover over code or use code hinting to display ASDoc information

ASDoc panel –select code to display information in ASDoc panel

States code visibility – de-emphasize code that is not applicable to the current state

Move refactoring – move multiple classes and packages within a project

Rename refactoring – rename classes and packages within a project

Indent code – correct indentation on selected code (with preferences to control indentation style)

Content assist proposal cycling – refine hints shown for code completion, select from: All, Properties, Events, Effects, Styles

Content assist camel case – type camel case characters to view matching properties (e.g. ADG for Advanced Data Grid)

View call hierarchy – display all the callers of a selected function, variable, class, or interface identifier

Organize imports – alphabetically sort import statements for required classes

Override indicators – icon in the gutter bar in code view indicates which methods are overridden

Indent on code paste – code pasted into an existing class or MXML document is automatically indented

Code folding – expand/collapse blocks of ActionScript code

>> More information on code editing features can be found in the Flash Builder documentation.

Profiler

Show N Paths to GCRoot – Expand a path to an instance of an object to view whether there is a back-reference to GC Root

>> More information on the profiler can be found in the Flash Builder documentation.

Debugger improvements

Expression evaluations – inspect and modify code expressions that are evaluated whenever debugging is selected

Run to line debug – command to break out of a loop during a debugging session

Conditional breakpoints – specify conditions for breakpoints to stop the debugger from executing when specific conditions are met

Watchpoints – halt execution when the watched variable changes value

>> More information on debugging can be found in the Flash Builder documentation.

Testing

Unit testing – generate and edit repeatable FlexUnit tests that can be run from scripts or directly within Flash Builder

Automation support for Spark components

Automation support for Adobe AIR applications

>> More information on unit testing can be found in the Flash Builder documentation.

>> More information on testing and automation can be found in the Flex 4 documentation.

Connect to data

Services explorer – view, edit and use service operations and data types

Services wizard – generate client-side data model and service operations for data services

Service generation from database – generate sample server-side CRUD code based on database tables

Service introspection – support for the following data services:

• XML (local)
• Web Services
• BlazeDS
• LCDS
• PHP
• ColdFusion
• HTTP

Network monitor – examine the data that flows between an application and a data service, as well as XML, AMF, and JSON data, which are sent using SOAP, AMF, HTTP, and HTTPS protocols

Service operation testing – call service operations, pass parameters and inspect returned data

Authentication for services – support for service operations that require authentication

Data management – generate code that enables synchronization of updates to data on the server from the client application

Data paging – generate code that supports incremental fetching of data from the server based on user interaction

Bind data to controls – drag and drop configuration of service operations to UI components in design view

>> More information on accessing data with Flex can be found in the Flash Builder documentation.

UI development

Theme selector – browse and apply graphical and CSS-based themes to a Flex application

Appearance panel – make changes to application-wide styles using the property inspector panel

Configure data grid columns – visually configure columns and column properties

Form generation – create user interface form layouts based upon a data model

Details form generation – create master/detail form layouts based upon a data model

Chart generation – create data-bound charting controls from service operations

Design view render graphics tags, spark skins – high-fidelity preview of user interface within design view, with full support for Flash Catalyst projects

Create/Edit component skin – generate template skins, copy existing skin or edit skin for a Spark component

Create/Edit Item renderer – generate template item renderer or edit item renderer for Spark-based components and MX tree, datagrid and advanced datagrid components

Layout control – adjust properties for Flex 4 layouts using the property inspector panel

>> More information on building a user interface can be found in the Flash Builder documentation.

Designer/developer workflow

FXP import – import existing Flex projects or projects from (the upcoming version of) Flash Catalyst into a new or existing Flex project

FXPL import into existing project – import component skin libraries from (the upcoming version of) Flash Catalyst

Fix Catalyst font embeds – fixes references to locally installed fonts that are not available in the same location

Flash Professional project support – create projects linked to an FLA, launch/test/publish in (the upcoming version of) Flash Professional from Flash Builder

Flash Professional component launch and edit – insert FLA-based component in design view and roundtrip with (the upcoming version of ) Flash Professional to edit/update

Theme import – import packaged theme assets for use with theme browser feature

>> More information on working with projects can be found in the Flash Builder documentation.

Deployment

Command line builds – synchronize individual build settings with a nightly build environment

>> More information on using command line builds can be found in the Flash Builder documentation.

Documentation

Community-based Help – find help content from both Adobe-authored documentation and community resources. Comment upon and rate content within the help client.

Updated documentation – Flash Builder 4 & Flex 4 books
New documentation – Accessing data with Flex 4 book and Flex migration guide
New online materials – TestDrive and Flex 4 in a Week

Phew… as I think you’ll agree, that’s quite a list 🙂

If you haven’t yet tried out Flash Builder 4, you can download a 60 day trial version from here.

Flex 4 SDK and Flash Builder 4 final releases are here…

On behalf of everyone on the Flex and Flash Builder product teams, it is with great pride that we can announce that the final versions of Flex 4 SDK and Flash Builder 4 are available for download today!

We’ve been working hard on these releases to make the Flash Platform the best RIA development platform ever and one that you can confidently bet on when you are asked to create your next generation applications.

In the Flex 4 SDK, we’ve implemented a completely new component and skinning architecture (Spark) that supports a level of expressiveness in RIAs not seen previously. With the new Spark component and skinning architecture, component logic is “divorced” from component visuals such that customizing either the behavior or look and feel of the component is much more straightforward. Additionally in the Flex 4 SDK, we have improved the Flex compiler performance, enhanced numerous language and infrastructure features and provided first-class support for the new runtime capabilities in Flash Player 10.

In Flash Builder 4, the team has made it easier than ever to connect to back-end services with a complete set of data centric development features, enabled new design and development workflows with Flash Catalyst and Flash Professional, as well as enhancing the core code development features that are essential to developer productivity.

In this area alone, we’ve implemented new refactoring options, improved the debugger to support conditional breakpoints, watchpoints and expression evaluation, added code generation features and made it easier to test applications with the new network monitor and FlexUnit support. It’s worth remembering that most of these improvements are available to developers building applications that use either the Flex 3 or Flex 4 SDK, so Flash Builder 4 will help in your overall development even if you aren’t yet ready to use the new Spark components.

As you can see, there are lots of great new features and enhancements in Flex 4 and Flash Builder 4 – too many, in fact to list here. We recommend that you read the “What’s New in Flash Builder 4?”, “What’s New in Flex 4?”, and “Introduction to Spark” articles, as well as check out the rest of the new content published on the Adobe Developer Connection site to learn more. Additionally, you can watch David Wadhwani, Vice President and General Manager of the Flash Platform Business Unit describe the new set of products being added to the Flex product family.

If you’re just getting started with Flex then we hope that the new TestDrive content will get you up-to-speed on Flex and Flash Builder in just a couple of hours. If you have a little more time then you should review the Flex in a Week video training materials, which have been completely revised for Flex 4. There are plenty of other resources you can draw upon as you work with Flex and Flash Builder, including the new community-based in-product Help, Tour de Flex, the Flex Cookbooks and a completely re-vamped Flex.org site.

As excited as we are to ship these new products, we are already getting started on the next versions – if you have a feature idea that you’d like the product team to consider then we’d love to hear from you! You can now submit your feature ideas on the Adobe Labs Ideas website, as well as review existing ideas and vote on the ones you’d like to see us work on.

We couldn’t have delivered the new features in these products without the feedback received from everyone who participated in our public beta process or our pre-release programs. Thank you so much for helping us to create an amazing release! For those that did install a beta release of Flash Builder, be sure to uninstall the beta before installing the final release, otherwise you may find that your trial period has expired.

We think you will agree that these products will allow you to develop truly compelling user experiences that exceed your clients’ expectations. The entire team is excited to see what you build with Flex 4 and Flash Builder 4 over the coming months and we look forward to receiving your feedback on these releases in the Adobe Forums.

Andrew Shorten & Deepa Subramaniam,
Flash Builder and Flex SDK Product Managers

Please complete the Flex survey!

Further to my earlier post about shaping the future of Flash Builder by submitting feature requests, another way which you can help us is by completing our online Flex survey.

Answers to the survey questions will help us determine the future product roadmap for the Flex SDK, Flash Builder and Flash Catalyst – by completing the survey you’ll get some idea as to the areas we’re thinking of exploring and you’ll have the opportunity to help prioritize what we work on.

The Flex product management team will be taking the results from the survey very seriously and I’d please ask that you spare 15-20 minutes to complete it for us.

Thanks for your help!

Note: for those living outside North America, I can only share your frustration that the sweepstake prizes are not available to you and I hope that we might be able to resolve that issue for a future survey.

Help shape future versions of Flash Builder

There are a number of different sources of information that we use when planning future versions of our tools, including, but not limited to, feedback gathered via pre-release programs, customer surveys, sync-dev meetings, product forums and in-person discussions at conferences, etc.

For Flash Builder, we also actively request that developers log bugs and feature requests using JIRA, which is hosted at bugs.adobe.com. We review all the feature enhancements that are logged and pay particular attention to those requests that have community support, by way of the number of votes received.

The current top 10 feature requests are listed below, with the full list visible here (note: you will need to login or create an account first as anonymous browsing is currently disabled).

If you have already logged a feature request or voted then thank you! If you haven’t and can spare half an hour, now would be a great time to review the list of requested features, vote for your favourites and add features that you’d like to see in Flash Builder.

Whilst we can’t guarantee to implement every feature request in the next version of the product, we do take the feedback you give us very seriously and it is all used to help shape the future direction of Flash Builder.

If you haven’t used bugs.adobe.com before then you’ll find a quick guide to getting started here.

Updated build of Flex Builder for Linux available

The current alpha release of Flex Builder for Linux is due to expire on December 1st 2009, so if you are developing with this you’ll need to download the updated build (alpha 5) that we posted to the Adobe Labs website today.

The updated build of Flex Builder for Linux does not add new functionality, but does extend the timeout and has also been tested on more recent Linux distributions.

If you have any comments or suggestions on Flex Builder for Linux then please drop me an email and I’ll make sure we consider them as we continue to work on our plans for Linux support.

Want to join the Platform Evangelism team?

Following my post yesterday about my new role as a Product Manager for Flash Builder, my departure from the Platform Evangelism team opens up an opportunity for us to hire a new evangelist.

Whilst we’re not yet listing the opportunity on our jobs website, we’re definitely interested in hearing from you if you’d like to join the Platform Evangelism team in Europe.

This is a senior role within Adobe, which will involve being based in the UK, with a significant amount of travel in Europe and also further afield. You’ll interact with designers, developers, press, analysts and customers on a daily basis, will need to be a confident presenter and most likely someone who enjoys developing applications with Flex, ActionScript, Flash Professional, Flash Builder, Flash Catalyst and Adobe AIR. This is a unique opportunity in which no two days are the same and where you get to decide the impact you’ll make…

If this sounds interesting, then send an email providing a brief background on your experience to Enrique Duvos, Group Manager EMEA Platform Evangelism team (email duvos at Adobe.com).

New role at Adobe

Over the last couple of years I’ve had the pleasure of being part of the Platform Evangelism team at Adobe – a smart, diverse and unique group of people who care passionately about Flash and who genuinely like helping others learn about new technology.

A big part of that role has been spending time out on the road talking about the Flash Platform and showing how to use Flex, Flash Catalyst and Flash Builder to create rich Internet applications. An equally important part of being an evangelist is listening to feedback, suggestions and constructive criticism from designers, developers, technical architects, press & analysts and channeling that information back into the product teams so that we can fix bugs, add new features and improve workflow between tools.

I’m hoping to use some of that experience, gained from talking with many of you, in my new role at Adobe, as Senior Product Manager for Flash Builder.

I’m really excited about taking on this new position – there are lots of great additions in the upcoming version of Flash Builder 4 (currently in beta), including the data centric development tools, the network monitor, support for Flash Catalyst projects and enhancements to core code editing, refactoring and debugging features. But there is a whole lot more that we can do to enhance developer productivity, enable a more fluid design/develop workflow and, with the availability of Flash Player on smart phones and the upcoming mobile version of the Flex framework, to support multi-screen application development.

Whilst the engineering team continues working hard on completing Flash Builder 4 for a release in the first half of 2010, I’ll be joining with more of a view on future versions of Flash Builder and be part of the team planning out what’s important to developers building applications on the Flash Platform.

If you are interested in some of the directions that we’re thinking about and didn’t attend MAX, I’d encourage you to watch the Flash Platform Tooling & Framework Roadmap presentation on Adobe TV.

I’ll be relocating to San Francisco with my family in the New Year and am looking forward to the many new experiences that will come from living in California. I will of course miss being in Europe (although maybe not the winter weather so much), working with all my friends on the European evangelism, PR and marketing teams and being close to the many people I’ve met at conferences, user group meetings, Flash Camps and other local events. I do hope however that I’ll be back during the year to support some of the European events/conferences and to get feedback on our plans for future versions of Flash Builder.

I’m going to do my best to continue blogging here, I’ll continue to be on Twitter and more than ever I welcome your comments and thoughts on how you’d like to see us develop Flash Builder.

Cheers,

Andrew

Adobe MAX session: Flash Catalyst and Builder workflows

At Adobe MAX this week, I presented a session entitled “Working with Flash Catalyst Projects in Flash Builder 4” – the recording for this is now available for playback on Adobe TV and I’ve posted the slides below.

[kml_flashembed publishmethod=”static” fversion=”8.0.0″ movie=”https://share.acrobat.com/adc/flex/mpt.swf” width=”450″ height=”370″ targetclass=”flashmovie” fvars=”ext=pdf&docId=8079c2b7-eccd-4ae1-a97b-bded8f49732f&lang=en_US”]

[/kml_flashembed]

The presentation builds on the Exploring Flash Catalyst and Flash Builder workflows article that was published on the Adobe Developer Connection site, but also includes some example code which may help if you wish to explore the use of Flash Catalyst generated skins for custom Flex components that extend SkinnableComponent.

New resources for Flash Catalyst and Builder beta 2

Today we released the beta 2 versions of both Flash Catalyst and Flash Builder on Adobe Labs – if you looked at either of these products at beta 1 but felt they were a bit early for regular usage then I’d encourage you try out these news builds.

With lots of bug fixes and performance improvements in both products, I’m now using these as my regular toolset for RIA design/development – Flash Catalyst in particular has added a significant number of new features over beta 1, including the ability to work with audio/video assets, as well as import and control Flash SWFs that were created in Flash Professional.

I’d like to highlight two updated developer centre articles that I’ve written and also point out a brand new one discussing workflows between Flash Catalyst and Flash Builder:

• Building a data-centric application using Flash Catalyst and Flash Builder 4 (updated for beta 2)
  Learn to create an employee directory application, starting from the Illustrator design, working in Flash Catalyst to create the user interface and moving into Flash Builder to connect to a PHP or ColdFusion back-end.
• Flash Catalyst Best Practices (updated for beta 2)
  A set of hints and tips for designers using Illustrator and Flash Catalyst that will help ensure that projects created in Flash Catalyst will be optimized for use by the development team you’re working with.
• Exploring Flash Catalyst and Flash Builder workflows
  Understand the different workflows that are possible between Flash Catalyst and Flash Builder and learn which is most appropriate for your team and the projects you’re working on.

If you have any comments/feedback on the articles then please do get in touch.