flash cs5.5 the missing manual, flash cs5.5 edition

1 Part One: Creating a Flash Animation Chapter 1: Getting Around Flash.. 118 Copying and Pasting a Motion Path.. 128 Part Two: Advanced Drawing and Animation Chapter 4: Organizing Frames

Flash CS5.5: The Missing Manual

by Chris Grover

Copyright © 2011 Chris Grover All rights reserved

Printed in the United States of America

Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472.O’Reilly Media books may be purchased for educational, business, or sales promotional use

Online editions are also available for most titles: safari.oreilly.com For more information, contact our corporate/institutional sales department: 800-998-9938 or corporate@oreilly.com.

Printing History:

June 2011: First Edition

Nutshell Handbook, the Nutshell Handbook logo, the O’Reilly logo, and “The book that should

have been in the box” are registered trademarks of O’Reilly Media, Inc Flash CS5.5: The Missing

Manual, The Missing Manual logo, Pogue Press, and the Pogue Press logo are trademarks of

O’Reilly Media, Inc

Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks Where those designations appear in this book, and O’Reilly Media, Inc., was aware of a trademark claim, the designations have been printed in caps or initial caps.While every precaution has been taken in the preparation of this book, the publisher and author assume no responsibility for errors or omissions, or for damages resulting from the use of the information contained herein

ISBN: 978-1-449-39825-5

[LSI]

Table of Contents

The Missing Credits xv

Introduction 1

Part One: Creating a Flash Animation Chapter 1: Getting Around Flash 15

Starting Flash 16

A Tour of the Flash Workspace 21

Menu Bar 23

The Stage 24

The Timeline 25

Panels and Toolbars 26

Toolbars 28

Tools Panel 28

Properties Panel 30

Library Panel 32

Other Flash Panels 32

The Flash CS5 Test Drive 35

Open a Flash File 36

Explore the Properties Panel 36

Resize the Stage 38

Zoom In and Out 39

Make It Move 40

Play an Animation 42

Save a File 42

Chapter 2: Creating Simple Drawings 45

Plan Before You Draw 45

Creating a Storyboard 46

Five Questions for a Better Result 47

Preparing to Draw 50

Setting Document Properties 51

Adding Measurement Guides 54

vi table of contents

Drawing a Shape 56

Choosing a Drawing Mode 59

Merge Drawing Mode 59

Object Drawing Mode 61

Using Merge Mode and Object Mode Together 64

Selecting Objects on the Stage 64

Essential Drawing Terms 66

Creating Original Artwork 68

Drawing and Painting with Tools 69

Aligning Objects with the Align Tools 83

Erasing Mistakes with the Eraser Tool 84

Copying and Pasting Drawn Objects 87

Adding Color 88

Changing the Color of a Stroke (Line) 88

Changing the Color of a Fill 92

Chapter 3: Animate Your Art 95

Frame-by-Frame Animation 96

Creating a Frame-by-Frame Animation 97

Test Your Frame-by-Frame Animation 101

Editing Your Frame-by-Frame Animation 103

Selecting Frames and Keyframes 103

Inserting and Deleting Keyframes and Frames 104

Making It Move with Motion Tweens 107

Tweening a Symbol’s Dimension Properties 111

Copying and Pasting Frames 113

Reversing Frames in a Frame Span 115

Editing the Motion Path 116

Moving the Motion Path 116

Adding Curves to the Motion Path 117

Moving End Points on the Motion Path 118

Copying and Pasting a Motion Path 118

Copying and Pasting Properties 119

Shape Tweening (Morphing) 121

Shape Hints 125

Using Multiple Layers for Shape Tweens 127

Classic Tween 128

Part Two: Advanced Drawing and Animation Chapter 4: Organizing Frames and Layers 131

Working with Frames 131

Copying and Pasting Frames 131

Moving Frames and Keyframes 134

Editing Multiple Frames 136

table of contents

Working with Multiple Layers 140

Showing and Hiding Layers 144

Working with Layers 147

Renaming Layers 148

Copying and Pasting Layers 150

Reordering (Moving) Layers 151

Deleting a Layer 152

Locking and Unlocking Layers 153

Organizing Layers 154

Outline View 154

Organizing Layers with Folders 155

Spotlight Effect Using Mask Layers 157

Chapter 5: Advanced Drawing and Coloring 161

Selecting Graphic Elements 161

The Selection Tool 163

The Subselection Tool 168

The Lasso Tool 171

Manipulating Graphic Elements 175

Modifying Object Properties 175

Moving, Cutting, Pasting, and Copying 176

Transforming Objects 178

Moving and Rotating Objects in 3-D 186

Stacking Objects 190

Converting Strokes to Fills 194

Aligning Objects 195

Spray Painting Symbols 199

Drawing with the Deco Tool 201

Advanced Color and Fills 203

Color Basics 203

RGB and HSB 204

Creating Custom Colors 204

Specifying Colors for ActionScript 208

Saving Color Swatches 209

Using an Image As a Fill “Color” 210

Applying a Gradient 212

Importing a Custom Color Palette 216

Copying Color with the Eyedropper 217

Chapter 6: Choosing and Formatting Text 221

Text Questions 222

Choosing TLF or Classic Text 222

Choose a Text Type 223

About Typefaces and Fonts 225

viii table of contents

Adding Text to Your Document 225

Changing Text Position, Height, and Width 228

Rotating, Skewing, and Moving in 3-D 229

Changing Text Color 229

Creating a Text Hyperlink 230

Creating a Hyperlink Using Classic Text 231

Choosing and Using Text Containers 233

Creating Vertical Text Containers 234

Multiline and Single-Line Text Containers 235

Applying Advanced Formatting to Text 236

Create a Multicolumn Text Container 236

Flow Text from One Container to Another 237

Animating Text Without ActionScript 238

Experimenting with Animated Text 242

Moving Text in Three Dimensions 242

Text Properties by Subpanel 244

Text Engine Properties 244

Position and Size 245

3D Position and View (TLF Text Only) 245

Character 246

Advanced Character (TLF Text Only) 247

Paragraph 248

Options (Classic Text Only) 248

Container and Flow (TLF Text Only) 248

Color Effect (TLF Text Only) 249

Display (TLF Text Only) 250

Filters 250

Chapter 7: Reusable Flash: Symbols and Templates 251

Symbols and Instances 252

Graphic Symbols 253

Multiframe Graphic Symbols 268

Movie Clip Symbols 273

Button Symbols 278

Templates 288

Opening a Prebuilt Template 291

Customizing the Photo Album Template 293

Create Your Own Template 297

Chapter 8: Advanced Tweens with the Motion Editor 301

Applying Motion Presets 302

Saving a Custom Motion Preset 304

Modifying a Motion Preset 306

Changing the Motion Path 306

Deleting a Motion Path 308

Copying and Pasting a Motion Path 308

table of contents

Orienting Tweened Objects to a Motion Path 310

Swapping the Tweened Object 312

Editing a Tween Span 313

Viewing and Editing Property Keyframes in the Timeline 315

Copying Properties Between Property Keyframes 316

A Tour of the Motion Editor 317

Workflow for Common Tweens 318

Adding and Removing Property Keyframes 319

Moving Property Keyframes 320

Fine-Tuning Property Changes 321

Adding and Removing Color Effects 321

Using Filters in Tweens 322

Customizing Your Motion Editor View 322

Changing Transparency with the Motion Editor 324

Easing Tweens 326

Applying an Ease Preset 327

Creating a Custom Ease Preset 329

Chapter 9: Realistic Animation with IK Bones 331

Linking Symbols with Bones 332

Changing the Pose Layer 336

Creating Branching Armatures 338

Controlling the Degree of Rotation 340

Moving Bones 341

Repositioning Symbol Instances 344

Changing the Length of a Bone 344

Deleting Bones 346

Perfect Posing with Control Handles 346

Baby Steps with Pins 347

Making Shapes Move with Bones 349

Working with Control Points 350

Apply Spring to a Motion 352

Animating an Armature with ActionScript 355

Chapter 10: Incorporating Non-Flash Media Files 357

Importing Graphics 357

Importing Illustrator Graphics Files 361

Importing Photoshop Graphic Files 365

Import Options for Bitmaps 366

Import Options for Text 367

Other Photoshop Import Options 367

Importing Fireworks Graphics 368

Import Options for Objects 370

Import Options for Text 371

Copying Fireworks Effects and Blends 371

x table of contents

Editing Bitmaps 372

Turning Bitmaps into Fills 372

Turning Bitmaps into Vectors 373

Editing Bitmaps with Photoshop 375

Importing a Series of Graphics Files 375

Exporting Graphics from Flash 377

Chapter 11: Incorporating Sound and Video 381

Incorporating Sound 382

Importing Sound Files 382

Adding an Imported Sound to a Frame (or Series of Frames) 384

Editing Sound Clips in Flash 389

Incorporating Video 390

Encoding: Making Flash Video Files 392

Encoding Part of a Video Clip 397

Resizing and Cropping a Video Clip 397

Adding Cue Points to Your Video 400

Other Techniques for Reducing Video File Sizes 402

Preparing to Import Video Files 403

Importing Video Files 404

Importing a Flash Video File Stored on Your Computer 404

Importing a Flash Video from the Web 410

Customizing the Video Playback Component 410

Part Three: Adding Interactivity Chapter 12: Introduction to ActionScript 3 415

Getting to Know ActionScript 3 416

The Flash/ActionScript Partnership 417

ActionScript 3 417

ActionScript vs JavaScript and Other Languages 418

ActionScript 3 Spoken Here 419

Beginning Your ActionScript Project 421

Writing ActionScript Code in the Timeline 423

Using the Script Pane Toolbar 424

Writing Code in an ActionScript File 426

Object-Oriented Thinking 428

ActionScript Classes 430

Changing an Object’s Properties 430

Functions and Methods Put the Action in ActionScript 434

Events 437

Using Data Types, Variables, and Constants 438

Numbers 438

Strings 440

Boolean 441

table of contents

Arrays 441

ActionScript Built-In Data Types 442

Variables 443

Constants 444

Conditionals and Loops 444

Conditionals: if() and switch() Statements 445

Loops: while() and for() Statements 446

Combining ActionScript’s Building Blocks 448

Chapter 13: Controlling Actions with Events 451

How Events Work 451

Mouse Events 453

Getting Help for Events and Event Listeners 456

Creating a Rollover with a Mouse Event 458

Add Statements to an Event Listener 462

Creating a Tabbed Window with Mouse Events 464

Setting the Stage for Tabbed Folder Display 464

Planning Before Coding 468

Copy-and-Tweak Coding 475

Keyboard Events and Text Events 478

Using Event Properties 479

Capturing Text Input with TextEvent 481

Keeping Time with TimerEvent 483

Removing Event Listeners 484

In Case of Other Events 484

Smartphone and Tablet Events 485

Chapter 14: Organizing Objects with the Display List 487

The Display List: Everything in Its Place 487

When Display Objects are Display Object Containers 488

Adding Objects to the Display List 489

Add a Second Object to the Display List 491

Using trace() to Report on the Display List 494

Placing Objects Inside Display Containers 496

Moving Objects from One Container to Another 501

Removing Objects from the Display List 504

Managing the Stacking Order 505

Adding Display Objects by Index Position 506

Removing Display Objects by Index Position 509

Getting the Name or Index Position of a Display Object 510

Swapping the Position of Two Children 512

Summary of Properties and Methods 512

DisplayObjectContainer Properties 512

DisplayObjectContainer Methods 513

xii table of contents

Chapter 15: Controlling the Timeline and Animation 517

Slowing Down (or Speeding Up) Animation 518

Setting a Document Frame Rate 519

Setting a Frame Rate with ActionScript 522

Timeline Stop and Go 523

Using ActionScript to Start a Timeline 524

Organizing Your Animation 526

Working with Labeled Frames 527

Working with Scenes 533

Looping a Series of Frames 539

Looping Part of the Timeline 541

Reversing a Series of Frames 543

Reversing Frames in the Timeline 544

Chapter 16: Components for Interactivity 547

Adding Components 548

Making Button Components Work with ActionScript 554

Modifying Components in the Properties Panel 557

Adding a ColorPicker Component 558

The Built-In Components 562

User Interface Components 563

Finding Additional Components 581

Chapter 17: Choosing, Using, and Animating Text 585

What Font Does Your Audience Have? 585

Embedding Fonts in Your SWF file 586

Controlling Text with ActionScript 589

ActionScript Text: String Theory 589

Creating a New String 590

Joining Strings 590

Using TextField’s appendText() Method 591

Adding Line Breaks to a String 592

Finding a String Within a String 593

Replacing Words or Characters in a String 594

Converting Strings to Uppercase or Lowercase 594

Creating Text Fields with ActionScript 595

Positioning, Sizing, and Formatting a Text Field 596

Formatting the Text Field’s Background and Border 597

Adjust the Space Between Text and Border 597

Autosizing a Text Field 598

Formatting Characters and Paragraphs 599

Formatting with HTML and CSS 602

HTML and CSS Philosophical Differences 603

Using HTML Text in Flash 603

Creating a Hyperlink with HTML 604

table of contents

Using CSS to Format Classic Text in Flash 605

Formatting Text with an External CSS File 607

Choosing the Right Text Formatting System 610

Chapter 18: Drawing with ActionScript 611

What’s the Point? 611

Beginning with the Graphics Class 615

Drawing Lines 616

Drawing Curves 619

Drawing Built-In Shapes 621

Drawing Irregular Shapes 624

Making Drawings Move 625

Using ActionScript’s TimerEvent to Animate Drawings 625

Moving Objects Independently 628

Shapes, Sprites, and Movie Clips for Drawings 629

Removing Lines and Shapes 630

Part Four: Debugging and Delivering Your Animation Chapter 19: Testing and Debugging Your Animation 635

Testing Strategies 636

Planning Ahead 636

Techniques for Better Testing 637

Testing on the Stage 638

Using the Test Movie Commands 641

Testing Inside a Web Page 642

Testing Download Time 645

Simulating Downloads 645

The Art of Debugging 651

Checking with the Syntax Checker 652

Finding Errors with the Compiler Errors Panel 655

Using the Output Panel and trace() Statement 656

Analyzing Code with the Debugger 661

Setting and Working with Breakpoints 662

Chapter 20: Publishing and Exporting 669

Optimizing Flash Documents 670

Ten Optimization Strategies 672

Publishing Your Animations 678

Publishing As a Compiled Flash (.swf) File 679

Publishing As a Web Page 685

Publishing a Frame As a Static Image File 691

Publishing As an Animated GIF 699

Publishing As a Standalone Projector 700

xiv table of contents

Exporting Flash to Other Formats 701

Exporting the Contents of a Single Frame 701

Exporting an Entire Animation 703

Chapter 21: Introducing Adobe AIR 705

Meet Adobe AIR 705

Differences Between AIR and Flash 707

Creating Your First AIR Application 708

Create a Code Signing Certificate 711

Convert a Flash Animation to AIR 713

Publish Your AIR Application 716

Manually Install Adobe AIR Runtime 720

Chapter 22: Making iPhone Apps 721

Your First “Hello iPad” App 722

Joining the iOS Developer Program 723

The Purpose of Developer Certificates and App IDs 724

Getting a Developer’s Certificate 725

Assigning Devices for Testing 729

Creating an App ID for Your Project 730

Creating and Installing a Provisioning Profile 731

Creating an iOS App that Responds to Gestures 733

Using the Swipe to Next/Previous Code Snippet 734

Air for iOS App Settings 738

General Settings 739

Deployment Settings 739

Icon Settings 741

Publishing, Installing, and Testing Your App on an iDevice 742

Building a Tap-Ready App 745

Tips for iOS App Development 749

Chapter 23: Building Android Apps 751

Meet AIR for Android 752

Your First “Hello Android” App 754

App Building with the Android Accelerometer Template 756

Building Apps for Both iOS and Android 761

Resizing Graphics for Multiplatform Development 762

Tips for Android App Development 764

Part Five: Appendixes Appendix A: Installation and Help 767

Appendix B: Flash Professional CS5.5, Menu by Menu 779

Index 819

The Missing Credits

About the Author

Chris Grover is a veteran of the San Francisco Bay Area advertising

and design community, having worked for over 25 years in print,

video, and electronic media He has been using and writing about

computers from the day he first fired up his Kaypro II Chris is the

owner of Bolinas Road Creative (www.BolinasRoad.com), an agency

that helps small businesses promote their products and services

He’s also the author of Office 2011 for Macintosh: The Missing Manual, Premiere

Ele-ments 8: The Missing Manual, Google SketchUp: The Missing Manual, Flash CS5: The

Missing Manual, and Word 2007: The Missing Manual.

About the Creative Team

Nan Barber (editor) has been working on the Missing Manual series since its

in-ception She lives in Massachusetts with her husband and various Apple products

Email: nanbarber@oreilly.com.

Kristen Borg (production editor) is a graduate of the publishing program at

Em-erson College Now living in Boston, she originally hails from sunny Arizona, and

considers New England winters an adequate trade for no longer finding scorpions

in her hairdryer

Carla Spoon (proofreader) is a freelance writer and copy editor An avid runner, she

works and feeds her tech gadget addiction from her home office in the shadow of

Mount Rainier Email: carla_spoon@comcast.net.

Part One: Creating a Flash

Animation

Chapter 1: Getting Around Flash

Chapter 2: Creating Simple Drawings

Chapter 3: Animating Your Art

chapter

1

Getting Around Flash

As mentioned in this book’s introduction, Flash performs several feats of

audiovisual magic You use it to create animations, to display video on a

website, to create handheld apps, or to build a complete web-based

applica-tion So it’s not surprising that the Flash workspace is crammed full of tools, panels,

and windows (Figure 1-1) But don’t be intimidated—you don’t have to conquer

these tools all at once This chapter introduces you to Flash’s main work areas and

often-used toolbars and panels, so you can start creating Flash projects right away

You’ll experiment with Flash’s stage and timeline, and see how Flash lets you animate

graphics so that they move along a path and change shape