tag:blogger.com,1999:blog-63681550629950400322024-02-20T02:44:06.593-08:00Actionscript TutorialsUnknownnoreply@blogger.comBlogger6125tag:blogger.com,1999:blog-6368155062995040032.post-22864951008205943652011-09-13T08:56:00.001-07:002011-09-13T08:56:29.808-07:00ActionScript 3 External Classes<div dir="ltr" style="text-align: left;" trbidi="on"><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px;"></span><br />
<div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">This tutorial is all about external ActionScript 3 classes. I will teach you how to linkage movie clips to an ActionScript class and then we’ll create an external class.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><span id="more-38" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"></span><br style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" /><object class="embedflash" data="http://flashmymind.com/SWF/ExternalAs.swf" height="300" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" type="application/x-shockwave-flash" width="300"></object><br style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" />The end product in seen above. The movie uses one external class and only a few lines of code is written in the main timeline. So why do we use external classes? To put it simple, external classes help you to stay more organized. External classes are part of a programming paradigm called “object oriented programming”. The subject is very broad, so I will not go into that. In this tutorial, you don’t need a great knowledge of OOP anyways. SO start your Flash IDE and let’s get started!</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Setting up the environment</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. Create a new document of size 300×300.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Draw a star on the stage. The polystar will help you in that.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. Convert the star into a movie clip. Give it a name “Star” and set the registration point to the center.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Linkage the movie clip to a class named “Star” (right click the movie clip in the library and select “Linkage”).</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="Linkage star" src="http://flashmymind.com/images/linkageStar.gif" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="Linkage properties" src="http://flashmymind.com/images/linkageProperties.gif" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Don’t worry about the ActionScript Class Warning. It warns you, because Flash can’t find a class named “Star”. That’s normal since we haven’t created that class yet!</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">5. Remove the star from the stage.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Moving into ActionScript 3</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">6. Create a new ActionScript file.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="ActionScript file" src="http://flashmymind.com/images/newFile.gif" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">7. Type the following in the class</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;">package <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> flash.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">display</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">MovieClip</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> flash.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">geom</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">ColorTransform</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> flash.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">events</span>.<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
This class represents the Star movie clip we drew on the stage.
We extend this class to a movie clip, thus allowing us to use movie
clip's functions and properties.
*/</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">public</span> <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">class</span> Star <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">extends</span> <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">MovieClip</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">private</span> <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> starColor:uint;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">private</span> <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> starRotation:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
This is called the constructer of the class.
It is called every time we create a new Star instance.
In the constructor, we assign a random color to the star and set some
of it's properties.
*/</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">public</span> <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> Star <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Calculate a random color</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">starColor</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Math</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">random</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span> 0xffffff;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">// Get access to the ColorTransform instance associated with star.</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> colorInfo:ColorTransform = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">transform</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">colorTransform</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">// Set the color of the ColorTransform object.</span>
colorInfo.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">color</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">starColor</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">// apply the color to the star</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">transform</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">colorTransform</span> = colorInfo;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Assign a random alpha for the star</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Math</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">random</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Assign a random rotation speed</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">starRotation</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Math</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">random</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">10</span> - <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">5</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Assign a random scale</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleX</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Math</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">random</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleY</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleX</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Add ENTER_FRAME where we do the animation</span>
addEventListener<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>Event.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">ENTER_FRAME</span>, rotateStar<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//This function is responsible for the rotation of the star</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">private</span> <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rotateStar<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">rotation</span> += <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">this</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">starRotation</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">8. Save the file as “Star.as” in the same directory where your main movie is (this is very important!). The movie won’t work without the correct file name and location. File names must always be the same as the class name.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">9. You can close the ActionScript class now. Go to your main movie and type the following code in the first frame.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
Create 100 stars on the stage.
Assign a random position to each.
All the star animation etc. are done in the "Star" class.
*/</span>
<span style="color: #b1b100; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">for</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> i = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0</span>; i <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"><</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">100</span>; i++<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> star:Star = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">new</span> Star<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
star.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">x</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stageWidth</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span> <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Math</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">random</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
star.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">y</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stageHeight</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span> <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Math</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">random</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
addChild <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>star<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">10. You are done, test your movie! I hope you enjoyed this tutorial and learned something from it. If you have any questions concerning this tutorial, please visit the <a href="http://forum.flashmymind.com/" style="color: #025d8c; font-size: 12px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">forum.</a> Have a nice day!</div></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-6368155062995040032.post-11972863918862761852011-09-13T08:55:00.001-07:002011-09-13T08:55:51.667-07:00ActionScript 3 Color Picker<div dir="ltr" style="text-align: left;" trbidi="on"><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px;"></span><br />
<div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">In this tutorial, I’ll show you how to change a movie clip’s color with ActionScript 3.0 using the color picker. So start up your Flash and let’s learn something new! At least I hope so…</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><span id="more-24" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"></span><br style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" /><object class="embedflash" data="http://flashmymind.com/SWF/colorPicker.swf" height="300" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" type="application/x-shockwave-flash" width="300"></object></div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Setting up the environment</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. First we add the color picker to the stage. In your “Components” window, drag the “ColorPicker” to the top left corner of the stage. If you don’t see the “Components” window, select Window -> Components (Ctrl + F7).</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Give the color picker an instance name of “myColorPicker”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. Now draw a movie clip to the stage. It doesn’t matter what you draw, just make it white since that’s our starting color. I drew a star using the PolyStar Tool.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Give your movie clip an instance name of “myStar”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">5. Now let’s make the bottom text boxes. In the bottom left corner, draw a dynamic text field and type “Current color selected:”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">6. Draw another dynamic text field next to the first one. Don’t write anything there, just give it an instance name of “myCurrentColor”. We’ll be changing the text dynamically from ActionScript.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Moving into ActionScript 3.0</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">6.Create a layer for ActionScript and type the following.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> fl.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">events</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">ColorPickerEvent</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> flash.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">geom</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">ColorTransform</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Set the color to white at the beginning</span>
myColorPicker.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">selectedColor</span> = 0xffffff;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">// Get access to the ColorTransform instance associated with star.</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> colorInfo:ColorTransform = myStar.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">transform</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">colorTransform</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Add a listener that dispatches an event when user selects a new color</span>
myColorPicker.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>ColorPickerEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">CHANGE</span>, colorChanged<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> colorChanged <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>:ColorPickerEvent<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">// Set the color of the ColorTransform object.</span>
colorInfo.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">color</span> = myColorPicker.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">selectedColor</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">// apply the change to the display object</span>
myStar.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">transform</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">colorTransform</span> = colorInfo;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Show the selected color in the text field</span>
myCurrentColor.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">text</span> = myColorPicker.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">hexValue</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">You are done, hope you enjoyed this Flash ActionScript 3 tutorial. If you have any questions concerning the tutorials, please visit the <a href="http://forum.flashmymind.com/" style="color: #025d8c; font-size: 12px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">forum.</a></div></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-6368155062995040032.post-78355202740508114082011-09-13T08:54:00.001-07:002011-09-13T08:54:53.557-07:00ActionScript 3 Timer Class<div dir="ltr" style="text-align: left;" trbidi="on"><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px;"></span><br />
<div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">ActionScript 3 timers are used to run pieces of code on a specific time sequence. They come in real handy when you want something to be done repeatedly, but not in every frame. This tutorial teaches you the basics of ActionScript timers and how to use them in your flash movies.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><object class="embedflash" data="http://flashmymind.com/SWF/timerClass.swf" height="400" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" type="application/x-shockwave-flash" width="400"></object></div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Setting up the environment</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. Create a new Flash ActionScript 3.0 document of size 400×400.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Create a dynamic text field of size 100×60. You can draw it anywhere on the stage.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. Embed the numerals of the text field. We need to do this, because we’ll be animating the numbers later on. Give the text field an instance name of “myNumberTextBox”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="Embed numerals" src="http://flashmymind.com/images/embed.gif" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Convert the text field into a movie clip. Name it myNumberMC. Set the registration point in the center.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">5. Linkage the movie clip to a class called “NumberMovieClip”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">6. Remove the movie clip from the stage.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Moving to ActionScript 3.0</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Now it’s time for the timer. Create a layer for ActionScript and type the following.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//We need these for the animation</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> fl.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">transitions</span>.<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">import</span> fl.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">transitions</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">easing</span>.<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
Create a timer that is called once every second (1000 milliseconds).
This timer will be called infinitely, because the second parameter is zero.
*/</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> timer:Timer = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">new</span> Timer<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">1000</span>,<span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
timer.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>TimerEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">TIMER</span>, changeNumber<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
timer.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">start</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Create the smaller number seen on the stage</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> myNumber:NumberMovieClip = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">new</span> NumberMovieClip<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Position the number in the center of the stage</span>
myNumber.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">x</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stageWidth</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">2</span>;
myNumber.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">y</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stageHeight</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">2</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Add it to the stage</span>
addChild <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>myNumber<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Make it invisible at the beginning</span>
myNumber.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">visible</span> = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">false</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Create the larger number seen on the stage</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> myNumberBig:NumberMovieClip = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">new</span> NumberMovieClip<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Position the number in the center of the stage</span>
myNumberBig.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">x</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stageWidth</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">2</span>;
myNumberBig.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">y</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stageHeight</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">2</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Make it a lot bigger (you can change these to whatever you want)</span>
myNumberBig.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleY</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">20</span>;
myNumberBig.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleX</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">20</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Reduce the alpha</span>
myNumberBig.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.1</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Add it to the stage</span>
addChild <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>myNumberBig<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Make it invisible at the beginning</span>
myNumberBig.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">visible</span> = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">false</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
Our timer calls this function.
The timer delay defines how frequently this function is called.
*/</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> changeNumber <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
Make our numbers visible.
*/</span>
myNumber.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">visible</span> = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">true</span>;
myNumberBig.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">visible</span> = <span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">true</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Assign a new numerical value for the movie clip</span>
myNumber.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">myNumberTextBox</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">text</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">String</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">target</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">currentCount</span> - <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">1</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
Animate the smaller number using the TransitionManager.
The animation lasts exactly as long as our timer delay is.
*/</span>
TransitionManager.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">start</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>myNumber, <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">type</span>:Fade, direction:Transition.<span style="color: #b1b100; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">IN</span>,
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">duration</span>:<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>timer.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">delay</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.001</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>, easing:Regular.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">easeIn</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//Assign a new numerical value for the movie clip</span>
myNumberBig.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">myNumberTextBox</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">text</span> = <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">String</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">target</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">currentCount</span> - <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">1</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">/*
Animate the larger number using the TransitionManager.
The animation lasts exactly as long as our timer delay is.
*/</span>
TransitionManager.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">start</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>myNumberBig, <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">type</span>:Zoom, direction:Transition.<span style="color: #b1b100; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">IN</span>,
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">duration</span>:<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>timer.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">delay</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">*</span> <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.001</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>, easing:Regular.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">easeIn</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Test your movie, and you should have a similar movie as mine. There is one other timer event available for you to use. It’s called the “timerComplete”. As the name suggests, it is called when the timer finishes. In this tutorial, that would be never, since our timer will run infinitely. That’s the end of this tutorial. If you have any question concerning the timer, please post them in the <a href="http://forum.flashmymind.com/" style="color: #025d8c; font-size: 12px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">forum.</a></div></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-6368155062995040032.post-69413479928652705362011-09-13T08:53:00.000-07:002011-09-13T08:53:29.268-07:00ActionScript 3 Keyboard Events<div dir="ltr" style="text-align: left;" trbidi="on"><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px;"></span><br />
<div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">In order to create a fully interactive flash movie, you need to know something about keyboard events. This tutorial is all about catching ActionScript 3.0 keyboard events and responding to them. So let’s get started!</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><span id="more-41" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"></span></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><object class="embedflash" data="http://flashmymind.com/SWF/keyboard.swf" height="200" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" type="application/x-shockwave-flash" width="400"></object></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Click on the stage and start pressing some buttons. See how the values change. Now let’s look the code behind this movie.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Moving to ActionScript 3.0</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Here is the code behind the ActionScript keyboard event movie.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;">
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>KeyboardEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">KEY_DOWN</span>, keyDownHandler<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">stage</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>KeyboardEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">KEY_UP</span>, keyUpHandler<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> keyDownHandler <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>:KeyboardEvent<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
keyDownText.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">text</span> =
<span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Key code: "</span> + <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">keyCode</span> + <span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"<span style="color: #000099; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">\n</span>"</span> +
<span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Ctrl status: "</span> + <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">ctrlKey</span> + <span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"<span style="color: #000099; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">\n</span>"</span> +
<span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Key location: "</span> + <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">keyLocation</span> + <span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"<span style="color: #000099; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">\n</span>"</span> +
<span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Shift key: "</span> + <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">shiftKey</span> + <span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"<span style="color: #000099; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">\n</span>"</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> keyUpHandler <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>:KeyboardEvent<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
keyUpText.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">text</span> = <span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Key code: "</span> + <span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">e</span>.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">keyCode</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">As you can see, the code is really simple. The “keyDownText” and “keyUpText” are just dynamic text fields, where we put the keyboard event text. Here are the explanations for the keyboard event properties.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><strong style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">keyCode: </strong>Every keyboard button has a numerical key code value. You don’t need to remember them of course. For example, use this movie to find the key’s corresponding value.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><strong style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">ctrlKey: </strong>Tells whether the control key is pressed or not. There is also a same kind of property for the alt button called “altKey”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><strong style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">keyLocation: </strong>This property indicates the location of the key on the keyboard. For example press the right shift button and see the location value for it. Then press the left shift button. As you can see, the location value changes. This is how you can differentiate same keys in the keyboard. This comes especially useful if you want to differentiate the keys between a numeric keypad and a standard keyboard.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><strong style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">shiftKey: </strong>Tells whether the shift key is pressed or not.</div></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-6368155062995040032.post-28144374445681481562011-09-13T08:51:00.000-07:002011-09-13T08:51:06.048-07:00ActionScript 3.0 Events<div dir="ltr" style="text-align: left;" trbidi="on"><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px;"></span><br />
<div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">In order to create an interactive Flash application, we need to learn something about events. An event is something that just happens in the application. There are many different types of events, such as mouse clicks, mouse move and mouse out. In this tutorial, you’ll learn how to respond to such events.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><span id="more-32" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"></span></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Note: You should already be familiar with the <a href="http://flashmymind.com/Tutorials/ActionScript/Basics/ActionScript.php" style="color: #025d8c; font-size: 12px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">basics of ActionScript</a></div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Handling mouse clicks</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">To create a movie clip that responds to mouse clicks, follow these steps.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. Draw a rectangle and convert it into a movie clip (press F8).</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Give the rectangle an instance name of ”myRectangle”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. Create a new layer called ”actions”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Type the following code in the actions panel (press F9 if you can’t see the panel)</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rectangleClicked<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>evt:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.2</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Explanation: The function parameter is an event type. We call it ”evt” in our function. We’ll cover the Event type a little later. For now, just remember that you need to give an event handler an event parameter. Once the user clicks the button, the rectangle’s alpha is going to change.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">5. So how do we know when the rectangle is clicked? For this , we use the ”addEventListener” method. Type the following.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;">myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">CLICK</span>, rectangleClicked<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Explanation: The ”addEventListener” adds a listener to the rectangle. The first parameter describes which event we are listening. We use ”MouseEvent.CLICK”, because we want to know when the user clicks the rectangle. The second parameter defines which function we call, when the user clicks the rectangle.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">6. Test your movie!</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><object class="embedflash" data="http://flashmymind.com/SWF/event1.swf" height="200" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" type="application/x-shockwave-flash" width="200"></object></div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Handling mouse hovers</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">If you want the object to respond on a mouse hover, you only need to change some parts of the code. Here is the code for mouse hover.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rectangleOver<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>evt:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.5</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">MOUSE_OVER</span>, rectangleOver<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Explanation: This time we want to listen for a “MOUSE_OVER” event. We added another event listener to the rectangle for this.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Handling mouse out</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">If you want the object to react when you move your mouse out of the rectangle, you apply the following code (don’t delete the old functions).</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rectangleOut<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>evt:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">1</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">MOUSE_OUT</span>, rectangleOut<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Now we have an interactive rectangle! You could use this in your website for example as a button. Remember, you can change the shape of the rectangle anyway you want to give it a nice look.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><object class="embedflash" data="http://flashmymind.com/SWF/event2.swf" height="300" style="list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" type="application/x-shockwave-flash" width="300"></object></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Final code:</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rectangleClicked<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>evt:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.2</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">CLICK</span>, rectangleClicked<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rectangleOver<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>evt:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.5</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">MOUSE_OVER</span>, rectangleOver<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> rectangleOut<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>evt:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">1</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">MOUSE_OUT</span>, rectangleOut<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">The Event type</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">You already know that when defining a function that responds to an event, you need an Event parameter for that function. Let me give you an example about this mysterious “Event” parameter. Type the following in the actions panel (we are still using the same rectangle “myRectangle”).</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;">myRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">addEventListener</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>MouseEvent.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">CLICK</span>, clickHandler<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> clickHandler<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>event:Event<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">trace</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Type of event: "</span> + event.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">type</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">trace</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"The event occured on: "</span> + event.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">target</span>.<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">name</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Now test your movie. You should see the following when you click the rectangle.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="Output" src="http://flashmymind.com/images/event_type.jpg" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">As we can see, the event parameter tells us something about the occured event. Most importantly, it tells us what object caused the event. This comes very handy later on, when we use the same event handler for multiple objects. With the event parameter, we know which object caused the event.</div></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-6368155062995040032.post-28275018353909079282011-09-13T08:49:00.000-07:002011-09-13T08:49:16.621-07:00ActionScript 3 Introduction<div dir="ltr" style="text-align: left;" trbidi="on"><span class="Apple-style-span" style="background-color: white; color: #444444; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px;"></span><br />
<h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">What is ActionScript?</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">ActionScript is automatically included in the Flash CS3, so you don’t need to do any additional installs. Basically, ActionScript enables you to develop interactive Flash applications. Allthough ou can build some kind of interactivity without writing any code, I strongly suggest that you make an effort and learn ActionScript. It pays off at the end. My tutorials will focus on ActionScript 3.0, which is the newest version of ActionScript. I’m not going to cover the differences between the old and the new versions, since there are many sites about that already.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Your first ActionScript application</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Now we’re ready to build our first Flash application with ActionScript. To start off, follow these simple steps.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. Create a new document (Flash File ActionScript 3.0)</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Create a new layer, name it ”ActionScript”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. In the ”ActionScript” layer, select the first frame.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">It is always a good practice to create a new layer for ActionScript. Although you can insert code into any layer, it keeps you more organized to have all your ActionScript in one layer.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Type the following code in the actions panel. If you don’t see the panel, press F9 (Window -> Actions).</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">trace</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Welcome to learn ActionScript"</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="My first flash ActionScript app" border="0" height="385" src="http://flashmymind.com/images/hello_world1.jpg" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" width="549" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Note that a small ”a” symbol appears in the frame where you inserted ActionScript code.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">5. Test the movie (Ctrl + Enter). You should see the same as below:</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="Output window" border="0" height="62" src="http://flashmymind.com/images/hello_world2.jpg" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" width="377" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">That’s how easy it is to insert ActionScript into your Flash application. I admit it, this application doesn’t do much, but as we go on, you’ll start to see the real power behind ActionScript.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Adding movie clips to our application</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Next, we create two movie clips into our application, which we manipulate by using actionsctipt.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. Create a new layer called ”ball”. Draw a ball in that layer and convert it into a movie clip. You can name it anyway you want.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Create a new layer called ”rectangle”. Draw a rectangle and convert it into a movie clip. You can name it anyway you want.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. Select the ball. Give it an instance name ”myFirstBall”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"><img alt="Instance name" border="0" height="107" src="http://flashmymind.com/images/instance_name.jpg" style="border-bottom-style: none; border-color: initial; border-color: initial; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-style: initial; border-style: initial; border-top-style: none; border-width: initial; border-width: initial; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; padding-top: 5px; text-decoration: none;" width="264" /></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">We give our movie clips instance names, so we can access them by using ActionScript.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Select the rectangle. Give it an instance name ”myFirstRectangle”.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">5. Open the actions panel and write the following.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;">myFirstBall.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.2</span>;
myFirstRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleY</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">2</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">6. Test your movie.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">You should see that the ball’s alpha has reduced and it’s more transparent. The rectangle has stretched in vertical direction. All this happened, because we changed their properties by using ActionScript. These changes only apply to these two instances. If you were to drag a new rectangle to the stage, it’s going to look normal, since we haven’t used any actionsctipt for that particlar rectangle.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">In this example, I only modified the alpha and scaleY properties, but you can manipulate all the object’s properties. For a list of the properties, refer to Adobe’s documentation.</div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Using functions</h3><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">We already have used one function in this tutorial, the trace() function. It is a function that prints into the Flash output window. In our case, we gave it a parameter called ”Welcome to learn ActionScript”. We are not bound to use only the functions that Flash provides. We can also create our own functions. This lesson is all about creating and using functions. You can continue using the same flash file as earlier..</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">1. In the actions panel, type</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> firstNumber:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">3</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> secondNumber:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">5</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Explanation:</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">The ”var” stands for variable. Everytime you create a new variable, you start the name with a ”var” statement. After the ”var”, you give your variable a name. This is the same as giving instance names (as we did earlier with the ball and the rectangle).</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">The ”Number” tells that the variable is a number. There are many different types of variables that you’ll learn by following my tutorials. After the name and type declaration, we assingn a value to a variable.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">2. Add the following code (after the variable declarations).</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> addNumbers<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>first:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span>, second:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> result:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span> = first + second;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">trace</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Result is "</span> + result<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span></pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Explanation:</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Functions always start with the word ”function”. After that, you give it a name. Our function is called ” addNumbers”. The function simply adds two numbers.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">The function takes two parameters. These parameters are called ”first” and ”second”. These parameters can only be used inside of the function. You don’t need a ”var” statement with function parameters.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">The ”:void” tells that this function isn’t going to return any value. We’ll learn more about this later, so don’t worry about it now.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">In the function ”addNumbers”, we simply add two numbers that were sent into the function. We use the ”trace” function to print the result.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">3. Insert the function call.</div><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;">addNumbers<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>firstNumber, secondNumber<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">Explanation:</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">This line calls our function. Without this line, the result wouldn’t be displayed in the output window, since nothing would call the “addNumbers” function!</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"></div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;">4. Test your movie.</div><div style="list-style-image: initial; list-style-position: initial; list-style-type: none; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 10px; text-decoration: none;"></div><h3 style="color: #555555; font-family: Helvetica, Arial, sans-serif; font-size: 16px; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Final Code</h3><div class="wp_syntax" style="background-color: #f9f9f9; border-bottom-color: silver; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: silver; border-left-style: solid; border-left-width: 1px; border-right-color: silver; border-right-style: solid; border-right-width: 1px; border-top-color: silver; border-top-style: solid; border-top-width: 1px; color: #110000; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 1.5em; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: auto; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: 606px;"><div class="code" style="border-bottom-color: rgb(204, 204, 204); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(204, 204, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(204, 204, 204); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(204, 204, 204); border-top-style: solid; border-top-width: 1px; font-family: Courier; list-style-image: initial; list-style-position: initial; list-style-type: decimal-leading-zero; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; text-decoration: none; vertical-align: top;"><pre class="actionscript" style="clear: none; float: none; font-family: monospace; font-size: 12px; line-height: 1.333; list-style-image: initial; list-style-position: initial; list-style-type: none; overflow-x: visible; overflow-y: visible; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none; width: auto;"><span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">trace</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Welcome to learn ActionScript"</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
myFirstBall.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">alpha</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">0.2</span>;
myFirstRectangle.<span style="color: #006600; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">scaleY</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">2</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> firstNumber:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">3</span>;
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> secondNumber:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span> = <span style="color: #cc66cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">5</span>;
<span style="color: grey; font-style: italic; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">//This function adds two numbers</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">function</span> addNumbers<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>first:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span>, second:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">void</span> <span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">{</span>
<span style="color: black; font-weight: bold; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">var</span> result:<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Number</span> = first + second;
<span style="color: #0066cc; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">trace</span><span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span><span style="color: red; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">"Result is "</span> + result<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;
<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">}</span>
addNumbers<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">(</span>firstNumber, secondNumber<span style="color: #66cc66; list-style-image: initial; list-style-position: initial; list-style-type: none; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">)</span>;</pre></div></div></div>Unknownnoreply@blogger.com0