1 / 37

Movie Clips

Movie Clips. Movie clip symbols Movie clips have their own timeline A Movie clips timeline can contain content and be animated just like the main timeline (scene 1 timeline)

irish
Télécharger la présentation

Movie Clips

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Movie Clips

  2. Movie clip symbols Movie clips have their own timeline A Movie clips timeline can contain content and be animated just like the main timeline (scene 1 timeline) Can contain multiple layers, including graphic symbols, button symbols, and even other movie clip symbols, animations, sounds, ActionScripting, and more Movie clips or MC’s continue to play even if the Main Timeline has stopped MC are called “Timeline Independent” Must preview their animation in the main timeline by previewing movie: Control>Test Movie

  3. Movie clip demo Insert>New Symbol Name your Movie clip Select Movie clip option Create a tween in the movie clip timeline Click on scene 1 to return to main timeline Drag instance of movie clip onto stage Click on f5 to extend movie clip for desired duration Click on Control>Test Movie to preview Movie clip will repeat and unlike a graphic symbol with animation it doesn’t need to have more than one frame in the project timeline Movie clips are timeline independent, they continue to repeat

  4. Animated Movie clips vs Animated graphic symbols • Create a new graphic symbol • Add an animation to the graphic symbols timeline • Make animation at least 20 frames long • Exit symbol timeline (click on Scene 1) • Drag instance of graphic symbol onto timeline • Control>Test Movie • Create a new layer • Drag an instance of an animated movie clip symbol onto the timeline (use MC from last example) • Have both symbols appear for 10 frames (f5 adds frames) • Control>Test Movie • Graphic symbol displaying in the main timeline must have the same number of frames as the animation inside its timeline in order for the whole animation to show

  5. Movie clips can added to button states -Edit an existing button or create a new button -Add an additional layer to the button -On this layer insert blank key frame (f7) to the over state -Drag movie clip form library onto this key frame -Click on scene 1 to return to project timeline -Add button to stage Control>Test Movie -Movie clip should play during the over button state

  6. Importing libraries from previous projects You can import library items from other flash projects File>Import>Open External Library Open the desired project file (.fla) Switch back to current project by clicking on project tab above timeline On Library panel switch to other project, click on drop down menu at top and select the desired library/project Drag an instance from library onto the stage A copy of the symbol will be added to the current projects library Switch library back to the current project, click on drop down menu at top and select current project

  7. Working With Text

  8. Spell Check Flash allows you to run a spell check Text>Check Spelling Select Change to approve each change or Change All to automatically change all found typos at once

  9. Three different types of text elements: -Static text -Dynamic text -Input text

  10. Static Text Static text is text that you would use to display information or to label buttons, forms, or navigation. Use Static text when you want to simply display text.

  11. Dynamic Text Dynamic text is used to show up-to-date information that Flash can generate automatically from an external text file or a database Use dynamic text when you want to automatically show information from an external location Use dynamic text when you want to automatically show information that is updated often

  12. Input Text Input text is text that the end user is required to input such as a user name and password, forms, and surveys.

  13. Modify text Select text block Select desired font Properties Inspector>Font Select desired size Use device fonts should NOT be checked Checking device font will not embed font and instead use built in device font if the viewer does not have that font installed on their system. Font will actually become embedded in movie continued

  14. Modify text continued Built in device fonts are also listed under the fonts area within the property inspector: _sans or _serif or _typewriter In this example almost all users should have Arial font but embedding the font guarantees this font will be used

  15. Anti-Aliasing text Anti-aliasing attempts to remove aliasing by blurring the edges to make text appear smoother and less pixilated Aliasing is also often described as jaggies, stair stepping, sharp edges Anti-aliasing on by default When using font size 10 pt and smaller it is recommended that you turn off anti-aliasing, doing so actually makes the text look sharper To turn anti-aliasing off, select text block Properties Inspector>Alias text buttton

  16. Dynamic text field Actionscript 2.0 Start a new project Add three layers, naming text, actions, and background Text should be the first or top layer Select the Text layer Select the text tool from the Toolbar Within the Properties Inspector select Dynamic Text, Multiline Optionally select Show Border Around Text (paper icon) Set Font to Verdana, Black, size 10 Click and drag (down and to the right) on the stage to create a text field (block/box) continued

  17. Dynamic text field continued In the Properties Inspector under the Var: (variable) field type a variable name, for example content Open a simple text editor such as TextEdit (Mac) When using TextEdit make sure to set preferences to plain text first, then start a new document Type your text content or cut and paste text into text editor At the very top of document, and at the very beginning before your text content, add the following yourvariablename= Replace yourvariablename with the variable name you used in the last step For example I will use content= The word content represents the variable I defined in the prior step, must be spelled exactly the same continued

  18. Dynamic text field continued Save text file as content.txt and save within the same directory or folder as your Flash project Within Flash select frame 1 of the actions layer Open the Actions panel (f9) Type the following exactly as shown: loadVariables(); or select this action by choosing Next, we need to add the text file filename we are dynamically linking to Within the parenthesis add the text file filename surrounded by quotes, “content.txt” , a comma, and then the word this which represents the current scene (scene1) For example: loadVariables(“content.txt”, this); continued

  19. Dynamic text field continued Control>Test Movie If text fails to show, then check your dynamic text field by clicking in it and within the Property Inspector make sure Font color is set to Black and the Show Border Around Text is selected If you still have problems viewing check to make sure you have named all correctly and use same names content is the variable name content= defines the text as the dynamic content content.txt is the text file content.txt has to be in the same folder directory as flash project file loadVariables(“content.txt”, this); loads content.txt file into the variable, content, in the this timeline (current scene)

  20. Dynamic text field and HTML You can add select HTML tags to your dynamic text field Open up the Flash project from last example Open up text file (content.txt) from last example Add bold tags around the first sentence by adding opening and closing HTML bold tags <b></b> -For example the opening text in my content.txt file would look like the following: Content= <b>First sentence is here. </b> Second sentence… Within Flash select the Dynamic text field and within the properties inspector select the Render as HTML button (looks like a less than and greater than sign <>) continued

  21. Dynamic text field and HTML continued Control>Test Movie Select HTML tags supported <b></b> <i></i> <br> <font></font> <img src=“filename.gif"/> <li></li> <p> <a href=“hyperlink address”>Name</a> see Flash help for all supported tags: Flash>Help>ActionScript reference>Working with Text>Using HTML-formatted text>Supported HTML tags

  22. Scrollable Dynamic Text Actionscript 2.0 Open up the Flash project from last example Select the dynamic text field (on stage) and within the properties inspector type an instance name in the Instance Name field (below where it says Dynamic Text) For example I will use the name textBio Create two buttons, up and down Add a buttons layer Place instance of down button on the buttons layer Open the Actions panel (f9) Global Functions> Movie Clip Control> on Select release from code hint continued

  23. Scrollable Dynamic Text continued -Insert a blank line below on(release) { -Select Built-in Classes> Movie> TextField> Properties> scroll -Modify instanceName to the instance name you used in the last step For example, I will use textBio in this example on (release) { textBio.scroll } -After the word scroll, add +=1 (1 represents the number of lines to scoll, scrolls up one line) textBio.scroll+=1 continued

  24. Scrollable Dynamic Text continued -Repeat these steps for the up button, modify your code so that the scroll code for the up button instance reads -=1 For example the code for the up button should read: on (release) { textBio.scroll-=1 } -Control>Test Movie

  25. Dynamic Text and CSS -Flash supports CSS Cascading Style Sheets (CSS) -Allows you to create text styles to apply to HTML documents -In the last example Flash loaded a dynamic text file and rendered the text as HTML -You could apply CSS styles to this document -See book for examples

  26. Input Text Actionscript 2.0 -Start a new project -Add three layers, naming text, input field, and message -Select the text layer -Select the Text tool from the Toolbar -Within the Properties Inspector change the Text Type to Static Text, Fontto Arial, Font Size 12, Text Color Grey and Bold -Click on stage to create text block -Type static text that you want to appear on stage: -For example: Please enter your name: -Select the input field layer, then select the Text tool -Within the Properties Inspector change the Text Type to Input Text continued

  27. Input Text continued -Within the Properties Inspector change the Text Type to Input Text -Create an input text box by clicking on stage (click and drag) place below where it says please enter your name: -Within the Properties Inspector set the Line Type to Single Line -Type a name in the variable field to assign a variable name -In the example we used inputName -Select the Show Border Around Text button continued

  28. Input Text continued -Click on the Character button within the Prop. Insp. -Select the Specify Ranges option and select both the Uppercase and Lowercase (Shift click), click OK -Create a submit button and add below input box -Select the button and open the Action panel (f9) -Global Functions> Movie Clip Control> on Select release from code hint -Type a comma after release and select k options (press k and scroll down) and choose keyPress”<Enter>” from code hint -Add a blank line below this line -Choose Statements>Conditions/Loops>if -Between the parentheses and after if type the following: variablenamegoeshere!= null continued

  29. Input Text continued -Replace variablenamegoeshere with the name of your variable assigned to the input text box in the first step != means not equal to and null means blank -Insert a blank line below -Choose Global Functions> Timeline Control> nextFrame -Your code should look similar to the following: on (release, keyPress "<Enter>") { if (inputName!=null) { nextFrame(); } } -Note: inputName represents the variable name that I assigned to the input text box continued

  30. Input Text continued -Select the message layer and add a blank keyframe (f7) to to the second frame -Select the Text tool and within the Properties inspector set the Text Type to Dynamic Text -Below the existing Welcome text create a text block (mouse click and hold down, drag right and down) -Within the Properties inspector in the Var: field type a variable name -For this example I will use message as my variable name -Change Fontto Arial, Font Size 12, Text Color Grey and Bold, select the center text alignment option and change the Line Type to Multiline -You should not select the Border Around Text button continued

  31. Input Text continued -Click on the Character button to embed the font (follow the same steps as we did before) -Click on frame 2 of the actions layer and open the Actions panel (f9) -Type variablenamegoeshere= -Replace variablenamegoeshere with your variable name from the last sep -For this example I used message = -After message = type the following: “Welcome, “+inputvariablenamegoeshere+”. Thank you for visiting”; continued

  32. Input Text continued -Replace inputvariablenamegoeshere with the variable name you used for the input text variable -For this example I used the variable inputName -Your code should look similar to the following: message = “Welcome, “+inputName+”. Thank you for visiting”; -Select frame 1 of the actions layer -Within the Actions panel(f9) type the following: stop(); -Control>Test Movie

  33. Bandwidth Profiler Open an existing flash project Control>Test Movie While movie is playing open the profiler View>Bandwidth Profiler Size displayed is the file size of your .swf file

  34. Variable Variable are used in programming Actionscript can use variables A variable is a saved or stored value Varaible holds a specific value variablename=“value given to this variable”;

  35. variablename=“value given to variable”; Example: joe=“Joe Cool is cool”; First you are declaring the variable, I wish to create a variable called joe, and then you are assigning a value to this variable, joe (the variable) is now equal to a string of words “Joe Cool is cool” joe=“Joe Cool is cool”; joe is the variable name joe has a value of “Joe Cool is cool”

  36. variablename=“value given to variable”; Quotes around value allow you to have a string for its value, a string simply means a word or words or combination of words and numbers for its value such as a phrase Values for variables can also contain numbers variablename can contain only letters, numbers with letters, and underscores, no spaces Should begin with lowercase letter though Cannot begin with numbers or underscores

  37. String literal vs expression String literal Can be used with a word or words with spacing and/or numbers spacing, quotes required joe=“Joe Cool is cool”; A string literal represents a value contained between the quotes and ActionScript does not try to interpret what is contained within the quotes Expression Or we could also define as an expression (number, no quotes required, no spacing or letters allowed) joe=5367123; An expression represents a value and can be interpreted by ActionScript to do something like a calculation

More Related