First time here? First time here? Newsletter Signup Newsletter
651326 Members and growing! | Flash Jobs
Search tutorials
Author: Vera Fleischer | Website: http://www.mediasparkles.com
The text field and scroll track

Open a new file in MX.

At the root level of Scene 1 add two extra layers to make it a total of three. Name the top layer "functions", the one below it "actions" and the bottom one "movie clip" or whatever else fits your purposes. We'll add the code later.

Create a dynamic text field in the bottom layer. Use a font, color, and size of your choice and drag it out to display a maximum of about 5 or 6 lines or however many you like. For this example, we will use a maximum of 6 lines that can be displayed at the same time. Make sure that "multiline" is selected and that "selectable" is not selected in the text properties. Give the text field an instance name of "w_field" (short for "window field" in my example). Don't worry about assigning a variable name. Lastly, click on "Character..." and select whichever character sets you would like to include.

For the main movie clip that contains everything else, select the text field and press F8 to convert it to a symbol. Choose movie clip for the behavior, name the symbol "main_mc" and give it an instance name "main". Now go into main_mc and rename the layer with the text field "text" and add a few more layers from top to bottom: "labels", "actions", "functions", "scroll thumb", "scroll buttons", and "scroll track". Once we add these graphics, well put them in their respective layers. If you want to include any other graphics, such as a window, add layers for those elements too.
Add two frames to each layer of this movie clip. Label the first frame "no_scroll", the second one "scroll_loop", and the third frame doesn't need a label. In the second frame of the "scroll thumb", "scroll buttons", and "scroll track" layers, add a keyframe each.



For the scroll track, go to the second frame of the "scroll track" layer. Draw a rectangle of the width you want your scroll bar to be, and make sure that its height is about the same as your dynamic text field. Line it up just to the right of your text field. Convert it to a movie clip symbol and assign it an instance name of "scroll_track".

We'll also add some code to this movie clip. In the actions layer of the first frame, just put

stop();
In the second ("scroll_loop") frame, put
play();
We'll add a little more to this later. And in the last frame put
gotoAndPlay("scroll_loop");
Now go back to the root level one more time, and we'll add some code there. In the functions layer, put the following:

function showText(message) {
	main.w_field.text = message;
	if (main.w_field.maxscroll <%gt%> main.w_field.scroll) {
		main.gotoAndPlay("scroll_loop");
	}
}
And in the actions layer, put this code:
my_text = "Put lots of text here, or the scroll bar won't show up!";
showText(my_text);
stop();
We're setting this up in a way that the scroll bar is only visible when the text field has more lines than can be diplayed at one time.

» Level Advanced

Added: 2002-03-23
Rating: 7 Votes: 116
(10 being the highest)
» Author
I have been flashing for almost two years, first at an online learning company and now at a university. My dream is to one day work for Macromedia as an ActionScript Engineer!
» Download
Download the files used in this tutorial.
» Forums
More help? Search our boards for quick answers!

Comments

  • There are no comments yet. Be the first to comment!

  • You must have javascript enabled in order to post comments.

Leave a Comment
  • Your email address will not be published. All fields are required.
Featured Flash FLA
» Author: doc_chin7
» Description:

The flash's horizontal road drive was done in CS4 and was upgraded to CS6. The car responds to right/ left key and flash will auto-generate the movement of roads from left-right or right-left based on random number. Have fun driving in this virtual environment and avoid other cars... :) If you are creative, a road driving game can be created from it.

Featured Sound Loops
Image for equalize

Audio Player

» Author: BoxCat
» Title: CPU Talk
» Description: From the cyberpunk RPG, "Nameless: the Hackers" Completely Free to use! Keywords: edm hip hop rap electronic mysterious mission hacking chase exciting spy ios ambient chilling love happy sad angry suspense
Latest Font
» Author: Fábio FAFERS
» Description: I created this font for free use. Everyone can apply it in personal or business texts. Its free, but I want to be communicated in case of business use. Donations are accepted to keep the project of free fonts alive! Thank you all
Featured Sound Fx
Image for equalize

Audio Player

» Author: nathan
» Description:

A recorded sound of the Dimensional Fork Gate.