Adobe Flex 2: Training from the Source, 1/e By Jeff Tapper, James Talbot, Matt Boles, Ben Elmore, Mike Labriola Publisher: Adobe Press Pub Date: October 20, 2006 Print ISBN-10: 0-321-42316-X Print ISBN-13: 978-0-321-42316-0 Pages: 624 Table of Contents | Index Part of the Adobe Training from the Source series, the official curriculum from Adobe, developed by experienced trainers Using project-based tutorials, this book/CD volume is designed to teach the techniques needed to create sophisticated, professional-level projects Each book includes a CD that contains all the files used in the lessons, plus completed projects for comparison This title covers the new development framework for Rich Internet Applications, Adobe Flex 2 In the course of the book, the reader will build several Web applications using Flex Builder and incorporating MXML and ActionScript 3.0 Adobe Flex 2: Training from the Source, 1/e By Jeff Tapper, James Talbot, Matt Boles, Ben Elmore, Mike Labriola Publisher: Adobe Press Pub Date: October 20, 2006 Print ISBN-10: 0-321-42316-X Print ISBN-13: 978-0-321-42316-0 Pages: 624 Table of Contents | Index Copyright Bios Acknowledgments Introduction Lesson 1 Understanding Rich Internet Applications Understanding the Evolution of Computer Applications Breaking away from the Page-based Architecture Identifying the Advantages of Rich Internet Applications RIA Technologies Lesson 2 Getting Started Getting Started with Flex Application Development Creating a Project and an MXML Application Understanding the Flex Builder 2 Workbench Running Your Application Creating a Second Application Page and Working in Design Mode Getting Ready for the Next Lesson What You Have Learned Lesson 3 Laying Out the Interface Learning About Containers Laying Out the E-commerce Application Using Design Mode Working with Constraint-based Layouts Working with View States Laying Out an Application in Source Mode What You Have Learned Lesson 4 Using Simple Controls Introducing Simple Controls Using Flex Explorer to Learn About Simple Controls Displaying Images Building a Detail View Using Data Binding to Link a Data Structure to a Simple Control Using a Form Layout Container to Lay Out Simple Controls Adding Radio Buttons and Date Fields to the Dashboard What You Have Learned Lesson 5 Handling Events and Data Structures Introducing Handling Events and Complex Data Structures Using the Tag with a Creation Complete Event Building a Custom ActionScript Class Building a Method to Create an Object Building Shopping Cart Classes Exploring the Event Object What You Have Learned Lesson 6 Using Remote XML Data with Controls Retrieving XML Data with HTTPService Populating a List with Retrieved XML as an ArrayCollection of Objects Populating a ComboBox Control and Programmatically Adding an Option Using XML Data with a Tree Control Retrieving XML Data and Transforming it into an ArrayCollection of Custom Objects Using Data Binding with Complex Data Structures Sorting and Manipulating Shopping Cart Data Adding a Remove Button What You Have Learned Lesson 7 Creating Components with MXML Introducing MXML Components Creating an Update/Delete Product Component and Instantiating It Popping Up Product Information When Clicking the Update and Delete Buttons Creating Another Value Object Creating a Data Manager Component for All Three Applications Using the New Data Manager Component Implementing Add Product Functionality Creating and Using a Component for the Dashboard Application What You Have Learned Lesson 8 Using Controls and Repeaters with Data Sets Introducing Using Data Sets Displaying the Categories Using a HorizontalList and an itemRenderer Displaying Grocery Products Based on Category Selection Coding States to Display Detailed Product Information Placing Products in the Shopping Cart What You Have Learned Lesson 9 Using Custom Events Understanding the Benefits of a Loosely Coupled Architecture Dispatching Events Declaring Events for a Component Identifying the Need for Custom Event Classes Building and Using the CategoryEvent Creating and Using the ProductEvent Class Understanding Event Flow and Event Bubbling What You Have Learned Lesson 10 Creating Custom Components with ActionScript 3.0 Introducing Building a Component with ActionScript 3.0 Creating the Structure of the Class Overriding the createChildren() Method Overriding the updateDisplayList() Method What You Have Learned Lesson 11 Using DataGrids and Item Renderers Introducing DataGrids and Item Renderers Adding a Generic DataGrid to ChartPod Adding HTTPService Calls to Dashboard Displaying the Shopping Cart with a DataGrid What You Have Learned Lesson 12 Using Drag and Drop Introducing the Drag and Drop Manager Dragging and Dropping Between Two DataGrids Dragging and Dropping Between a DataGrid and a List Using a NondragEnabled Component in a Drag-and-Drop Operation Dragging a Grocery Item to the Shopping Cart What You Have Learned Lesson 13 Implementing Navigation Introducing Navigation Using a TabNavigator in the Data-entry Application Adding a Home Page and Checkout Page in the E-commerce Application Creating the First Step of the Checkout Process Displayed by a ViewStack Completing the Checkout Process Using the ViewStack What You Have Learned Lesson 14 Using Formatters and Validators Introducing Formatters and Validators Using a Formatter Class to Display Currency Information in the E-commerce Application Using Validator Classes Using Regular Expressions to Validate Data (Part 1) Using Regular Expressions to Validate Data (Part 2) Building a Custom Validator Class What You Have Learned Lesson 15 Using the History Manager Introducing History Management Implementing History Management within a Navigator Container Building a Custom History Manager What You Have Learned Lesson 16 Customizing the Look and Feel of a Flex Application Applying a Design with Styles and Skins Applying Styles Skinning Components What You Have Learned Lesson 17 Accessing Server-side Objects Introducing Server-side Objects Using the Event Model Remote Server Calls Configuring an Application to Work Locally Using a Web Service in the Dashboard Using a Web Service in the DataEntry Application Uploading Files to the Server Centralizing Web Service Access Using Remote Object to Save an Order Mapping ActionScript Objects to Server Objects What You Have Learned Lesson 18 Charting Data Exploring Flex Charting Components Laying Out the Initial Charts Populating Charts Adding Horizontal and Vertical Axes to Line and Column Charts Adding Legends to the Charts Limiting the Labels Shown on an Axis Interacting with Charts Adding Chart Events Adding Animations to the Charts Customizing the Look of Charts with Styles What You Have Learned Lesson 19 Introducing Adobe Flex Data Services Introducing Flex Data Services (FDS) Installing the Adobe FDS Creating a Flex Builder Project with FDS Using the Flex Proxy Service Creating a Named Proxy Service Destination What You Have Learned Lesson 20 Pushing Data with Adobe Flex Data Services Understanding Flex Message Services Creating a New Project in Flex Builder Understanding How the Flex Message Service Works Enabling RemoteObject Calls to a ColdFusion Server Configuring a Message Destination Using the Tag What You Have Learned Lesson 21 Synchronizing Data with Adobe Flex Data Services Introducing the Data Management Service Configuring Data Management Services Creating the Data Management CFCs Using Data Management Service Data in an MXML Application Creating and Deleting with the Data Management Service Where to Go from Here What You Have Learned Lesson 22 Creating Transitions and Behaviors Introducing Behaviors and Transitions Implementing Effects on a Component Adding Effects to View States What You Have Learned Lesson 23 Printing From Flex Introducing Flex Printing Printing for the First Time from Flex Using the PrintDataGrid in a Nonvisible Container Building the Printable View in a Separate Component Scaling the Printed Output Printing a Receipt from the Checkout Process What You Have Learned Lesson 24 Using Shared Objects Introducing Shared Objects Building a SharedObject to Store Shopping Cart Data Reading Data from an Existing Shared Object What You Have Learned Lesson 25 Debugging Flex Applications Introducing Debugging Techniques Watching Server-Client Data Exchange Learning More About the Debugger Handling Errors with try-catch What You Have Learned Appendix A Setup Instructions Installing Flex Products Installing Lesson Files Installing the ColdFusion Extensions for Adobe Flex Builder 2 Starting Flex Data Services and ColdFusion Installing Flash Debug Player Index Copyright Adobe® Flex™ 2: Training from the Source Jeff Tapper/James Talbot/Matthew Boles with Benjamin Elmore and Michael Labriola Adobe Press books are published by Peachpit 1249 Eighth Street Berkeley, CA 94710 510/524-2178 800/283-9444 510/524-2221 (fax) Find us on the World Wide Web at: www.peachpit.com www.adobe.com To report errors, please send a note to errata@peachpit.com Copyright © 2007 by Adobe Systems, Inc Authors: Jeff Tapper/James Talbot/Matthew Boles with Benjamin Elmore an Adobe Press Editor: Victor Gavenda Editor: Robyn G Thomas Technical Editor: Michael Labriola Production Coordinator: Becky Winter Copy Editor: Nancy E Sixsmith Compositors: Rick Gordon, Emerald Valley Graphics/Debbie Roberti, Espres Indexer: Joy Dean Lee Cover Design: Peachpit Press Proofreader: Mark Kozlowski Notice of Rights All rights reserved No part of this book may be reproduced or transmitted in any form by any means, electronic, mechanical, photocopying, recording, or otherwise, without the prior written permission of the publisher For information on getting permission for reprints and excerpts, contact permissions@peachpit.com Trademarks Flash, ColdFusion, and Adobe are registered trademarks of Adobe Systems, Inc Flex is a trademark of Adobe Systems, Inc Throughout this book, trademarked names are used Rather than put a trademark symbol in every occurrence of a trademarked name, we state that we are using the names in an editorial fashion only and to the benefit of the trademark owner with no intention of infringement of the trademark Notice of Liability The information in this book is distributed on an "As Is" basis, without warranty While every precaution has been taken in the preparation of the book, neither the author, Adobe Systems, Inc nor the publisher, shall have any liability to any person or entity with respect to any loss or damage caused or alleged to be caused directly or indirectly by the instructions contained in this book or by the computer software and hardware products described in it Printed and bound in the United States of America 9 8 7 6 5 4 3 2 1 Dedication My efforts on this book are dedicated to my wife Lisa and daughter Kaliope Everything I do, I do for you two Jeff Tapper My efforts are dedicated to my family and friends as well as the Adobe Training and Consulting teams for giving me the incredible opportunities that have allowed this book to come to be James Talbot To friends To Sandra, my best friend and wife, who has helped and supported me in so many ways over the years Thanks for supporting me even when I chose to do crazy things, including writing this book To my siblings, Melissa, Todd, Jody, and Kent (and their wonderful families) who continue to be better and better friends with each passing year To Bryan and Colleen, who prove that once built, a solid friendship can't be diminished with time or distance To Bob and Connie, who were willing to be friends when I needed it most, even at the expense of their time To Sue, Robert, James, Deborah, Tina, Cathrine, Leo, Jon, and Jim, who are not only my colleagues in Adobe Customer Training, but who have also become great friends showCart() function showCloseButton property, PopUpManager class showDataEffect attribute showDataTips property, charts showEffect trigger 2nd 3rd showFault() method showPopUp() function 2nd 3rd 4th showPopUp() method showProducts() function showRoot property, Tree component simple controls data binding text, displaying Simple Object Access Protocol [See SOAP (Simple Object Access Protocol), Web Services.] skins for components basics custom graphic programmatic SmallProduct class 2nd SOA (service-oriented architecture) SOAP (Simple Object Access Protocol), Web Services SocialSecurityValidator class Sort class fields property sort property, ArrayCollection class sortByDateField() method 2nd SortField class 2nd case sensitivity descending sorts multiple numeric sorts sortItems() method, ShoppingCartItem class Source mode (Flex Builder 2) 2nd entering property values layouts Source mode button toggling with Design mode standardBlackBold style class 2nd 3rd standardOrange style class 2nd start() method, FlexPrintJob class starting ColdFusion FDS2 (Flex Data Services 2) state property, Panel class States view adding behavior effects case-sensitive controlling 2nd Design mode displaying product information transitions static methods, calling without objects Step Into command Step Over command Step Return command string concatenation StringValidator class styleName values, plain styles applying charts CSS inheritance setting with tag with CSS files with tag attributes text subscribe() method super() method, Validator class SVG files, Image controls SWF files @Embed directive generating or compiling with FDS HTTPService class Image controls switch statements synchronous or asynchronous communication syntax errors flagged 2nd terminating tags Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] TabBar components TabNavigator components 2nd 3rd target phase, event flow TechnologyAdapter class Terminate command Text controls 2nd assigning ids displaying with simple controls editable and non-editable text horizontal layout positions populating with data binding versus Label controls text property 2nd text, styles textAlign style property TextAndPic component TextArea controls/components 2nd textDecoration style property textIndent style property TextInput controls 2nd theReceipt class this keyword 2nd throw statements tightly coupled applications Tile containers, rules for children TileList controls/components 2nd dataProvider property drag-and-drop support itemRenderer property versus Repeater component TitleWindow class ToggleButtonBar components toggleState() function Tomcat servers, FDS2 Top constraint, Canvas containers toState property 2nd toString() function 2nd 3rd toString() method 2nd 3rd Product class trace() function trace() statements 2nd 3rd 4th transfer object assemblers transitions, view states Tree controls/components dataProvider property drag-and-drop support populating with XML data 2nd selectedItem property try-catch statements type property TypeChart component 2nd tags typeRPCResult() function 2nd typeRPCResult() method Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] tags UIComponent base class UIComponent base class, hierarchy UIs (user interfaces) limited by HTML page-based client/server systems RIAs, advantages for end users unit data type unitID property 2nd unitRPCResult() function 2nd units property, UpdateDeleteProd component Universal Resource Identifier (URI) Update/Delete buttons, product information UpdateDeleteProd component popup windows with product information 2nd units property updateDisplayList() method 2nd overriding for skins updateItem() method ArrayCollection class ShoppingCartItem class updateProduct() function 2nd 3rd 4th updateProductResult() function 2nd 3rd upload() method upSkin attribute 2nd 3rd URI (Universal Resource Identifier) user interfaces [See UIs (user interfaces).] Util class presetList() method yesNoToBoolean() method Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] tags tags validate() method ValidationResult class Validator class 2nd AddressValidator class value objects [See data transfer objects.] Variables view, inspecting values in debugger VBox containers 2nd Insert VBox dialog box rules for children Vertical Center constraint, Canvas containers vertical layouts verticalScrollPolicy property ViewStack class Checkout component container children creationPolicy property selectedChild and selectedIndex properties ViewStack components Visual Studio [See Microsoft Visual Studio, WPF component.] Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] Watched Expression web browsers lack of cross-browser support page-based architecture Web Service Description Language [See WSDL (Web Service Description Language), ColdFusion Web Services.] Web Services centralizing access in Dashboard application in DataEntry application sorting results support of web interactivity 2nd WebLogic servers, FDS2 WebService class WebSphere servers, FDS2 width and height properties, TextAndPic component Window > Preferences General Text Editors/Show Line Numbers Workspace/Local History RDS Configuration Windows Presentation Foundation [See WPF (Windows Presentation Foundation), components.] Windows Presentation Foundation/Everywhere [See WPF/E (Windows Presentation Foundation/Everywhere).] workbench (Flex Builder 2) editors expanding modes views perspectives WPF (Windows Presentation Foundation), components WPF/E (Windows Presentation Foundation/Everywhere) WSDL (Web Service Description Language), ColdFusion Web Services Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] XAML (Extensible Application Markup Language), WPF component XML [See also MXML.] and Ajax and Laszlo data retrieval transforming to ArrayCollection with HTTPService class 2nd 3rd embedding files in XML class, ActionScript version 3.0 versus 2.0 XML objects, nodes and attributes XMLDocument class XMLHttpRequest XMLList Collection foodColl property Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] yesNoToBoolean() method, Util class Index [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [L] [M] [N] [O] [P] [R] [S] [T] [U] [V] [W] [X] [Y] [Z] ZipCodeFormatter class ZipCodeValidator class 2nd 3rd .. .Adobe Flex 2: Training from the Source, 1/e By Jeff Tapper, James Talbot, Matt Boles, Ben Elmore, Mike Labriola Publisher: Adobe Press Pub Date: October 20 , 20 06 Print ISBN- 10: 0- 321 - 423 16-X... The directory structure of the lessons you will be working with is as follows: [View full size image] Adobe Training from the Source The Adobe Training from the Source and Advanced Training from the Source series are developed in association with Adobe. .. ensuring success at every step of the way Flex 2 is powerful, highly capable, fun, and incredibly addictive, too And Adobe Flex 2: Training from the Source is the ideal tour guide on your journey to the next generation of application