30
Updates, source code, and Wrox technical support at www.wrox.com Professional Adobe ® Flex ® 3 Joseph Balderson, Peter Ent, Jun Heider, Todd Prekaski, Tom Sugden, Andrew Trice, David Hassoun, Joe Berkovitz With Foreword by Steven Webster Wrox Programmer to Programmer TM

Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

  • Upload
    others

  • View
    7

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

ProfessionalAdobe®

Flex® 3

www.wrox.com

$49.99 USA$59.99 CAN

Wrox Professional guides are planned and written by working programmers to meet the real-world needs of programmers, developers, and IT professionals. Focused and relevant, they address the issues technology professionals face every day. They provide examples, practical solutions, and expert education in new technologies, all designed to help programmers do a better job.

ISBN: 978-0-470-22364-2

In recent years, Flex has become the leader in rich Internet application (RIA) development technologies based on the Flash platform, and excitement continues to build around the potential of what Flex 3 has to offer. This comprehensive, in-depth resource provides you with the foundations of Flex 3 and shows how you can maximize your use of Flex 3 to create unique experiences on the Internet and the desktop.

The team of authors distinguishes the relationships between various aspects of Flex 3 and the Flash platform, while also offering extensive coverage of client-side Flex applications development and development best practices. They explain what Flex® Builder™ can do, how to develop simple Flex 3 applications, and ways to use the Flex 3 framework classes and components. You’ll also take a look at more advanced topics such as data integration, architectural frameworks, and advanced tools.

Packed with detailed examples throughout, this authoritative guide will get you up and running with Flex 3 quickly, regardless of your level of Flex experience.

What you will learn from this book● Techniques for skinning and styling Flex 3 components● Ways to integrate Flash-built assets into Flex 3 applications● Various components in the Flex 3 framework that manipulate

or display data in the application● The Cairngorm micro-architecture framework ● Best practices for building efficient, high-performance Flex 3

applications● Components of the Flex 3 toolset, including the debugger,

profiler, unit testing framework, logging framework, and automation framework

● Ways to migrate to Flex from other languages

Who this book is forThis book is for programmers and developers who are looking to leverage the Flex 3 platform to create RIAs. Experience with Flash, ActionScript, and an XML-based language is assumed.

Computers / Internet

Web Site Development / Flash, Flex, ActionScript

Recommended Computer Book

CategoriesA

dobe®

Flex® 3

Balderson, Ent, Heider, Prekaski, Sugden, Trice,

Hassoun, Berkovitz

Professional

spine=1.984"

Updates, source code, and Wrox technical support at www.wrox.com

ProfessionalAdobe®

Flex® 3Joseph Balderson, Peter Ent, Jun Heider, Todd Prekaski, Tom Sugden, Andrew Trice, David Hassoun, Joe BerkovitzWith Foreword by Steven Webster

Wrox Programmer to Programmer TMWrox Programmer to Programmer TM

Page 2: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

23642ffirs.indd 4 5/4/09 12:57:35 PM

Page 3: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Professional Adobe Flex 3

Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . lv

Part I: Introduction to Flex 3 1

Why Flex?Chapter 1: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3The Flex 3 EcosystemChapter 2: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17ActionScript 3 .0 FundamentalsChapter 3: . . . . . . . . . . . . . . . . . . . . . . . . . . 41Using ActionScript 3 .0Chapter 4: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67Introduction to Flex Builder 3Chapter 5: . . . . . . . . . . . . . . . . . . . . . . . . . . . 85

Part II: Developing with Flex 3 101

Using Flex Builder 3Chapter 6: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103MXML FundamentalsChapter 7: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127Developing with Flex Builder 3Chapter 8: . . . . . . . . . . . . . . . . . . . . . . . . . 149Customizing Flex Builder 3Chapter 9: . . . . . . . . . . . . . . . . . . . . . . . . . . . . 179

Part III: Working with Components 215

The Component Life Cycle and Class HierarchyChapter 10: . . . . . . . . . . . . 217Using Data Binding and EventsChapter 11: . . . . . . . . . . . . . . . . . . . . . . . . 231User Interface Controls and ContainersChapter 12: . . . . . . . . . . . . . . . . . . 245Layout StrategiesChapter 13: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271User Interface IntegrationChapter 14: . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281Getting Started with AIRChapter 15: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 299

Part IV: Advanced Component Development 317

Custom ActionScript ComponentsChapter 16: . . . . . . . . . . . . . . . . . . . . . . 319Custom MXML ComponentsChapter 17: . . . . . . . . . . . . . . . . . . . . . . . . . . 343Extending Flex ComponentsChapter 18: . . . . . . . . . . . . . . . . . . . . . . . . . . 353Advanced Event ProgrammingChapter 19: . . . . . . . . . . . . . . . . . . . . . . . . . 369State ManagementChapter 20: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 383Using LibrariesChapter 21: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 397

Part V: Visual Effects and Multimedia 409

StylesChapter 22: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 411Skinning and ThemesChapter 23: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 423

Continues

23642ffirs.indd 1 5/4/09 12:57:34 PM

Page 4: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Visual EffectsChapter 24: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 437Dynamic Skinning and the Drawing APIChapter 25: . . . . . . . . . . . . . . . . . . 461Flash IntegrationChapter 26: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 481Loading External AssetsChapter 27: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 503Video and SoundChapter 28: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 513Advanced Flash IntegrationChapter 29: . . . . . . . . . . . . . . . . . . . . . . . . . . . 545

Part VI: Data Management 569

Working with DataChapter 30: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571Formatters and ValidatorsChapter 31: . . . . . . . . . . . . . . . . . . . . . . . . . . . . 595Using the List ComponentsChapter 32: . . . . . . . . . . . . . . . . . . . . . . . . . . . 613Advanced Data ControlsChapter 33: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 623Drag and Drop in FlexChapter 34: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 647Drag and Drop in AIRChapter 35: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 657Using the Charting ComponentsChapter 36: . . . . . . . . . . . . . . . . . . . . . . . 671Resource Bundles and Data LocalizationChapter 37: . . . . . . . . . . . . . . . . . 689

Part VII: Client Communications 701

Browser Communication in FlexChapter 38: . . . . . . . . . . . . . . . . . . . . . . . 703HTML Mashups with AIRChapter 39: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 721Deep LinkingChapter 40: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 731System Interactions in FlexChapter 41: . . . . . . . . . . . . . . . . . . . . . . . . . . . 751Native Desktop Support with AIRChapter 42: . . . . . . . . . . . . . . . . . . . . . . 767LocalConnection and Shared ObjectsChapter 43: . . . . . . . . . . . . . . . . . . . . 789File Management with FlexChapter 44: . . . . . . . . . . . . . . . . . . . . . . . . . . . 803Local File Management with AIRChapter 45: . . . . . . . . . . . . . . . . . . . . . . . 813

Part VIII: Server Integration 833

Introduction to RPC ServicesChapter 46: . . . . . . . . . . . . . . . . . . . . . . . . . 835Error Handling Chapter 47: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 853Flex and Flash Media ServerChapter 48: . . . . . . . . . . . . . . . . . . . . . . . . . . 865RESTful Web Services with Flex and the Zend FrameworkChapter 49: . . . . 881Integrating Flex and JavaChapter 50: . . . . . . . . . . . . . . . . . . . . . . . . . . . . 899Web Services with .NET and FlexChapter 51: . . . . . . . . . . . . . . . . . . . . . . . 915Offline Data Access with AIRChapter 52: . . . . . . . . . . . . . . . . . . . . . . . . . 929

Continues

23642ffirs.indd 2 5/4/09 12:57:35 PM

Page 5: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Part IX: Data Services 951

Introduction to LCDSChapter 53: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 953LCDS and ColdFusionChapter 54: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 971The Message ServiceChapter 55: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 979The Data Management ServiceChapter 56: . . . . . . . . . . . . . . . . . . . . . . . 1005Advanced Data Management ServicesChapter 57: . . . . . . . . . . . . . . . . . . 1029The Data Services Stress Testing FrameworkChapter 58: . . . . . . . . . . . . . 1039Using BlazeDSChapter 59: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1053

Part X: Using Cairngorm 1073

MVC FrameworksChapter 60: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1075Introduction to CairngormChapter 61: . . . . . . . . . . . . . . . . . . . . . . . . . . . 1083Applied CairngormChapter 62: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1095Advanced CairngormChapter 63: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1119

Part XI: Application Development Strategies 1139

Best PracticesChapter 64: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1141The Security ModelChapter 65: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1161Modular Application DevelopmentChapter 66: . . . . . . . . . . . . . . . . . . . . . 1171Application Performance StrategiesChapter 67: . . . . . . . . . . . . . . . . . . . . 1189Project Documenting with ASDocChapter 68: . . . . . . . . . . . . . . . . . . . . . 1203Desktop Deployment with AIRChapter 69: . . . . . . . . . . . . . . . . . . . . . . . . 1215Dual Deployment for Flex and AIRChapter 70: . . . . . . . . . . . . . . . . . . . . . 1229

Part XII: Testing and Debugging 1243

Debugging Flex ApplicationsChapter 71: . . . . . . . . . . . . . . . . . . . . . . . . . 1245Using the Flex ProfilerChapter 72: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1267Unit Testing and Test-Driven Development with FlexUnitChapter 73: . . . . . 1303The Logging FrameworkChapter 74: . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1327The Automation FrameworkChapter 75: . . . . . . . . . . . . . . . . . . . . . . . . . . 1343ActionScript Language Comparison Appendix A: . . . . . . . . . . . . . . . . . . . 1355

Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1365

23642ffirs.indd 3 5/4/09 12:57:35 PM

Page 6: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

23642ffirs.indd 4 5/4/09 12:57:35 PM

Page 7: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Professional

Adobe® Flex® 3

23642ffirs.indd 5 5/4/09 12:57:35 PM

Page 8: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

23642ffirs.indd 6 5/4/09 12:57:35 PM

Page 9: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Professional

Adobe® Flex® 3

Joseph Balderson Peter Ent

Jun Heider Todd Prekaski Tom Sugden

Andrew Trice David Hassoun

Joe Berkovitz

23642ffirs.indd 7 5/4/09 12:57:35 PM

Page 10: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Professional Adobe® Flex® 3Published by Wiley Publishing, Inc. 10475 Crosspoint Boulevard Indianapolis, IN 46256 www.wiley.com

Copyright © 2009 by Wiley Publishing, Inc., Indianapolis, Indiana

Published simultaneously in Canada

ISBN: 978-0-470-22364-2

Manufactured in the United States of America

10 9 8 7 6 5 4 3 2 1

Library of Congress Cataloging-in-Publication Data is available from the publisher.

No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or by any means, electronic, mechanical, photocopying, recording, scanning or otherwise, except as per-mitted under Sections 107 or 108 of the 1976 United States Copyright Act, without either the prior written permission of the Publisher, or authorization through payment of the appropriate per-copy fee to the Copyright Clearance Center, 222 Rosewood Drive, Danvers, MA 01923, (978) 750-8400, fax (978) 646-8600. Requests to the Publisher for permission should be addressed to the Permissions Department, John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030, (201) 748-6011, fax (201) 748-6008, or online at http://www.wiley.com/go/permissions.

Limit of Liability/Disclaimer of Warranty: The publisher and the author make no representations or war-ranties with respect to the accuracy or completeness of the contents of this work and specifically disclaim all warranties, including without limitation warranties of fitness for a particular purpose. No warranty may be created or extended by sales or promotional materials. The advice and strategies contained herein may not be suitable for every situation. This work is sold with the understanding that the publisher is not engaged in rendering legal, accounting, or other professional services. If professional assistance is required, the services of a competent professional person should be sought. Neither the publisher nor the author shall be liable for damages arising herefrom. The fact that an organization or Web site is referred to in this work as a citation and/or a potential source of further information does not mean that the author or the publisher endorses the information the organization or Web site may provide or recommendations it may make. Further, readers should be aware that Internet Web sites listed in this work may have changed or disap-peared between when this work was written and when it is read.

For general information on our other products and services please contact our Customer Care Department within the United States at (877) 762-2974, outside the United States at (317) 572-3993 or fax (317) 572-4002.

Trademarks: Wiley, the Wiley logo, Wrox, the Wrox logo, Wrox Programmer to Programmer, and related trade dress are trademarks or registered trademarks of John Wiley & Sons, Inc. and/or its affiliates, in the United States and other countries, and may not be used without written permission. Adobe and Flex are registered trademarks of Adobe Systems Incorporated. All other trademarks are the property of their respec-tive owners. Wiley Publishing, Inc., is not associated with any product or vendor mentioned in this book.

Wiley also publishes its books in a variety of electronic formats. Some content that appears in print may not be available in electronic books.

23642ffirs.indd 8 5/4/09 12:57:35 PM

Page 11: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

To my love, my light, my precious wife Joanne. And to my Grade 13 English teacher, Mr. Barrs,

who always said I’d be a published author someday. :)

— Joseph Balderson

I could not, and would not, have done this without the support of my partner, Joseph.

Thanks for listening to me and encouraging me to press on.

— Peter Ent

I would like to dedicate my portion of this book and give immense love and thanks to my son Kobi,

daughter Mia, father Robert, aunt Kathryn, sisters Lisa, Hiromi, and Mayumi, and mother Masako,

and most of all my wife Michelle. Without their love, support, and encouragement throughout

the writing process, I would not have had the energy and time to complete my chapters.

— Jun Heider

This book is dedicated to all the technology geeks out there who shunned social activity in college

in order to dedicate themselves to the higher art of software engineering.

— Todd Prekaski

Dedicated to my dear wife, Romola, and our delightful, mischievous children, Minna and Lorimer.

— Tom Sugden

To my wife Marta, for her unconditional love and support.

— Andrew Trice

For my friends and family; you know who you are and I hope you know how much you all mean to me.

— David Hassoun

To my wife, Max.

— Joe Berkovitz

23642ffirs.indd 9 5/4/09 12:57:35 PM

Page 12: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

23642ffirs.indd 10 5/4/09 12:57:35 PM

Page 13: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

About the AuthorsJoseph Balderson has been fascinated by computers and programming since picking up LEGOs and disassembling nearly every appliance he could find as a child, progressing on to electronics, microcon-trollers, and robotics as a teen. This interest took a detour in his college years, when he attended art school and studied poetry, philosophy, and graphic design. When he discovered Flash 4 in 1999, Joseph found his true vocation, one that would allow him to combine his passions for art and science, design, and programming under one roof.

That passion has led Joseph through an evolution of roles throughout his career, from graphic designer to web designer, to Flash designer, to Flash developer, and finally, today, as a Flex and ActionScript devel-oper. Joseph has held various positions throughout this time, from a jack-of-all-trades for a dot-com in the early days of the Web to a bank employee, Flash freelancer, and hired temp.

Joseph’s interests in communication and writing also led him to a position as staff writer and authoring partner at Community MX in 2005, writing biweekly tutorials on Flash and Flex technologies to this day. Joseph also served as Professor of Multimedia Studies at Humber College in 2005–2006, teaching Flash and ActionScript. After a stint as an Adobe-certified corporate instructor in 2006–2007, Joseph resumed his freelance career to focus on consulting and writing. He has since participated as contribu-tor and technical editor on a number of book projects, and has been involved in the construction of Flex and AIR rich Internet applications for a number of startups and consulting agencies.

Joseph is now a freelance Flex and Flash platform developer living in central Ontario, Canada, in the Georgian Bay area. He spends most of his time in his home studio dreaming up ways of making cool stuff with Adobe technologies. Joseph’s work and blog can be viewed at http://www.joeflash.ca.

Peter Ent is a Computer Scientist at Adobe, working with the LiveCycle team. Prior to this, Peter worked for Adobe Customer Care as a Flex support engineer and then as a technical account manager. Before joining Adobe, Peter worked in the financial services industry at State Street and Fidelity Investments. He also has experience at two startups, building software applications doing imaging and molecular modeling. Peter holds a BS in Computer Science from Syracuse University.

Jun Heider is a senior developer and technical trainer with RealEyes Media, an Adobe partner com-pany based in Denver, Colorado, with a focus in rich Internet applications. Jun graduated from Regis University with a BS in Computer Networking and has a number of technical certifications.

Jun has worked with ColdFusion since 4.5, Flex since Flex 2 beta, and AIR since it was first available in prerelease. Projects that Jun has worked on have ranged from a large clustered ColdFusion application for a global home-based business organization to internal Flex-based business applications for compa-nies such as Chase Manhattan to large-scale Flex-based online businesses such as Beatport.com, and also AIR-based utility applications such as the Beatport downloader.

In addition to development and training, Jun loves to speak at conferences such as those on Adobe MAX, 360|Flex, and Flexmaniacs. Jun also loves to write; he is an active blogger on O’Reilly Inside RIA and has written articles for the Fusion Authority and Flex Authority.

In his free time, Jun loves to sing for his band Bucket, play his Xbox 360, snowboard, and hang out with his son, Kobi, daughter, Mia, and wife, Michelle, in colorful Colorado.

23642ffirs.indd 11 5/4/09 12:57:35 PM

Page 14: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Todd Prekaski has been building software since 1993 (not including his youthful days programming an Apple IIc and TRS-80). He’s been leading application development and strategy for Web-based startups and Fortune 100/500 enterprises ever since, using a panoply of technologies and platform, including Java, .NET, and LAMP. Todd is currently the chief technical architect at Beacon Street Software, based in Boston, Massachusetts. Occasionally, his thoughts show up in his blog at www.simplifiedchaos.com.

When he’s not in front of a computer, Todd can be found racing his bicycles around New England, especially in early winter during cyclocross season.

Tom Sugden is a technical architect for Adobe Professional Services. His interest in computers began in the 1980s, programming sport simulators and beep-music on the ZX Spectrum 48k. When the key-board broke from too much Dailey Thompson, Tom upgraded to the Commodore Amiga and continued to create amateur games (but with multi-channel sound) in AMOS, before dabbling in the black art of Assembly language.

With these foundations laid, Tom studied Computer Science, picking up C++, Java, and Flash 3 along the way. After graduation, Tom freelanced for Domino Record Company, building its first website and encoding music videos. This led Tom to Realise, an early Scottish Internet café turned web company, where he wrote components for a search engine and document classifier known as Glowworm (later disastrously rebranded to KM-Bridge).

The bubble burst. No more Hoegaarden on school nights. Tom escaped to the safe haven of EPCC, a software consultancy and high-performance computing center within the University of Edinburgh. There he worked on various data integration projects, helping astronomers to analyze objects in space, linking biological and pharmaceutical databases, and correlating late bus arrivals with angry custom-ers. During this time, Tom became interested in design patterns and agile methods, and he began lec-turing on the Masters Course in High Performance Computing.

When the opportunity came to join Adobe, Tom saw a more commercial setting for the same kind of creative programming that he’d always loved. Flex and the Flash Player were evolving fast and the pos-sibilities seemed endless, as they had done years earlier on the Commodore Amiga. Tom joined Steven Webster’s crack team in Edinburgh, Scotland, where he learned Flex 2 and LiveCycle Data Services from the experts, and began delivering rich Internet applications for Adobe’s many enterprise customers.

Andrew Trice is the principal architect for Flex and AIR for Cynergy Systems, based in Washington, DC. He specializes in data visualization, client/server architectures, object-oriented principles, and rich application development. He has been developing for the Web for more than a decade, with more than eight years in development for the Flash platform. Andrew has developed with Flex since version 1.5, and thrives off the creativity and rich experience that the Flex/Flash platform enables. Andrew is also a reg-ular author for Adobe Devnet and other industry weblogs. He is known not only for Flex expertise but is also a Microsoft Certified Application Developer and possesses a wide range of knowledge regarding relational databases, AJAX/JavaScript, ColdFusion, .NET, and Java-based Web applications.

David Hassoun is the founder of RealEyes Media, LLC, a digital media firm based in Colorado that focuses on interactive motion media and advanced Flash and Flex platform applications. David has always had a passion for motion media, the power of video, and the challenges of usability and interac-tivity. David is an Adobe Certified Master Instructor, teaches advanced RIA classes at the University of Denver, serves as the Rocky Mountain Adobe user group manager, and has taught and developed advanced Flash and Flex application courses. As a consultant or while employed with other firms, he has worked for a wide range of companies such as American Express, Chase Manhattan, Qwest, Boeing,

23642ffirs.indd 12 5/4/09 12:57:35 PM

Page 15: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Macromedia, Adobe, the U.S. Air Force, Bechtel/Bettis, and many more. David regularly performs advanced code and technical best practices reviews, and has provided directional advice for interna-tional industry leaders over the past years — including many technical, courseware, and application reviews as an industry expert.

Joe Berkovitz is president of Noteflight LLC, maker of the world’s first online music notation editor, and is a senior software architect with consulting shop Infrared5. With almost three decades of designing and building world-class software, Joe brings creativity and discipline to his work in Flash and Flex. He is a frequent speaker at conferences and is the originator of the popular MVCS architecture for complex Flex applications. Joe has published several ambitious open-source projects, most recently the Moccasin graphical editing framework and Flexcover, a code coverage tool for AS3. Joe is an active pianist and composer, and performs frequently in the Boston area.

23642ffirs.indd 13 5/4/09 12:57:35 PM

Page 16: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

23642ffirs.indd 14 5/4/09 12:57:35 PM

Page 17: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Credits

Acquisitions EditorScott Meyers

Development EditorsJohn SleevaGus Miklos

Technical EditorsCampbell AndersonCharles BihisMatthew FabbGreg JastrabDouglas Knudsen

Production EditorRebecca Coleman

Copy EditorFoxxe Editorial Services

Editorial ManagerMary Beth Wakefield

Production ManagerTim Tate

Vice President and Executive Group PublisherRichard Swadley

Vice President and Executive PublisherBarry Pruett

Associate PublisherJim Minatel

Project Coordinator, CoverLynsey Stanford

CompositorJames D. Kramer, Happenstance Type-O-Rama

ProofreaderWord One New York

IndexerJ & J Indexing

23642ffirs.indd 15 5/4/09 12:57:35 PM

Page 18: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Acknowledgments

This book is made possible by all the hard work of my colleagues and coauthors, Andrew Trice, Peter Ent, Jun Heider, Todd Prekaski, Tom Sugden, David Hassoun, and Joe Berkovitz, who have slaved and poured their passion and their life into this text for over a year to create one helluva book. I want to thank you, dear sirs, for making this dream possible. It has been an incredible privilege to have shared this space with such truly talented and awesome people.

And a special thanks to all the tech editors who believed in this project enough to give up their week-ends just to help us authors keep true to the course. Thanks also goes out to Steve Webster at Adobe for writing the Foreword and believing in this book enough to lend us one of his brainiacs for the last fifth of this book, without which this project would not have been possible. And thanks to all the Adobe people I’ve spoken with who have encouraged me to write this book and have patiently answered my poignant and esoteric technical questions.

A big thank you goes to my agent David Fugate at LaunchBooks, who has put up with my incessant questions about the tech publishing industry and shepherded me through the process of finding this, one of the coolest of writing projects I have participated in to date. I’d also like to thank my esteemed colleague Tom Green for introducing me to David and mentoring me during my start in tech writing.

And, of course, a thank you to my editors at Wrox Publishing, Chris Webb and John Sleeva, for believing in this project. And who have patiently put up with my trying to buck procedure time and again to try new things, resulting in the use of some interesting collaborative tools such as Google Docs, Buzzword, and Subversion in the creation and organization of this project.

My biggest and heartfelt thanks goes to the love of my life, my wife Joanne. With her love and sup-port through the long days and nights, I have achieved things in my career I would have never thought possible 10 years ago when I started down this road. We are truly of stardust and the stuff of dreams made manifest.

Finally, a big thank you to Adobe Systems Incorporated for helping generate such a creative industry of passionate professionals, and for being a shining example of the Cluetrain Manifesto at work, and with-out whose efforts neither this book nor my entire career would have been possible.

— Joseph Balderson

I’d like to thank my Adobe colleagues, Kyle Quevillon and the entire Flex Support Team, for their help and tips. I’d also like to thank the many Adobe customers for their suggestions that continue to make Flex a great product.

— Peter Ent

23642ffirs.indd 16 5/4/09 12:57:35 PM

Page 19: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

I would like to dedicate my portion of this book and give immense love and thanks to my son, Kobi; daughter, Mia; father, Robert; aunt, Kathryn; sisters, Lisa, Hiromi, and Mayumi; mother, Masako, and, most of all, my wife Michelle. Without their love, support, and encouragement throughout the writing process, I would not have had the energy and time to complete my chapters.

— Jun Heider

I would like to thank Joseph Balderson for organizing the team for this book and for having the vision to write such an in-depth book on Adobe Flex. I would also like to thank John Sleeva, whose editing skill and keen eye for clarity helped me through the process. Thanks, also, to all the technical editors who reviewed my work and kept me sharp — Campbell Anderson, Charles Bihis, Matthew Fabb, Greg Jastrab, and Douglas Knudsen. Finally, thanks to Chris Webb for providing the way to make writing this hefty and ambitious tome possible.

— Todd Prekaski

I’d like to thank Joseph Balderson and John Sleeva for taking me onboard, and Steven Webster for point-ing the ship in my direction to begin with. The waters were sometimes choppy, but the destination was worth the journey.

I’m also grateful to my colleagues and friends at Adobe, EPCC, and Realise for teaching me so much, and to all those who provided feedback and improvements. Thank you, Jeff Vroom and Seth Hodgson, for your LCDS wisdom; David Coletta and Allan Padgett, for the insider knowledge on Buzzword and the Tour Tracker; and especially the Bing Street Bunch, Alex, Paul, Dianne, James, JP, George, and Xavier, for the great company and curries over the last year. May there always be lime pickles at your table.

I am much indebted to the Flex community for their infectious spirit of invention and continuous knowledge sharing. My apologies for not acknowledging everyone individually; if your trick is in this book, please consider me grateful, and pinch one of mine any time you like.

I’d also like to thank my parents, Chris and Celia, for sparking my interest in computers, my brother and sister, Graham and Kate, for their friendship and phone calls, and my friend, Johnny, for lending me his Gang of Four book a decade ago and never seeing it again. I promise to return it now, along with a copy of Professional Adobe Flex 3!

— Tom Sugden

First and foremost, I thank my wife Marta. She has endured the writing process at my side, and without her encouragement and support, this book would never have been possible. I also would like to say thank you to my parents for always encouraging me to pursue my dreams and never give up.

23642ffirs.indd 17 5/4/09 12:57:35 PM

Page 20: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Thank you to everyone involved in making this project a reality — my fellow authors, Joseph Balderson, Peter Ent, Jun Heider, Todd Prekaski, Tom Sugden, and Joe Berkovitz; our editing team lead by John Sleeva; our technical reviewers; and our publisher John Wiley & Sons.

— Andrew Trice

Thanks to my friends and colleagues on the RealEyes team. Special thanks to Nils Thingval and John Crosby.

— David Hassoun

I’d like to thank Todd Rein for involving me in the messy fun of deep linking in the first place, and also express my gratitude to my very, very patient family.

— Joe Berkovitz

23642ffirs.indd 18 5/4/09 12:57:35 PM

Page 21: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

Introduction lv

Part I: Introduction to Flex 3 1

Why Flex? Chapter 1: 3

What Is Flex? 3What Is an RIA? 4

Clarifying the Competition 6For the Love of Flex 7

Bursting Myths about Flash and Flex 710 Reasons to Love Flex 12

Summary 15

The Flex 3 Ecosystem 1Chapter 2: 7

A (Not So) Brief History of Flex 17The Adobe Flex 3 Ecosystem 19

Runtimes 19Languages 27Frameworks and APIs 30Data Communications 32Servers 34

The Adobe Flex RIA Process Flow 35Design and Development 36Execution 37Communication 37Infrastructure 38

Future Additions to the Flex Ecosystem 38Summary 39

ActionScript 3.0 Fundamentals 4Chapter 3: 1

Core Language Concepts 41Basic Syntax 42Reserved Keywords 43Variables and Data types 44

Control Structures 44Conditional Statements 44Loops 46

23642ftoc.indd 19 5/3/09 7:21:06 PM

Page 22: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xx

Using Classes and Data types 47Value Types 47Numbers 48Strings 49Arrays 50Vectors 52Objects 53Casting 54Introspection 55

Object-Oriented Programming 57The Class Object 58Packages and Classes 58Class Attributes 59Class Members 59Interfaces and Inheritance 64

Summary 65

Using ActionScript 3.0 6Chapter 4: 7

The Flash Platform Framework 67Display Programming 68

Understanding the Display Architecture 68The Event Model 69

Event Classes and Types 69Event Process 70Event Flow 71The EventDispatcher Class 72

The Flash Player APIs 73The Display API 74The Flash AIR APIs 78Flash 10 APIs 79

Summary 83

Introduction to Flex Builder 3 8Chapter 5: 5

Getting Started with Flex Builder 85Flex Builder and Eclipse 86Learning Flex and Getting Help 87

The Flex 3 Workbench 90Workspaces 91Editors 93Views 93Perspectives 94

23642ftoc.indd 20 5/3/09 7:21:06 PM

Page 23: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxi

What’s New in Flex Builder 3 98New Wizards 98Design Mode Enhancements 98Development Enhancements 99CS3 Suite Integration 99

Summary 100

Part II: Developing with Flex 3 101

Using Flex Builder 3 10Chapter 6: 3

The Flex Compilation Process 103Development 104Compilation 105Publishing 106

About Projects 106Creating New Projects 107

Creating a Flex Application 108Creating a Flex Project 108Using Design Mode 111Using Data Binding 117Using Triggers and Effects 118Compiling Your Application 119

Creating an ActionScript Application 120Creating an ActionScript Project 120Comparing File Sizes 123

The (Undocumented) [SWF] Metadata Tag 123[SWF] Metadata Properties 124

Summary 125

MXML Fundamentals 12Chapter 7: 7

Language Principles 127MXML Is XML 127Naming Conventions 128MXML Syntax 128Display Hierarchy 129MXML Namespaces 129

Using MXML 133MXML Tags 133MXML Properties 135Using MXML and CSS 139Using MXML and ActionScript 141

Summary 148

23642ftoc.indd 21 5/3/09 7:21:06 PM

Page 24: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxii

Developing with Flex Builder 3 14Chapter 8: 9

Managing Projects 149Project Properties 149Exporting Projects 154Importing Projects 154Navigating Projects 157

Building Applications 164Creating a Debug Release 164Creating an Export Release 165Enabling Source View 167

Language Intelligence 170Code Editing 170Code Preferences 173Code Introspection 173Keyboard Shortcuts 176

Summary 178

Customizing Flex Builder 3 17Chapter 9: 9

Optimizing Flex Builder Performance 179Project Development Best Practices 179Eclipse Performance Management 181

Customizing the Workbench 186Editing the Workspaces List 186Using Custom Shortcuts 188Layouts for Productivity 189Managing Workspace Preferences 190

Using Code Repositories in Flex Builder 190Using the Local History 191Subclipse for Subversion Source Management 192

Summary 214

Part III: Working with Components 215

The Component Life Cycle and Class Hierarchy 21Chapter 10: 7

The Role of Flash in Flex Applications 217The Flex Framework Life Cycle 218

Frame-by-Frame 218The Life Cycle 220

Flex Class Hierarchy 222Flash and Flex Class Packages 222UIComponent 222

23642ftoc.indd 22 5/3/09 7:21:06 PM

Page 25: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxiii

Container Classes 224List Classes 225Formatters, Validators, and Collection Classes 226Framework Functions and Events 228

Summary 229

Using Data Binding and Events 23Chapter 11: 1

Using {Curly Braces} 231[Bindable] Metadata 235Events 236

Capture Phase 236Target Phase 237Bubbling Phase 238

Stopping Events 238Event Listeners 239

Using MXML 240Using ActionScript 240

Event Types 241Custom Events 241

Creating Custom Events 241[Event] Metadata 242Strategies for Using Custom Events 243

Summary 244

User Interface Controls and Containers 24Chapter 12: 5

Static Controls 245mx.controls.Label and mx.controls.Text 245mx.controls.Image 246mx.controls.SWFLoader 247mx.controls.HRule and mx.controls.VRule 247mx.controls.ProgressBar 248

Input Controls 248mx.controls.Button and mx.controls.LinkButton 249mx.controls.TextInput and mx.controls.TextArea 249mx.controls.NumericStepper 250mx.controls.DateChooser and mx.controls.DateField 250mx.controls.CheckBox 251mx.controls.ComboBox 252mx.controls.RadioButton and mx.controls.RadioButtonGroup 252mx.controls.HSlider and mx.controls.VSlider 253mx.controls.RichTextEditor 254

23642ftoc.indd 23 5/3/09 7:21:06 PM

Page 26: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxiv

mx.controls.PopUpButton 254mx.controls.PopUpMenuButton 255mx.controls.ColorPicker 256

Layout Containers 256mx.containers.Canvas 256mx.container.VBox and mx.container.HBox 257mx.containers.HDividedBox and mx.containers.VDividedBox 258mx.core.Application, mx.containers.Panel, mx.containers.TitleWindow 259mx.containers.Grid 260mx.containers.Tile 261mx.containers.Form 262mx.containers.ControlBar 263mx.containers.ApplicationControlBar 264

Navigation Components 264creationPolicy 264mx.containers.Accordion 265mx.containers.TabNavigator 265mx.containers.ViewStack 266mx.controls.LinkBar 267mx.controls.TabBar 267mx.containers.MenuBar and mx.controls.Menu 268mx.controls.ButtonBar and mx.controls.ToggleButtonBar 269

List Controls 270Summary 270

Layout Strategies 27Chapter 13: 1

Coordinate Positioning 271Constraint Positioning 272Positioning by Percentage 273Positioning by Alignment 274Advanced Constraints 275

ConstraintColumns 276ConstraintRows 277Constraints in ActionScript 278Constraint Sizes 278

Using includeInLayout 279Performance Considerations 280Summary 280

User Interface Integration 28Chapter 14: 1

Creating Forms 281Submitting Form Content 284

23642ftoc.indd 24 5/3/09 7:21:06 PM

Page 27: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxv

Building Forms with Flex Builder Design View 285Setting the defaultButton on the Form 286

Customizing Tooltips 286Custom ToolTips 286

Creating Pop-Ups 288Alerts 289Using the PopUpManager 291Interacting with Pop-Ups 293

Custom Cursors 295Cursor Management 295Busy Cursors 295Hand Cursors 296Custom Cursors 296

Summary 297

Getting Started with AIR 29Chapter 15: 9

What Does AIR Provide? 299Why Use AIR? 300Applications That Can Be Built with AIR 300Requirements for AIR 301

Building an AIR Application 302The IntroToAIR.mxml File 303The IntroToAIR-app.xml Descriptor File 304

The AIR Configuration File 306Building an AIR Application Part II 311

Modifying the IntroToAIR.mxml Window 311The MainWindow.mxml File 313The IntroToAIR-app.xml Descriptor File 314

Summary 316

Part IV: Advanced Component Development 317

Custom ActionScript Components 31Chapter 16: 9

Company Logo Example 320UIComponent and IUIComponent 320CompanyLogo.as 321

Component Structure 323Component Properties and the Flex Framework Life Cycle 323Invalidate Functions 324Adding Child Components 325Using invalidateProperties() and Applying Properties to the Component 326Measuring Components 327

23642ftoc.indd 25 5/3/09 7:21:06 PM

Page 28: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxvi

Component Layout 328Selecting the Base Class for Your Component 330Sizing Child Components 332

RockerSwitch Example 333Summary 341

Custom MXML Components 34Chapter 17: 3

MXML Versus ActionScript Components 343Customizing the Layout 345

Overriding updateDisplayList() 345Overriding layoutChrome() 346Setting Up Metadata Tags 348

Creating Template Components 348DefaultProperty Meta Tag 350Creating Custom Children 350

Extending MXML Components 351Summary 352

Extending Flex Components 35Chapter 18: 3

A Look at Composite Components 353Creating Composite Components 354

Properties 355Events 356Layout 357

Extending Existing Components 358Extending Button 358Extending TextInput 359Extending UIComponents versus Standard Components 360Appearance versus Behavior 361

Custom Containers 361Applying the Flex Component Life Cycle 362Tag Cloud 363Customizing Composite Components 365

Summary 367

Advanced Event Programming 36Chapter 19: 9

Custom Events versus Standard Events 369Extending Standard Events 371One versus Many 371

Adding Metadata to AS Class and MXML Files 372Adding Custom Events to Custom Components 372Handling Event Runtime Errors 373

23642ftoc.indd 26 5/3/09 7:21:06 PM

Page 29: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxvii

Event Flow 373Event Priority 373Preventing or Changing Default Behaviors 374Forwarding Events 374

Custom Data Binding 377Using the Bindable Metadata Tag 377Custom Data Binding with the Bindable Metadata Tag 377

Using BindingUtils 380Custom Data Binding in ActionScript 380ChangeWatcher 380

Summary 381

State Management 38Chapter 20: 3

What Are States? 383The States Property 384

Adding States 384Creating States Using Flex Builder’s Design View 384Changing States 387Testing the Example 387

Understanding the MXML Tags 388Adding Components 388Removing Components 389Gone, But Not Destroyed 389Setting and Changing Properties and Styles 390Changing Event Handlers 390Data Binding 391

Creating States in ActionScript 391Real Estate Management 393Common Problems 393

States versus ViewStacks 394Optimization 394

Anticipating Transitions 395Summary 396

Using Libraries 39Chapter 21: 7

ActionScript Libraries 397Flash Player Library 398Flex Libraries 398

SWCs versus SWFs 399Anatomy of a SWC 399

Creating a Library with Flex Builder 399Creating a Library Project 399

23642ftoc.indd 27 5/3/09 7:21:06 PM

Page 30: Ways to integrate Flash-built assets into Flex 3 ...€¦ · The Cairngorm micro-architecture framework Best practices for building efficient, high-performance Flex 3 applications

Contents

xxviii

Adding Sources 400Creating the SWC 400

Creating Libraries with COMPC 402COMPC Options 403Adding Assets 403Specifying the Manifest File 403

Best Practices for Component Libraries 404Sharing Source Directories 404Build to Sell 405

Using Libraries 405The libs Folder 405The Build Path 406Using Assets from Libraries 407Using SWC Files 407

Summary 408

Part V: Visual Effects and Multimedia 409

Styles 41Chapter 22: 1

What Are CSS Styles? 411Inline Styling Versus CSS 411Component Styles 413CSS Constraint-Based Layout 415CSS Styles and Class Inheritance 418CSS Styles and Subcomponents 419

Summary 422

Skinning and Themes 42Chapter 23: 3

What Are Skins? 423Embedded Assets 423Programmatic Skins 424Applying Skins 424Defining Skins per Object 426Defining Skins in Style Sheets 426Scaling and Scale-9 Grids 428Changing Styles at Runtime 430

Themes 433Default Flex 3 Themes 433Applying Themes 433Creating Themes 435Separating Themes to Libraries 435

Summary 435

23642ftoc.indd 28 5/3/09 7:21:07 PM