Flash CS4 Fr Beginners WEBSITE WITH SCREENCASTS http://www.screencast matic.cm/channels/cqii64cv
Flash Interface Tls Panel and Timeline ~ 2 ~
Frm http://www.custmguide.cm/pdf/flash quick reference cs3.pdf 1 - Getting Started: Setting Up the Prject Launch Flash; at the startup screen Create New Flash File (AS 3.0) Save the prject File > Save As. Save as Rcket (CS4 frmat) Fr this prject, we are ging t create 5 scenes. Bring up the Scene panel by clicking Windw > Other Panels > Scene In the Scene panel, duble click the wrds Scene 1 and rename that t be textintr (press Enter when cmplete). Press the add scene buttn at the bttm f the Scene -------------------> panel t create anther scene. Rename this scene rcket. Repeat this prcess f adding scenes until yu have these five scenes: Save! ~ 3 ~
2 - Prperties Panel At the bttm f the Flash screen is the Prperties panel: Yu can set the Stage size, specific settings fr the prject, frame rate, and backgrund clr. Fr this prject, change the size and the backgrund as fllws: Click size buttn and set t 800 x 600 pixels Click backgrund clr swatch and change clr t black Frame rate is a measurement f hw quickly the playhead mves thrugh the Timeline. Frame rates are expressed in frames per secnd (fps). Fr Flash animatin, the default is 12 fps; the standard frame rate fr a theatrical film is 24 fps. Surce: http://www.adbepress.cm /articles/article.asp?p=1073 917&seqNum=2 Befre yu cntinue, be sure yu are in the first scene textintr. Lk at yur Scene panel. The active scene is shwn in gray highlight. And, belw the timeline, yu als see the scene name. Scenes play in the rder they are listed and, by default, Flash will then lp (after playing the final scene, it will replay frm the beginning). If yu are nt in the textintr scene, click n it nw. ~ 4 ~
3 Text Prperties & Frame-by-Frame Animatin When yu start a new Flash file, it pens with a single layer and hundreds f placehlder frames in the Timeline. The default layer is called Layer 1. It s a super gd idea t rename that layer s yu can keep cntent straight. Static frames Static r regular frames display the same cntent as the previus frame in the Timeline.Static frames must be preceded by a keyframe. Static frames are used t hld cntent yu want t remain visible until yu add anther keyframe in the layer. Placehlder frames A placehlder frame is merely an empty frame. It has n cntent. When yur mvie reaches an empty frame, it stps playing. The mst basic animatin prcess is called frame by frame. Frame by frame animatin creates the effect f mvement by changing the cntent's appearance frm frame t frame. This type f animatin gives yu a lt f cntrl ver hw the cntent changes acrss the Flash Timeline. Yu determine hw much f a change ccurs frm ne frame t the next by redrawing r reshaping frm frame t frame. NOTE: Frame byframe animatins increase the verall file size. Duble click Layer 1 and rename the layer title (type it and press Enter). Keyframes A keyframe defines a change in animatin, such as an bject mving r taking n a new appearance. When yu add a keyframe, it duplicates the cntent frm the previus keyframe. These appear as frames with a slid black dt. Blank Keyframes Yu can add a blank keyframe when yu want t add brand new cntent in yur mvie. A blank keyframe has n cntent. By default, Flash inserts a blank keyframe fr yu in the first frame f every new layer yu add t the Timeline. These appear as frames with a hllw dt. Surce: http://elasticlimit.cm/kirstenrae/wpcntent/uplads/2008/01/03_intr animatin1.pdf Click n the blank keyframe (frame 1, the ne with the circle in it) n the title layer. Then, grab the text tl. Ntice when yu select the tl, the Prperties panel changes t give yu text related functins: As shwn abve, set text type t Static Text (left), fnt t Curier New, size t 100, bld, and a light shade f green. Click and drag t draw a text bx. If yu need t repsitin it, use the black arrw tl. (NOTE: Repsitin in frame 1 befre yu create the rest f the frames because it will NOT be easy t change yur mind later yu d have t return t every keyframe and mve them all!!) In the text bx, type an underscre ~ 5 ~
Ntice hw yur frame 1 nw has a slid dt signifying a keyframe because yu put a textbx n the frame! Click n the next frame (frame 2) and insert a frame by pressing F5 (just a plain ld frame t make the letter stay visible fr a ttal f tw frames) Click n frame 3. Insert a keyframe F6, which cpies the previus frame fr editing. Then, click back in the text bx and add an S in frnt f the underscre. Repeat the previus prcess add a frame (F5) in frame 4. Repeat the prcess (keyframe, add a letter, add a frame after it, etc.) until yu have spelled ut SPACE FUN. After the last ne, insert a frame (F5) in frame 85 s that SPACE FUN will stay visible fr a ttal f 7 secnds. Yu have just created a traditinal animatin sequence. SAVE YOUR WORK!! See what yur animatin lks like s far by pressing Ctrl + Enter (Test Mvie) r just Enter (plays n the screen). Ntice it will g thrugh it, the text will remain n screen fr a gd while, there will be a quick flash f black (that s all thse extra scenes we haven t dne anything in playing), and then it restarts (lps). That s pretty much hw Flash wrks! Yu can als Test Scene instead f testing the whle mvie. That s useful frm time t time s yu dn t have t watch the whle thing when yu want t see just ne scene that s in the middle. Ctrl+Alt+Enter t Test Scene (r any f the ptins are available thrugh the Cntrl pull dwn menu). Hw did yu d? Well, let s try it again nly using drawing tls instead f text. First, create a new layer and name it subtitle. ~ 6 ~
Nw, BE CAREFUL and make sure yu are n the subtitle layer in frame 1 (the blank keyframe). We want this subtitle t NOT appear until after the title has finished. S, we need t keep it blank up until we want smething t shw. S, click in frame 25 and press F6 t create a new keyframe where we ll start drawing (ntice Flash autmatically puts a frame in frnt f it t keep the blank up until then). S that we d nt accidentally draw n the wrng layer, let s lck the title layer s it cannt be changed. Press the secnd dt that appears t the right f the title layer and a padlck will appear: That shws that it s lcked; click again n that spt t unlck (nt nw, thugh). Be sure yu are n frame 25 n the subtitle layer and we re ready t start drawing. Click the pencil tl. The pencil tl can be altered as fllws: Fr example, change the mdes and draw a letter S three times nce using straighten, nce using smth, and nce using ink. Ntice the way Flash changes what yu draw using the first tw ptins. The ink ptin keeps it exactly as yu draw it. Mst peple will want t use smth r ink fr drawing cursive letters, but it s ttally up t yu. After yu ve dne this example, UNDO and delete thse letters! We dn t want them! Nw, set t smth, green, and size 6 slid, and start drawing (just a teeny part) a cursive letter b. Then, click in the next frame, insert a keyframe, and add n (draw a little bit mre). Repeat ver and ver. Yu are writing ut the wrd by and yur initials. ~ 7 ~
When cmpleted, it shuld lk smething like this: Ntice that since the mvie was already 85 frames lng, Flash autmatically added an ending frame t the sequence n the subtitle line. S, it will remain n the screen until the end f the scene. Test it ut! Save and then press Enter t play r Ctrl+Enter t Test Mvie. All dne with Scene 1 TEXTINTRO! Types f Animatin in Flash Frame-by-frame Each frame cntains different cntent and animatin is achieved by running the playhead thrugh the frames. This animatin will appear n the timeline as a series f black circles (keyframes) ver the curse f many frames. Mtin tweening Mtin tweens ccur when an bject travels frm ne pint t anther. Smetimes mtin tween can als mean changing clr r scale ver time. T authr a mtin tween in Flash, yu place a symbl in the first frame (a keyframe) and ne in the last frame (anther keyframe) and tell Flash t spread the change in psitin ver a certain number f frames. Shape tweening By tweening shapes, yu can create an effect similar t mrphing, making ne shape appear t change int anther shape ver time. Flash can als tween the lcatin, size, and clr f shapes. Again, start with a keyframe. Then, insert anther keyframe later n with a different shape befre applying the shape tween. Surce: http://www.enthesweb.cm/flash/shape_tween.asp REVIEW OF FRAMES frm http://iris.nyit.edu/~kashani/web_based_multimedia_dev/flash/ ~ 8 ~
4 Changing Scenes and Drawing in Flash (plus Gradients) When yu started this prject, yu created five scenes. Since the first is finished, it s time t wrk n the secnd scene rcket. T change scenes, click the clapbard icn belw the timeline (bttm right) and select the scene named rcket: In the rcket scene, create a secnd layer (tw ttal layers) and name them as fllws planet and rcket (rcket shuld be the lwer layer): Types f Symbls in Flash Graphic symbls are reusable static images that are used mainly t create animatins. Any drawn vectr/plain text/imprted bitmap (pht), r cmbinatins f these, can be cnverted int a single cntrllable bject: as a graphic symbl. They typically have nly ne frame in their timeline. Buttn symbls are used fr timeline navigatin. They add interactivity t the mvie and respnd t muse clicks, key press r rllvers/rllut, and ther actins. Yu define the graphics assciated with varius buttn states (Up/Over/Dwn/Hit), and then assign actins t the instance f a buttn. They have 4 frames in their timeline ne each fr the up, ver and dwn states, and ne t define the hit area f the buttn. Mvie clip symbls are reusable pieces f Flash animatin cnsisting f ne r mre graphic/buttn symbls thus they are flash mvies within yur flash mvie. They have their wn nn restricted Timeline (any number f layers and frames just like the main timeline) that plays independent f the main mvie's Timeline. Surce: http://www.smartwebby.cm/flash/flash_symbls.asp Next, we will draw a rcket. I knw what yu re thinking: I can t draw n paper, much less with a cmputer muse. It s kay. Seriusly. Anyne can draw in Flash. It s a matter f lines. And with a cmputer, anyne can draw lines. I prmise. S, psitive attitude! First, we are ging t create a symbl and draw the rcket in the symbl. Symbls are reusable, s just in case we want t use the rcket again, we want it t be a symbl. Plus, symbls can d cl things (like fly!). Symbls are saved int the Library (F11 will bring up the library if yurs is nt visible). S, press Cntrl+F8 r just click n the Insert > New Symbl ptinsn the drp dwn menu. The New Symbl dialg bx appears. Call it rcket1 and change the symbl type t graphic. Check ut the screensht n the next page. Ntice that when yu pressed OK, yu left the nrmal timeline (the ne we labeled with planet and rcket layers) and are nw inside the rcket1 symbl. ~ 9 ~
Okay, nw, let s draw. Just t make life easier, yu might want t re label that Layer 1 n the timeline. Just call it drawing rcket. In the tlbx, chse the Rectangle Tl: In the Prperties panel at the bttm f the screen, set the strke clr (brder clr) t white and size 2. Set the fill clr (the inside clr) t a shade f blue. ~ 10 ~
Click and drag acrss the Stage t create a rectangle: Click the Selectin Tl (black arrw). Pint t the crner f the rectangle (upper right). Ntice hw the muse pinter changes t an arrw with a right angle: This means if yu click and drag nw, yu can mdify the crner. S, click and drag that crner dwn and then click and drag the bttm right crner up. Yu shuld create a triangle like this: Next, using the Selectin arrw, pint t a straight side. The muse shuld appear as an arrw with a curve. That allws yu t curve a straight line. Click and drag the tp and bttm lines t better shape!imprtant! ~ 11 ~ When drawing bjects with a strke and fill, nte that the strke and fill are separate items. Yu can mve the lines separate frm the fill inside. It s an easy mistake t grab the middle (fill) and leave the strke behind. If yu have t mve a shape, duble click it first t select bth the strke and fill.
the rcket ship. Chse the Line Tl. We re ging t draw sme fins. Use the line tl and draw fur lines as shwn: (Remember, yu can always adjust them with the Selectin tl) ~ 12 ~
Nw, use the Selectin tl t rund ut the lng straight lines yu just drew AND delete the white lines between the fins and the ship (just click with black arrw and press the Delete key): Yu might ntice that Hustn, we have a prblem (ha). The fins have n clr. Let s fix it! Click the Paint Bucket tl, be sure it s set t blue fill (it shuld be), and click in thse black fins. Nw, sme rcket thrusters! Draw tw mre rectangles as shwn: Then, delete the extra white lines. Finally, adjust the crners near the fins using the Selectin Tl. Return t the Scene nw. Ntice that yur symbl is neatly lcated in yur Library (F11). It is nt n the Stage because we drew it as a symbl. ~ 13 ~
Be sure yu are n the rcket layer. Click and drag the rcket1 ut f the Library and nt the Stage. Just pint t the thumbnail f it and click and drag with the Selectin tl. Nw, a pint ne thing abut symbls is that if yu make a change t a symbl, all instances (that s what they are called) f the symbl are changed. S, fr example, if yu changed this frm blue t red, it wuld change everywhere. If yu had 15 rckets, they d all change! We re ging t make a change. First, we have t get back int editing mde since we can t mdify it frm here (it has a blue symbl bx arund it t prve it t yu). S, duble click the rcket (either the ne n the Stage r the ne in the Library) t return t symbl editing. Take the Selectin tl and click n the blue fill (it will g all blcky t shw yu it s selected); then hunt fr the Clr panel (tp right usually r Windw> Clr). We re ging t give it a gradient fill instead f a slid ne (because it s just cler). Make the fllwing changes t the Clr panel: Make any ther changes r additins yu d like t the rcket and then return t the Scene. ~ 14 ~
5 Creating a Mvie Clip Right nw, we have a pretty bring scene a rcket with a gradient. But, it s time t add sme actin. Let s use frame by frame animatin and create sme fire t add t the rcket! S, create a New Symbl again, but this time, it shuld be a Mvie Clip type. Mvie clips animate in place and lp and that s just what we want. Nw, just fr grins, name the layer inside the fire mvie clip flame. Nw, t draw sme fire. Using the Pen Tl, draw smething like this. D nt click and drag. Just click, click, click (like the dts in a dt t dt) until yu get back the beginning. Nw, let s change the strke clr (it s prbably white) t a red. The Ink Bttle is used t d this. S, click the Ink Bttle Tl, pick a clr in the Prperties panel, and click the fire utline. ~ 15 ~
Give the fire sme fill nw using a gradient pick the linear gradient ptin (r anther ne, if yu like) and pick fur clrs. T add stps (mre clrs) t a gradient, click t create additinal bxes. When yu like the preview, use the Paint Bucket t pur the clr inside the fire utline: T mdify the shape f the gradient (rtate it arund r make it thicker), use the Gradient Transfrm Tl. Once yu get decent lking fire, we re ging t create anther keyframe and then mdify the shape using the Selectin Tl (curve lines and mve pints). S, click in frame 2 n the Timeline and press F6 t create a keyframe. Be sure the fire is nt selected (click n the black) and then click and drag crners and mve them arund. Repeat this (press F6 and repeat) s yu have three ttal frames. Here s an example f what they might lk like: Return t the Scene. ~ 16 ~
Yu shuld have tw symbls in the Library nw rcket1 and fire. 6 Cmbining Symbls S, the rcket n the Stage right nw desn t have fire. We have t cmbine that rcket with the fire t make the rcket ship we really want. Let s create yet anther new symbl!! But first, delete that rcket ff the Stage (WARNING: D NOT delete frm the Library. As lng as it s in the Library, yu can use it again) Create a new Mvie Clip symbl called RcketShip1. (Insert > New Symbl) Drag in fire frm the Library. Use the Free Transfrm Tl t make it smaller and flat. Then, cpy/paste s yu have tw cpies: Name that layer fire. ~ 17 ~
Make anther layer called rcket and drag the rcket ut f the Library. Repsitin the fire as needed: Return t the Scene and drag RcketShip1 ut nt the Stage n the rcket layer. Save!! Cntrl > Test Scene t watch the mvie clip in actin! Ww! 7 Mtin Tweening Symbls One cl Flash trick is tweening. It takes the hard wrk ut f animating. Instead f having t create every teeny, tiny frame f an animatin, Flash des the in between stuff fr yu! T add a tween, yu must have a starting keyframe, an ending keyframe that is different, and a tween inserted frm the Prperties panel in between the tw. In the rcket Scene n the rcket layer, resize the RcketShip and place smething like this: (hld Shift t keep scale) Super Imprtant Mtin Tween Animatin Rules 1. T animate an bject, it must be a symbl. If it is nt a symbl, it will abslutely nt wrk right. 2. Yu can nly animate ne bject n a layer at the same time. Be sure t select the crrect frame n the crrect layer when wrking with Flash. If yu want tw bjects t mve arund at the same time, they have t be n separate layers. After ne animatin n a layer finishes it s kay t start anther animatin n the same layer. Surce: http://www.awdsf.cm/curseware/flash/flash2_mtin_tweening.htm ~ 18 ~
Click n frame 60 n the rcket layer. Add a keyframe (F6): Click n the new keyframe in 60. Mve the RcketShip ff the right side f the Stage: Nw, click the Timeline smewhere between the tw frames (desn t matter where, just in a frame bx, like 30) and ntice the Prperties panel. Where it says Tween, change frm NONE t Mtin. Ntice the Timeline nw has a lng arrw between keyframes. This indicates a mtin tween. Save! Drag the Playhead acrss the Timeline (the red thing) and see yur rcket fly! Or, press Enter t preview it n the screen. Ntice yu dn t see the fire ging. Yu have t actually Test Scene (r Test Mvie) t see mvie clips in actin. Since the fire is made f mvie clips, click Cntrl > Test Scene and see it truly in actin. ~ 19 ~
8 Filters Lck the rcket layer since we ve finished it (click the dt). We re ging t create a new symbl and add a filter t it: Insert > New Symbl Make it a Mvie Clip type, called redplanet Chse the Oval tl Make sure the strke and fill are the same clr (red). Yu may have t change it back t slid since yu created a gradient last time. Draw an Oval (click and drag). Then, set the size (200x200px) using the Prperties panel: Return t the Scene. Drag the planet frm the Library t the tp right f the Stage. While it is selected, click the Filters panel (next t Prperties). Then, click the + sign t add a filter. TIP T use filters, the images must be mvie clips r buttns! Graphic type will nt allw it. ~ 20 ~
Chse Glw and set Blur X and Y t abut 50. Change the glw clr t yellw/light green. It shuld lk smething like this: Add a frame (F5) at frame 60 s that the planet remains visible fr the entire scene. Save and Test! Ntice the rcket is ging behind the planet. T fix that, repsitin the layers. Just click n the planet layer, hld dwn, and drag it dwn belw the planet layer. All better! Check it ne mre time befre yu g n. Available Filters: Flash Filters Filters can be applied nly t: text, mvie clips, r buttns. The rder filters are applied matters! Try adding multiple filters and rearranging them t see hw it affects the clip. T remve a filter, click it n the list and press the minus sign. ~ 21 ~
9 Mtin Guide Change t the next scene Rename the layer planet. Drag the planet frm the Library t the Stage and psitin as fllws. Use Free Transfrm t make it bigger (make it hang ff the Stage), and repeat the Filter steps t add the glw: Insert a frame (F5) at 30. Lck this layer! Add anther new layer abve the planet layer. Name it rcketship. Drag the RcketShip ut f the Library. Resize (Use Free Transfrm) t make it small and psitin in tp left crner. ~ 22 ~
We re ging t create a mtin guide s that the rcket fllws a path, rather than just ging in a straight line. S, create a Mtin Guide by clicking the icn. Be sure yu are n the RcketShip layer! Then, Lck the RcketShip layer fr a minute. Click n the Guide layer. Using the pencil tl, draw a path smething like this: Lck the Guide layer! Unlck the RcketShip layer. Nw, click and drag the ship and yu ll see a circle appear inside the rcketship; drag it t the beginning f the line yu drew. It shuld snap and cnnect t the end (if nt r if yu dn t see the circle appear, check t be sure yu have Snap t Objects selected (View > Snapping). Click in frame 30 n the RcketShip layer. Insert a keyframe (F6). Resize the rcket s it s bigger and repsitin at the end f the path. Be sure the circle snaps int place: Click between the keyframes and create a classic tween (in Prperties panel r right click). ~ 23 ~
Save and Cntrl > Test Scene. It fllws the path! One prblem, thugh. The ship desn t turn t fllw that path, s it lks strange. There is a little setting in the Prperties panel yu can change t make this lk better Orient t Path and als scale. We can als make it slw dwn as it lands (ease ut) as it lands (Ease ut): Nw, save again and take a lk! ~ 24 ~
10 Mtin Tween with Rtatin Mve t the Cntrl scene. Create the fllwing layers in this rder: Click the planet layer. Either cpy/paste the planet frm the previus scene r drag ut a new planet and add the glw again. Resize and make it really big (cver entire bttm). Lck the layer. Click the rcket layer. Drag anther cpy f the rcket ut, resize, and psitin as fllws: Lck the rcket layer. Nw, we re ging t create a hatch/dr. Click n the dr layer. Use the line tl and draw a dr. Make it white, 10 px width. ~ 25 ~
We want t mtin tween the dr s that it pens. S, we need t cnvert it t a symbl. Click it t select it and press F8 t cnvert that t a symbl: This is the final psitin f the dr, but nt where we want it t start. S, insert a keyframe at 20 (F6) t make this the ending frame and press F5 t insert a frame n the rcket layer s it will stay n the screen. If we were t rtate the dr nw (t clse it in frame 1), it wn t rtate prperly. Mve the rtatin pint (use the Free Transfrm tl and mve the big white circle in the middle) t the upper left: pint) It will nw rtate n that axis. (Repeat this n frame 20 relcate the rtatin Click back n frame 1 n the dr layer and rtate (using Free Transfrm) t clse the hatch. Create a mtin tween between the first and last keyframe t make the dr animate/pen (Prperties panel r right click). Insert a frame (F5) n the planet layer s it stays visible. Hld dwn Shift and click the planet, dr, and rcket. Then, cpy thse (Edit > Cpy). Change t the next Scene (final). Edit > Paste in Place t put thse items in their exact same spt. (NOTE: They are all n ne layer s yu cannt animate them in this next scene r afterward yu d have t create layers and cut/paste in place n each individual layer). Return t the cntrl scene. ~ 26 ~
11 Bitmaps Yu can use pre made graphics in Flash, but they wn t be as high quality as what yu draw. We re ging t add an alien. Dwnlad this green cmic alien (dwnlad the medium PNG file) http://www.clker.cm/clipart green cmic alien.html Lck every layer except the alien layer. Then, click n the first frame f that layer and File > Imprt t Stage and select the alien bitmap yu dwnladed. (Ntice that it nt nly imprts it t the Stage, but it als puts him in the Library) Mve him ver t the tp right (where he s nt tuching anything). T make changes t a bitmap (make it editable) yu have t d a functin called Trace Bitmap. S, click Mdify > Bitmap > Trace Bitmap. Use the default settings: Zm up n him. He lks pretty gd. Nw that he s brken t pieces, we can edit him. Delete the big gray blb belw his feet (there will be sme little pieces yu ll have t grab separately and delete just use the Selectin tl, click, and press Delete until yu get it all). Nw, click n his green belly. While it is selected, yu can change him t a different clr. S, pick a different shade f green frm the Clr panel (r chse anther clr). Nw we must cnvert him t a symbl s we can reuse him. T select all f him, draw a rectangle arund him (that s why we put him where he wasn t tuching anything) using the Selectin tl. Press F8 and turn him int a mvie clip called alien. Delete him frm the Stage (but nt the Library). Insert a blank keyframe (F6) in frame 10 n the alien layer and then drag him in. Free Transfrm and rtate him as fllws s he appears t be peeking ut. Insert a keyframe at 20 (F6) Back at frame 10, mve him back int the rcket ship. Then, put a mtin tween between 10 and 20 (right click r Prperties panel). Insert frame (F5) at 30 n all layers s all remains visible fr a little bit. Save and Test Mvie. ~ 27 ~
12 Fading (Alpha) Symbls G t the final scene. Rename the layer f stuff we cpied stuff. Then, add the fllwing new layers: We re ging t make the alien beam in (fade). Symbls can have their clr altered t make them either a different tint r a different level f transparency. S, lck the stuff layer and click n the alien layer. Drag him in. In the Prperty panel, click Clr and chse Alpha: Nte that 100% means it is 100% visible. 0% means it is invisible. We want t start with it invisible in frame 1 and make it 100% visible in frame 15. S, g ahead and insert a keyframe (F6) in 15. Then, g back t frame 1 and lwer the alpha t 0%. Create a mtin tween between frames. Nw, insert a blank keyframe (right click) in the final frame f the tp tw layers and a frame (F5) n the stuff layer s it all stays visible: ~ 28 ~
13 Actins & Buttns Actins are very pwerful (and there are TONS f them). Flash uses Actinscript t cntrl mvies. Fr example, Test Mvie right nw. Yu ll see it all happen. Hwever, it will lp back t the beginning when it finishes. What if yu dn t want it t?? Yu can use a STOP actin t make that happen. Actins can be added in the Actins panel (F9). Flash CS3 uses ActinScript 3, but yu can always chse a different versin f ActinScript fr a mvie (if yu are using lder tutrials nline, yu may have t change yur versin fr script t wrk). The stp actin is universal. On the Actins layer, in frame 15, type this in t create a stp actin: Press F9 t hide the Actins panel. Nw, we want t add a buttn t replay the scene at will. We will add it in frame 15 f the buttn layer. A buttn is a type f symbl. S, let s create a new symbl first Insert > New Symbl In the buttn editing mde, create these layers: Be sure it is a buttn type! Ntice a buttn has a special timeline. It nly has fur frames. The first three have t d with what yu see at different times (see inf bx ). The final is just the area that yu can click n t use a buttn. On the buttn layer, draw a rectangle. Yu pick the strke and fill clrs, but just make them different. (I chse white and green with a 4 pt strke). Then, insert a frame in the final (hit) frame (F5) s it stays. On the text layer, draw a text bx and type the wrd REPLAY. Insert keyframe (F6) in the OVER state. Change the clr f the wrds (highlight the text and change clr in the Prperty panel). This will make yur buttn wrds change clrs when smene pints t it with a muse. Insert frame (F5) in the final ~ 29 ~ The Fur Buttn States Up The appearance f the buttn when the pinter is nt ver it. Over The appearance f the buttn when yu place the pinter ver it. Dwn The appearance f the buttn when yu click n it. Hit Defines the area that will respnd t a click f the muse. (des nt shw)
(hit) frame. Return t the Scene. Drag the buttn ut t frame 15 n the buttn layer. Save and Test Scene. Ntice it changes when yu hver, but the buttn desn t g anywhere when yu click n it that requires mre Actinscript! Bring up the Actins panel (F9 r Windw > Actins). Click n the Actin layer (see the little a frm when we put the stp actin in??). Add the fllwing t the Actins panel (type exactly): NOTE: This is Actinscript 3 replay.addeventlistener(museevent.click,nclick) functin nclick(event:museevent):vid { gtandplay(1,"textintr"); } It will lk like this: Click n the buttn and give it the instance name replay. Yu name instances in the Prperty panel: And, nw Save and Test Mvie (Cntrl+Enter). If yu typed it crrectly, everything shuld wrk. The last scene shuld stp after the alien beams up, and the buttn shuld appear. Click it t return t the beginning! Final scene timeline: ~ 30 ~
~ 31 ~
Thanks fr participating! Yu may find screencasts helpful fr reviewing specific parts f this wrkshp. Please visit my channel at Screencast--matic t see the tutrials. Feel free t use them fr yur classes r yurself r share them with thers! http://www.screencast--matic.cm/channels/cqii64cv r http://mbeaflash09.ntlng.cm ~ 32 ~