flash mx studio - link.springer.com978-1-4302-5166-8/1.pdf · flash mx studio alex white: coming...
TRANSCRIPT
Flash MX Studio
Dennis Baldwin Jamie Macdonald
Keith Peters Jon Steer
David Tudury Jerome Turner Steve Webster
Alex White Todd Yard
Additional material to this book can be downloaded from http://extras.springer.com
/
Flash MX Studio © 2002 Springer Science+Business Media New York
Originally published by Friends of ED in 2002
All rights reserved. No part of this book may be reproduced, stored in a retrieval system or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embodied in critical articles or reviews.
The authors and publisher have made every effort in the preparation of this book to ensure the accuracy of the information. However, the information contained in this book is sold without warranty, either express or implied. Neither the authors, friends of ED nor its dealers or distributors will be held liable for any damages caused or alleged to be caused either directly or indirectly by this book.
Reprinted October 2002
Trademark Acknowledgements
ISBN 978-1-59059-188-8 ISBN 978-1-4302-5166-8 (eBook) DOI 10.1007/978-1-4302-5166-8
/
Flash MX Studio
Credits
Authors Author Agent Dennis Baldwin Chris Matterface
Jamie Macdonald Keith Peters Project Manager
Jon Steer Simon Brand David Tudury
Jerome Turner Technical Reviewers Steve Webster Sally Cruikshank
Alex White Steve Kirby Todd Yard Steve McCormick
Mike Pearce Additional Material Jon Steer
Kristian Besley Steve Webster Steven Williams
Commissioning Editor Jim Hannah Indexer
Fiona Murray Graphic Editor
Ty Bhogal Proofing Cathy Succamore
Editors Adam Dutton Managing Editor
Caroline Robeson Ben Huczek James Robinson
Gavin Wray
/
Flash MX Studio
Alex White: Coming from a Fine Art background, Alex once did 'arty' things with Director and obscure Mac 3D modelling programs, before selling out and moving to the big city making fancy Flash web sites for companies who could afford it. He has recently combined creative forces with fellow 'Messenger Buddy' Jez Turner for their 'ground-breaking' Flatpack Media venture.
Thanks go out to Jez at the 'Poole office', Claire for the countless hearty meals, and mum for her moral support.
David Tudury: David discovered Flash while interning in San Francisco three years ago. Since then he's worked in advertising, plug-in development, and online-gaming. The volatile economy quickly added some breadth to his experience. He's used Flash for simple animations, web sites, video games, and as a presentation layer for N-tier web applications. Mostly though, he just likes playing with it (www.outmoded.com is his playground).
"I need to thank Aaron Piland of www.apakstudio.com for the terrific portrait, Michael Montagna for helping with possible XML examples, Adam Dutton who edited (fixed) this chapter, Keith Peters who got me this opportunity, the other good folks at www.were-here.com, and Regina, my fiance, for understanding that computer people aren't supposed to sleep at night."
Dennis Baldwin: Dennis' main focus is to stay on top of technology and find exciting new ways to push the envelope of web development. He currently maintains a couple of online resources for Flash and ColdFusion developers at www.flashcfm.com and www.devmx.com. He is also the lead developer for Eternal Media (www.eternal-media.com), a web and multimedia firm that offers technology solutions for ministries and non-profit organizations. When he's not in front of the computer screen, Dennis mainly spends time with his wife Jamie or can be found skating around the streets of Dallas with his friends.
Jamie Macdonald; Jamie Macdonald works at Relevare in London. When he finds time he updates his own site www.nooflat.nu.
Author Biographies
Jerome Turner: comes from Leighton Buzzard where his first cinematic experience was watching Tom and jerry beat the hell out of each other on his parent's woodchip wallpaper. He then studied Art at Bedford College where he learnt that photography was cool because you could visit the Fine Art department whilst your films were drying. Following this he travelled to Exeter, wouldn't touch the cider, but did wander off with a degree in Media ArtsNisual Arts, which involved a lot of photocopying and pointing cameras at people who didn't really enjoy being filmed.
Since then he's moved to Poole with his long-suffering partner Claire and worked on a number of film and video productions as a production assistant, camera operator, script writer, boom operator, 1st AD, runner, producer, and director. Sometimes when he's very bored he goes to the boating lake to film Canadian geese.
Jon Steer: jon has been working as a web developer for nearly five years after graduating from Durham University with a degree in Economics. He is Technical Director of Durham Associates Ltd (www.da-group.co.uk), a marketing communications company in the north-east of England and admits to being far happier working with code than with pretty pictures! His main focus is serverside technologies, especially PHP and mySQL, and is always looking for different ways to put these to work. jon lives near Durham with his wife and two daughters to whom special thanks go for their enormous support and encouragement.
Keith Peters: lives in Lynn, Massachusetts with his wife Kazumi. He's been using Flash on and off for nearly three years now, but far more heavily in the last year. His personal site, www.bit-101.com, launched in August 2001 and he strives to keep up with the experiment-a-day schedule. It features fairly simple graphics, usually relying on math and scripting to build complex forms and movements.
Steve Webster: propeller beanie hat firmly in place, spends most of his time tinkering with scripting, backend, and Flash technologies, or writing about tinkering with scripting, backend, and Flash technologies. Being clearly masochistic in nature, he's been programming since he was knee-high to a grasshopper and can currently be found plotting his route to world domination. Mwahahaha ...
As always, I owe a great debt to my girlfriend Nicki for her saint-like patience while I was once again "that bloke locked away upstairs". Thanks also to the fantastic team at friends of Ed -you rock!
Flash MX Studio
Todd Yard: After studying and working for seven years as an actor, Todd was introduced to Flash in 2000 and was quickly taken by how it allowed for both stunning creativity and programmatic logic application -a truly left-brain, rightbrain approach to production - and has not looked back. He now works as Creative Director for Daedalus Media in New York City, which specializes in the creation of Flash-based corporate presentations, primarily for clients in the investment banking industry. His more frivolous work and experimentation can be found at his personal web site www.27Bobs.com.
Table of Contents
Introduction 1
Macromedia Flash MX: The Lay of the Land .......................................................... 1 Flash MX Studio: not for the faint-hearted ...................................................... 1 What's on the CD? .................................................................................................. 2 Layout conventions .................................................................................................. 2 Start building this movie ......................................................................................... .3 Support ....................................................................................................................... .4
section 1: Site Presentation
chapter 1: Motion 7
Easing out .......................................................................................................................... 8 Making a movie clip move with easing .............................................................. 8 Initiating motion with a mouse click ................................................................ 11 Adding a trail to an object's motion .................................................................. 12
Making the trail fade ...................................................................................... 13 Frame-based motion .................................................................................................... 16
Constant velocity .................................................................................................... 17 Swinging motion ...................................................................................................... 18 Scale in motion ........................................................................................................ 24
Managing the motion .................................................................................................. 26 Using empty movie clips ...................................................................................... 28 Picture navigator ...................................................................................................... 33
Summary .......................................................................................................................... 39
chapter 2: Formatting Text 41
Creating our own text effects ................................................................................... .41 Creating a typewriter effect ............................................................................... .42 Setlnterval .................................................................................................................. 45
Creating a text field dynamically .............................................................................. 47 Typing in ................................................................................................................... .49
A note on prototypes .................................................................................................. 56 Working with textFormat ............................................................................................ 51
Using setTextFormat. ............................................................................................... 57 Application of technique ............................................................................................ 61
Converting Strings .................................................................................................. 64 Advanced text effects .................................................................................................. 67
Calculating the width of a string ........................................................................ 68 Obtaining character positions ...................................................................... 69
Obtaining further data .......................................................................................... 69 Using the character positions ...................................................................... 72
Using character data for a text fade .................................................................. 73 Further possibilities ...................................................................................................... 76
Creating a random fade ........................................................................................ 76 Enhancing the picture navigation interface .......................................................... 78
Dynamically positioning images and adding text effects ............................ 79 Summary .......................................................................................................................... 87
Flash MX Studio /
chapter 3: Drawing API 89 Drawing a straight line ................................................................................................ 89 Drawing a curved line .................................................................................................. 91 Adding fills ...................................................................................................................... 95 Adding gradient fills .................................................................................................... 96 A draw square function .............................................................................................. 98 A draw circle function .............................................................................................. 1 01 Drawing a curve through a specified point ........................................................ 1 03 Making a sample application .................................................................................. 1 08
Drawing .................................................................................................................. 1 08 Shared objects ...................................................................................................... 11 0 Using a shared object .......................................................................................... 111 Saving our picture data ...................................................................................... 112 The fully functioning drawing application .................................................... 114
Summary ........................................................................................................................ 121
chapter 4: Components 123
The guts of a component ........................................................................................ 124 Tooltip basics .......................................................................................................... 125
Live preview .................................................................................................................. 133 Setting up a live preview .................................................................................... 134
What we want our tooltip to do ............................................................................ 136 Making a tooltip appear on rollover .............................................................. 138 Dynamically changing the text inside the tooltip ........................................ 142 Adding an enabled property .............................................................................. 144 Attaching the tooltip dynamically to a movie clip ...................................... 146 Preserving the original button actions ............................................................ 148 Adding the final requirements for the tooltip .............................................. 152
Extra button interactivity: retrieving alpha and brightness settings with Color.setBrightness .............................................................................. 155
Building our own button component ............................................................ 157 Summary ........................................................................................................................ 161
chapter 5: Taking Things Further 163
The Stage object ........................................................................................................ 163 Resizing the stage with the Stage object ........................................................ 164 More efficient resizing ........................................................................................ 170 Applying motion when the stage is resized .................................................. 173
XML ................................................................................................................................ 185 An XML loader ...................................................................................................... 191 Building the XML loader ...................................................................................... 194 Preloading the pictures ........................................................................................ 205 Displaying the photographs ................................................................................ 213
Summary ........................................................................................................................ 219
Table of Contents
section 2: ActionScript Interfaces
chapter 6: Introduction to Events and Handlers 221
Some basic definitions .............................................................................................. 221 Deleting event handlers ............................................................................................ 225 Changing event handlers .......................................................................................... 226
Passing parameters to event handlers .......................................................... 227 Event driven programming ...................................................................................... 228
Other events .......................................................................................................... 228 Button event handler .......................................................................................... 230
Keyboard event handlers .......................................................................................... 233 Event listeners ...................................................................................................... 233 Creating a Simple Game ...................................................................................... 235
Watches ............................................................................................................ 247 Summary ........................................................................................................................ 2S1
chapter 7: Advanced Collision Detection 253 hitTest ............................................................................................................................ 253
Bounding boxes .................................................................................................... 254 Using shapeFlag .................................................................................................... 255 Using the different types of hitTest ................................................................ 257
Mathematical collision detection .......................................................................... 259 Bouncing ball .......................................................................................................... 259 World cup pong .................................................................................................... 264
Distance-based movie clip to movie clip collision detection .......... 272 Look at the size of that thing .................................................................... 274 Multiple object collision ............................................................................ 277
Handling multiple objects in an array ............................................................ 278 Summary ........................................................................................................................ 283
chapter 8: Flash Math and Physics 287 Introducing trigonometry ........................................................................................ 287
Circular motion ...................................................................................................... 290 You looking at me? .............................................................................................. 293
Motion basics .............................................................................................................. 295 Uniform speed ........................................................................................................ 297 Acceleration .......................................................................................................... 299 Do you want to go faster? .................................................................................. 299 Gravity ..................................................................................................................... .301 Project #1: Asteroids ........................................................................................... .302
Springs ............................................................................................................. .320 Coordinate rotation ..................................................................................... .325
Ships in flight ......................................................................................................... .327 Project #2: Bounce ............................................................................................... .329
Summary ........................................................................................................................ 339
Flash MX Studio
chapter 9: Animation and lnteractivity with the Drawing API 343
Coded line drawing ................................................................................................... .343 Chaos lines ............................................................................................................. .344
Animating drawings ................................................................................................... .346 Cel generator ......................................................................................................... .347 Frame-by-frame animation ................................................................................ 350 Coded tweens ...................................................................................................... 352 Morphing fruit ....................................................................................................... .353
Gradients ..................................................................................................................... .359 linear gradients ..................................................................................................... .360 Radial gradients ..................................................................................................... .362 Dynamic color palette ......................................................................................... .365
Transformation matrix ............................................................................... .378 Gradient transform 1: sunrise blues ............................................................... .381 Gradient transform 2: rotation .......................................................................... 382 Gradient transform 3: fading gradients ......................................................... .384
Summary ....................................................................................................................... .386
chapter 10: 30 with the drawing API 389 Methods for 3D ......................................................................................................... .389
Pre-rendered ................................................................................................. .389 Approximated illustrations ....................................................................... .390 Real-time 3D ................................................................................................. .390
3D concepts reviewed ............................................................................................. .390 Axes ................................................................................................................. .391 Vertex .............................................................................................................. 391 Depth ................................................................................................................ 391 Vectors ........................................................................................................... .392 Matrices .......................................................................................................... 392
Coding the cube ......................................................................................................... .392 Setting the vertices ............................................................................................. .393 Adding mesh lines ................................................................................................. .395
Transformation matrices ........................................................................... .398 Depth sorting ............................................................................................................. .404
Filling the sides ..................................................................................................... .405 Backface culling .......................................................................................................... 407
Rendering only the necessities .......................................................................... 409 lighting polygons ....................................................................................................... .411
lighting the cube .................................................................................................. 411 Summary ........................................................................................................................ 417
chapter 11: Case Study: SphereCage 419
Concept ......................................................................................................................... .420 The 1% ........................................................................................................................... .421
Reflection map ..................................................................................................... .421 SphereCage: media ............................................................................................. .424
Table of Contents
The code ....................................................................................................................... .426 The SphereCage interface ................................................................................. .427 Master Classes ....................................................................................................... .431 Exploring inheritance ........................................................................................... .438 Game functions and object instantiation ..................................................... .448
Developing SphereCage further ............................................................................ 460 Summary ........................................................................................................................ 461
section 3: Rich Media 463
chapter 12: Dynamic Graphics 467 Optimizing JPEGs ....................................................................................................... .467 Optimizing JPEGs with Fireworks MX ...................................................................... 468 Loading JPEGs ............................................................................................................. .472
Flatpack sleeve designs ....................................................................................... .472 Preloaders ....................................................................................................... .475 Coding the Flatpack designs and photography .................................. ..477
Random backdrop ............................................................................................... .484 Bracken photo diary ................................................................................................. .487
Constructing the photo diary ............................................................................ 488 Calendar buttons .................................................................................................. 489
Summary ....................................................................................................................... .491
chapter 13: Video 493 Digital video basics ................................................................................................... .494
Exporting from Quicklime Pro ......................................................................... .496 Importing video into Flash ...................................................................................... 498
Optimization with Sorenson Spark ................................................................. .499 MX video test ....................................................................................................... .502
Controlling video in Flash ........................................................................................ 503 Banthacontroller .......................................................................................................... 504
Stage ................................................................................................................ 505 Video ............................................................................................................... .505 Buttons ........................................................................................................... .505 Library .............................................................................................................. 506 Actions ............................................................................................................ 506 Creating rewind and fast forward controls ......................................... .507 Broadband Banthafodder .......................................................................... 512
Flatpack video ............................................................................................................. .514 Video menu components: the Slipshod tour diary .................................... 520 Manipulating video: video playground ........................................................... .522
Summary ........................................................................................................................ 528
chapter 14: Audio 531
Non-streaming audio ................................................................................................ 532 Streaming audio .......................................................................................................... 532
Encoding MP3s using iTunes ........................................................................... .533
Flash MX Studio /
Loading MP3s into Flash .......................................................................................... 534 Flatpack MP3 .......................................................................................................... 535
File management ........................................................................................................ 540 Backing theme ........................................................................................................ 541 Mute ......................................................................................................................... .546
Summary ........................................................................................................................ 547
section 4: Dynamic Data Integration 551
chapter 15: Working with external files 551
The text file .................................................................................................................. 551 The functions .............................................................................................................. 554
loadVariables ................................................................................................. .554 loadVars .......................................................................................................... 557
Multiple variables ........................................................................................................ 560 Updateable marquee ............................................................................................ 560 Updateable navigation bar ................................................................................ 563
Putting it all together ................................................................................................ 566 Easily updateable site .......................................................................................... 566
Summary ...................................................................................................................... 570
chapter 16: Dynamic Flash: PHP 573
History 101 .................................................................................................................... 573 Two servers of Verona .............................................................................................. 574 Installing PHP ................................................................................................................ 576 PHP in action ................................................................................................................ 576
Recap, cap'n ................................................................................................... .577 Another message of the day .............................................................................. 578
PHP for the masses .................................................................................................... 582 Creating a simple e-mail application ................................................................... .584
Designer application .................................................................................... 585 Funky button component ahoy ....................................................................... .586 Da Flash Moo-Vee ................................................................................................ 591 And Now for something completely PHP ...................................................... 602
Trouble and strife ........................................................................................ 604 Where to go from here .............................................................................. 605
Summary ........................................................................................................................ 605
chapter 17: XML 609 What is XML? ................................................................................................................ 61 0
Tags and elements ........................................................................................ 61 0 Attributes ........................................................................................................ 611 Why use attributes when a bit of content would do? ...................... 611 Nodes .............................................................................................................. 612 Declarations .................................................................................................... 612 Comments ...................................................................................................... 612
Well-formed XML ........................................................................................................ 613
Table of Contents
Error message ................................................................................................ 614 Nesting ............................................................................................................ 614 White space .................................................................................................... 615
Naming .................................................................................................................... 615 Styling XML content .................................................................................................. 616
Default style sheet .............................................................................................. 616 Attaching style sheets to XML documents .................................................... 616
Valid XML ...................................................................................................................... 619 Accessing XML from Flash ........................................................................................ 619
Updateable marquee revisited .......................................................................... 621 Dynamic XML driven content .................................................................................. 624
Creating a browser in Flash with PHP and XML .......................................... 625 Summary ........................................................................................................................ 633
chapter 18: Flash, ColdFusion and Remoting 635 Getting started with ColdFusion ............................................................................ 636
The basics ........................................................................................................ 636 Message of the day using ColdFusion .................................................... 639
Flash Remoting ............................................................................................................ 640 Setting yourself up for Remoting ............................................................ 642
PMA contacts application .................................................................................. 642 The database .................................................................................................. 643 The components .......................................................................................... 645
Getting contacts .................................................................................................... 6SO Adding user interaction .............................................................................. 652
Selecting contacts .................................................................................................. 653 Adding contacts .................................................................................................... 655 Updating contacts ................................................................................................ 659 Delete contacts ...................................................................................................... 661
Summary ........................................................................................................................ 663
Index 665
j