Learn how to Create a Text Field in Adobe Flash CS3 ActionScript 3

Learn how to create a Text Field in Adobe Flash CS3 ActionScript 3.

Now in this chapter we are going to be looking at text fields once again, but we are going to be looking at them from the formatting and display side of things. Now I have got a file that we can work on, all setup in our Chapter 02 folder. So let's get things started by taking a looking at that file. I am going to up to the File Menu and choose Open and we are going to go to our Chapter 02 folder and we are looking for a file called oceanRowSolo. Let's open that one up. Now I have actually used materials from this website in some of my other series, but this is a website for a friend of mine WAVE Vidmar who is an intrepid explorer running around the world doing very dangerous things and his next project this year is rowing across the Atlantic solo; a little crazy if you ask me. But we are putting together a website that's going to describe his expedition and even track some of his progress and we will be seeing content from this website in some of the later chapters. Now what we are going to be concentrating on here is just the Welcome page and as you can see we have got this big area here ready for some content to be dropped right on it. Now if we were doing this in the authoring environment we would just grab the Text Tool, drag out a text field and start typing text in. But this website is going to be fairly dynamic and it's going to want a lot of different updates. We are going to have to have updates on content, progress, all kinds of things as the expedition goes on. So to make the site much, much easier to be able to update, we want to dynamically create the content. Now that means, later on, we will be focusing on loading that content in. But for right now, I want to take a look at just creating the text fields dynamically and controlling all the look and formatting of those text fields using ActionScript instead of the authoring environment. Now since we will be talking about loading later, I have got the main data that we are going to be using. Already typed into the ActionScript Panel, up here in the first frame of the AS main layer. So let's select that layer, open up our Actions Panel and we will take a look at what we have got to work with. I will even pin this script since we are going to be coming back here frequently. Now we have got one string dropped in, that's going to be our Page Content and one labeled to Quote Content. But the first one is pretty long and it runs right off the edge of the screen. So the first thing I am going to do is setup my Actions Panel by turning on the Word Wrap setting and that will make sure that we can at least see all the lines of text without having to scroll off to the right. Now we have a better understanding of how this is going to work. We have got a big long page content string that welcomes users to the site and gives a brief introduction of what the site is going to be about. Also, throughout the site, WAVE likes to sprinkle in inspiring quotes and the one that goes on the front page is one by Henry Ford and we have got that loaded in as our quote content string. Now the first thing we want to do is create text fields for both of these text elements, place them on the screen and setup all the values, but once again, we are not going to be using the normal property panel to do this. Now in ActionScript 3, you create text fields using ActionScript a little bit differently. Back in ActionScript 2, we had special helper methods that created text fields for us, but in ActionScript 3, we create them just like we create every other object in the program.