Basic

One of the most popular tutorial requests that has reached my email box and few message board posts is regarding text scroll. In response, the tutorial for creating a scrolling text file is written below. 

The example below will show you how your text scroll box should look like. Click on the up and down arrows or press the up and down keys on your keyboard.

Creating Scrolling Text

Before we start, please download the partial source below. Don't worry, the partial source will not have the key elements to make it work...you'll do that with the information found below. Click here to download the source.

1. First, open the file scroll_partial.fla you just downloaded in Flash. You will see the basic structure for a text scroll animation.
     
2. You will need to define the text area in which all the information will be contained in. Click on the first frame of the layer marked "text". Once you have clicked on that frame, make sure the Text panel is displayed. Click on the tab marked "Text Options" From the first drop-down menu, select the command for "Dynamic Text".
      
3. Once you have selected "Dynamic Text", go to the second drop down menu. Select the command for "Multiline". The final step is to name the variable. Enter the variable scrollableText. Make sure the box for "Word wrap" is checked. Your Text (Options) panel should look like the following image.

4. Text field should now be completed. Before we continue on to the next steps, you may need to adjust the fonts. Click on the tab marked "Character" and modify the font, font size, and font color. Even though there is no text in the text box, the changes will remain. Make sure you have the text box selected before changing font properties.
    

Now that the text field has been completed, we will begin to add the ActionScript code to the two buttons. You will need to copy the code that I list and paste it into Flash. 

1. Select the up arrow with your mouse pointer. Right click on it and choose the command for "Actions". Make sure you are in Expert Mode. Click on the small arrow pointed right (on the top right of the Object Actions window) and select the command for Expert Mode. You may also press Ctrl + E. Copy and paste the following code into Flash.

on (press, release, keyPress "<Up>") {
    currentScroll = scrollableText.scroll;
    if (Number(currentScroll)>1) {
        scrollableText.scroll = currentScroll-1;
    }
}

2. Now, you will need to add some code to the down arrow. Right click on the down arrow and choose the command for Actions. Make sure you are in Expert mode from the Actions window. Copy and paste the following code.
    

on (press, release, keyPress "<Down>") {
    currentScroll = scrollableText.scroll;
    if (Number(currentScroll)<Number(scrollableText.maxscroll)) {
        scrollableText.scroll = Number(currentScroll)+1;
    }
}

We have completed the second major portion of adding the code to the down and up arrows. Now comes the task of creating a Variable and assigning the text to it.

1. Select the first frame in the layer marked "action". Choose the command for Actions once you right click on that frame. From the Actions window, you will need to be in Normal Editing mode instead of Expert. Make sure you are in Normal mode by either pressing the small right arrow or pressing the keys Ctrl + N.
    
2. Click on the button for Action and choose the command "set variable". Your Actions window will now have two boxes in which you can type information in. For the variable, we will use the name we gave the text box: scrollableText
    
3. For the box marked "Value", you type in the text that will scroll. You may want to type in a lot of words to make sure your scroll box works well. For example I wrote a random sentence into the value field. Your Actions window might look like the following image.
    

You are done with creating the text scroll animation. Close all the action windows, save the file, and preview it. The animation will scroll perfectly. If it does not, make sure that you named the variable scrollableText for both the text field and the variable name. For the final source code, please Click Here 

For another version of this FLA file, visit Colin Moock's site. He has one of the best Flash programming sites on the web, and you can check out his version of the text scroller that I referred to by clicking on the following link: 

Basic Text Scroller by Colin Moock

Just a final word before we wrap up. If you have a question and/or want to be part of a friendly, collaborative community of over 220k other developers like yourself, post on the forums for a quick response!