Creating
a Text Scroller
written by
kirupa
chinnathambi
Ever tried creating a text scroller to scroll
a few lines of text in Flash 5? If you haven't consider
yourself lucky! Creating a text scroller in Flash 5 is the
equivalent of writing the Declaration of Independence
backwards from memory. Fortunately for us, Flash MX includes
a built-in component that automatically creates a text
scroller for the text you specify.
Of course, Flash MX doesn't make it that
easy to create a text scroller. That's why this tutorial exists. The
following is an example of the text scroller you will create
by following my instructions:
[ you will create the above
animation ]
Creating a Text Scroller:
The steps will explain how to setup the
movie for creating the above animation:
Create a new document in Flash MX
by going to File | New. A new, blank Flash MX movie will be
displayed.
Modify the movie's width and height to 300 pixels by 200
pixels respectively.
How can you have a text
scroller without using any means of displaying text? You
cannot! Click the Text Tool icon from the Tools panel on the
left.
Once you have clicked the Text
Tool icon, draw a fairly large text box in your movie. Your
movie should look like the following image:
[ results of having used the
text tool ]
After the text box has been drawn, click on the Arrow tool
in your Tools panel. Now, click on the text box you
just drew with your mouse pointer. You will notice that
the properties panel changes to reflect the various
options available for the text box.
From the Properties panel, you will need to make some
modifications to our text box. From the first drop-down
menu, select Dynamic Text. Click the text field with the
words '<Instance Name>'. Enter the word, scroller.
From the Properties panel, set the font to Verdana
size 10. Your Properties panel should look like the
following image:
[ the modified text box
properties panel ]
We are not quite done modifying the Properties panel.
Click the drop-down menu which says 'Single Line' and
select the Multiline option.
Lastly, you should see four alignment buttons toward the
right of the Properties panel. Click the Center Justify
button. The Center Justify button will be depressed:
[ the center justify button is
pressed ]
With the text box complete, the only thing missing is the
text scroller. You should see a Components panel on your
right. If you do not see the Components panel, go to
Window | Components.
From the Component panel, you will see the ScrollBar
component displayed:
Click on the ScrollBar component from the Components panel
and drag-and-drop it ON your text box. The
ScrollBar component should automatically resize itself to
the size of your text box.
Now, it is time to copy the text that will be scrolled.
Highlight all the text in the scroll box and press Ctrl +
C:
Charge of the Light Brigade
1.
Half a league, half a league,
Half a league onward,
All in the valley of Death
Rode the six hundred.
"Forward, the Light Brigade!
"Charge for the guns!" he said:
Into the valley of Death
Rode the six hundred.
2.
"Forward, the Light Brigade!"
Was there a man dismay'd?
Not tho' the soldier knew
Someone had blunder'd:
Their's not to make reply,
Their's not to reason why,
Their's but to do and die:
Into the valley of Death
Rode the six hundred.
3.
Cannon to right of them,
Cannon to left of them,
Cannon in front of them
Volley'd and thunder'd;
Storm'd at with shot and shell,
Boldly they rode and well,
Into the jaws of Death,
Into the mouth of Hell
Rode the six hundred.
4.
Flash'd all their sabres bare,
Flash'd as they turn'd in air,
Sabring the gunners there,
Charging an army, while
All the world wonder'd:
Plunged in the battery-smoke
Right thro' the line they broke;
Cossack and Russian
Reel'd from the sabre stroke
Shatter'd and sunder'd.
Then they rode back, but not
Not the six hundred.
5.
Cannon to right of them,
Cannon to left of them,
Cannon behind them
Volley'd and thunder'd;
Storm'd at with shot and shell,
While horse and hero fell,
They that had fought so well
Came thro' the jaws of Death
Back from the mouth of Hell,
All that was left of them,
Left of six hundred.
6.
When can their glory fade?
O the wild charge they made!
All the world wondered.
Honor the charge they made,
Honor the Light Brigade,
Noble six hundred.
Copied from Poems of Alfred Tennyson,
J. E. Tilton and Company, Boston, 1870
Once you copied the entire text, it is time to paste the
text into Flash. Click the Text Tool icon and click on the
text box with the scroller. Your mouse cursor will change
to look like a character input character (the vertical
line). Paste the text you copied. Your text box should
look like the following image:
[ the text box after the text
has been pasted ]
Save the file and preview it in your browser by going to
File | Publish Settings | HTML.
You have just completed creating your text scroller.
If you think this was tough, imagine how difficult it
must have been to create a text scroller for Flash 5. As
always, I have provided the source code to the animation
you see above. Click the Download FLA link below to
download the source file:
Got a question or just want to chat? Comment below or drop by our forums (they are actually the same thing!) where a bunch of the friendliest people you'll ever run into will be happy to help you out!
When Kirupa isn’t busy writing about himself in 3rd person, he is practicing social distancing…even on his Twitter, Facebook, and LinkedIn profiles.
Hit Subscribe to get cool tips, tricks, selfies, and more personally hand-delivered to your inbox.
This is a companion discussion topic for the original entry at https://www.kirupa.com/developer/mx/textscroller.htm