View Full Version: AS2 Crash Course!

lassie >>Discussions >>AS2 Crash Course!


<< Prev | Next >>

bigmac- 12-09-2007

no, playing timelines backwards isn't all that strange. It's not all that hard either, although you can quickly make a mess of your movie's playback speed if you don't know what you're doing... you'll need to use enterFrame handlers, which you need to use wisely since lots of enterFrames makes your movie chug. So, forward/reversal playback requires that you pull the flash playback out of the capable hands of the Flash timeline. Basically, we have to play a stopped timeline by manually iterating over frames. Sounds weird, I know, but keep reading... Let's build a scenario of a simple rollover / rollout nature where you rollover the clip, the timeline plays, then when you rollout, it plays backwards to its rest state. This is better than having separate rollover/rollout animations for the clip because if the user rolls out before the "over" animation has finished playing, there will be a skip in animations as it switches to the rollout visual. This won't happen if you just play a single timeline forwards and backward from whatever position that its at. So, on an Actions keyframe in the parent timeline, do this: button_mc.stop(); button_mc.dir = 1; button_mc.animate = function() { this.gotoAndStop(this._currentframe + this.dir); if (this._currentframe == 1 || this._currentframe == this._totalframes) { delete this.onEnterFrame; } } button_mc.onRollOver = function() { this.dir = 1; this.onEnterFrame = this.animate; } button_mc.onRollOut = function() { this.dir = -1; this.onEnterFrame = this.animate; } Okay, I just wrote that off the top of my head and in the forum post text field. I can't guarantee accuracy of syntax and target references (ie: I don't know that this will work as is if you were to drop it into Flash). Anyway, what voodoo is at work here? 1) Give the timeline a direction property. MovieClips are dynamic class objects, meaning that they accept having custom properties assigned to them. So, we added a "dir=1" that will tell the timeline which way to move (1 = forward, -1 = backward). 2) Write an animation function. You'll notice that we're keeping this timeline permanently stopped. That's by design. We'll manually increment the current frame by running this script on it. So, this script is making the timeline go to it's current frame plus whatever direction that the timeline is set to play (1 / -1). Then, we have a crucial optimizing point... we're checking to see if the timeline has reached either the beginning or the end. If so, we're disabling the onEnterFrame handler that will be calling this script. onEnterFrame handlers gobbl up system resource. They're fine to use when you need something to update based on frame count, but you always want to get rid of them when you no longer need them. 3) Add rollover and rollout scripts These are really simple. All they're doing is specifying the timeline's direction, then telling the clip to call it's animate function on every enterframe. And remember, the animate function is set up to automatically disable that enterFrame when it is no longer needed. Hope that illustrates the concept. I leave it to you to expand that logic to your specific scenario.

fatbuoy1- 12-11-2007

Hey Greg, the site is finally set up so i'm going to try this php thing now. With that last set of code you gave me on it var com:LoadVars = new LoadVars(); com.email = email_txt.text; com.subject = subject_txt.text; com.message = message_txt.text; com.onLoad = function() { feedback_txt.text = "Your message was sent successfully!"; } com.sendAndLoad("url/of/email.php"); I take it I put it in the parent frame of the contact form movie? Also, how do I make it send when I press the send button (send_btn)?

bigmac- 12-11-2007

Hey, hey, hey now... I'm not writing the app for you. You need to keep learning this stuff. You never did post your findings of looking up documentation on the LoadVars class! I still expect that before offering more help. :D So, you have the raw functionality. Now you need to work through how to make that fit into a very simple event flow. You write and post the code. I'll point out errors in the logic if they exist. If you luck into making something work and don't understand why, post it and I'll explain. However, you won't learn anything with me writing all the code for you...

fatbuoy1- 12-11-2007

Fair enough :D ill hit the books a bit more. I have actually been trying to adjust your code here and there but it tends to not work! Would you mind if I showed you some adjusted code i've tried that doesnt work?

bigmac- 12-11-2007

certainly! Adjusted code that doesn't work is pure gold... because having it explained makes you see WHY it doesn't work.

bigmac- 12-11-2007

BTW: The LoadVars documentation look up is EXTREMELY easy. I'll give you a handy starting point: do "Help > ActionScript Dictionary" (pre-CS3) or "Help > Flash Help" (CS3) within the Flash application. Then search for information. Simple... and the source of all the answers.

fatbuoy1- 12-11-2007

Great thanks :D Right well im still trying to get that text scrolling thing working. The code you gave me works perfectly when I put it into an actions frame in the parent mc of the text scroll mc. However, I want the scrolling to be controlled by up/down arrow buttons when the user scrolls over them. SO... at first I just changed button_mc.onRollOver = function() { this.dir = 1; this.onEnterFrame = this.animate; } button_mc.onRollOut = function() { this.dir = -1; this.onEnterFrame = this.animate; } to txt_dwn.onRollOver = function() { this.dir = 1; this.onEnterFrame = this.animate; } txt_up.onRollOut = function() { this.dir = -1; this.onEnterFrame = this.animate; } Which didnt work... possibly because the buttons are within the text scrolling movie clip (txt_mc) and so its absorbing any commands, and none are getting through to the buttons?

fatbuoy1- 12-11-2007

So i thought I'd try putting the code within the txt_mc itself, so the buttons and text would all be siblings... however I guessed because the code was now within txt_mc itself, I tried to make the following adjustments so that the code would be pointing to the right place... stop(); dir = 1; animate = function() { gotoAndStop(_currentframe + dir); if (_currentframe == 1 || _currentframe == _totalframes) { delete onEnterFrame; } } txt_dwn.onRollOver = function() { dir = 1; onEnterFrame = animate; } txt_up.onRollOver = function() { dir = -1; onEnterFrame = this.animate; } As far as I can see it, the code is controlling the current timeline, so it shouldnt need this. or txt_mc in front of it, but im obviously wrong because it isnt working! However it doesnt work WITH this. and txt_mc in it either... stop me if im babbling :p

bigmac- 12-11-2007

Er... wait... What are you doing? You're setting up a Flash timeline to animate the scrolling of a text field? Okay, we'll back up and address that in a minute (a timeline is TOTALLY unnecessary for that). But first, lets look at what went wrong with your implementation there... That "animate" function would need to be a property of the text field, as would the "dir" property. Those control the movement of an object, and need to be applied to the object that they target. So to set up the text field would look like this: txt_mc.dir = 1; txt_mc.animate = function() { //blah, blah, blah... code. } Now, here's a big problem in your code example: txt_dwn.onRollOver = function() { THIS.dir = 1; THIS.onEnterFrame = THIS.animate; } Notice what I capitalized? The "this" reference. "this" is a script reference to whatever object the script is attached to. The above script is attached to a button... so what does "this" reference? The button. You're applying the animation properties of the text clip onto the scroll button, which means that the text clip is blissfully ignorant of any need to scroll. What would need to happed is this: txt_dwn.onRollOver = function() { txt_mc.dir = 1; txt_mc.onEnterFrame = txt_mc.animate; } Now the button is targeting the object in question with the information needed to access it. This a very good example of the OOP (object oriented programming) concept of "Scope". All scripts exist within the scope of an object, and must target inside and outside of the scope accordingly. Now, to make text scroll, you're going to kick yourself when you find out how unbelievably simple it is. Go into Flash help and look up the "TextField.scroll" property. Come back with your findings and we'll discuss how to use it. It's insultingly simple.

fatbuoy1- 12-11-2007

Ok... have taken a look at that LoadVars documentation, have I got this right...? Creates a new LoadVars object, called 'com', which contains the variables 'email', 'subject' and 'message'. var com:LoadVars = new LoadVars(); com.email = email_txt.text; com.subject = subject_txt.text; com.message = message_txt.text; When the LoadVars object, com, loads (i.e. at the same time as it sends the information to the server) it causes feedback_txt to display the message... presumably I could replace this function with one that sends the user to another page or frame? com.onLoad = function() { feedback_txt.text = "Your message was sent successfully!"; } Takes the variables and sends it to the email.php file, (which arranges the information into an email and sends it) com.sendAndLoad("url/of/email.php");

bigmac- 12-11-2007

Almost perfect... just one small point with #2: "onLoad" is a response to the server operation being completed. What does sendAndLoad do? It sends and loads (how appropriate!). That is to say that it sends the specified variables out to a server page, then loads the results of the server operation (for example, if the server operation was a database lookup, this could send search criteria then load the results of the database query). So, the "onLoad" method will fire when Flash gets word that the server operation has finished. And yes, you could push to another Flash frame using that event. Another good tactic is to disable your "send" button when the user clicks it so that they can't repeatedly call the email function. onClick the button is disabled and the server call is sent out, then onLoad the button is reactivated so that the user can interact with the form again if they want to.

fatbuoy1- 12-11-2007

wow.. that really is quite simple once I get my head around it! So I just put send_btn.onRelease = function() { //code... blah blah blah } to make all that happen when I press the button? Im looking into that textfield.scroll thing now...

bigmac- 12-11-2007

yep... that would work. However, since you're talking about working with the parent timeline upon onLoad calling, I'd put the form submit operation on the main timeline and then call it from the button. As in: function sendEmailForm(): Void { // blah, blah, blah... code. } send_mc.onPress = function() { sendEmailForm(); } The way you'd described would work too. However this method adds some flexibility and is a better programming approach... keep jobs of objects isolated. IE: it's the job of the whole form to submit its self. The job of the send button is just to TELL the form to submit its self. So, code it best written to reflect that.

fatbuoy1- 12-11-2007

Ok... been looking at that textfield.scroll thing and heres how I understand it... 1.Create a dynamic textfield (called 'txt'), and use actionscript to apply text to it (which should allow me to create the text boxes for the other sections a lot quicker :D ) 2. Use txt.scroll--; to scroll the text up within the dynamic textfield so I came up with this... txt.text = "my paragraph of text."; txt_dwn.onRelease = function() { txt.scroll--; }; But the text isn't visible... so I must be doing something wrong

bigmac- 12-11-2007

Haha! Yes. This is good. Pretty easy, hu? Lets address one item at a time... First, the text field. Make it dynamic and size it to the height and width that you want the text block to display. Give it an instance name, and set it to "multiline" in the properties panel. Also in the properties panel, go to the far right side and click the button called "embed...". This will allow you to select which fonts to embed. This is crucial, and undoubtedly why your text field is not currently rendering. Keep reading... With a static text field, Flash knows that the contents won't be changing so it automatically embeds the font outlines of the characters included in the field. This is not true of Dynamic and input text fields. Flash can't guess as to what the field will include, so you have to manually specify fonts to embed. Click the "embed..." button to see the list of character sets. NEVER select the "embed all" set. That embeds something like 50,000 character glyphs into your movie which makes for massive file bloat. For standard use, you'll generally just select sets 2, 3, 4, and 5 which are: uppercase, lowercase, numbers, and punctuation. That gives you pretty much everything you need in 114 characters. Also, if you need a custom character that is not included in one of those four sets (é, ñ, etc...), you can enter them into the "include these characters:" field at the bottom. TIP: if you know a dynamic text field will only render numbers or display in all caps, just include the specific font set you need. Fonts add substantial file weight. So, that covers setting up the text field. Then yes, assign its contents via actionscript with "myfield_txt.text = 'blah, blah, blah'". I'll add a second post about scrolling.

Forumer™ is Voted #1 Free Forum Hosting provider
Build your own community today with the largest message board hosting company.