This content requires Flash

To view this content, JavaScript must be enabled, and you need the latest version of the Adobe Flash Player.

Download the free Flash Player now!

So now, in Library, we have a Join Movie Clip and this is going to be a screen that is going to appear when they use these dots. So, let us go and edit that Join Movie Clip from the Library. We can just right mouse click on the Join Movie Clip in the Library and select Edit. So now, we are inside the Join Movie Clip. Remembering from previous lessons that a Movie Clip is a special type of symbol that has its sign separate timeline so we can add content within that and that is totally interactive. This is going to be a form for the user to login into the game. We need to add a text level so I am going to grab our text tool from the tool bar on the left, click on the stage and here, we are creating an instance of a text field. Now, let us set some properties of this text field by the Property Inspector. We are going to change it to be a static text type because we do not want this text to change. The Property Inspector says that we are using arrow with the font and we are going to keep it that way and also I set it to ten.

You can use the color picker tool on the Property Inspector for text to choose what color the text is going to come at us. So, I am just going to use the one that is selected already but you could really choose any color that is going to look good against this background. And, we are just going to simply type the text that appears in this text field, we are going to type in Enter Your Name. So, let us choose our selection tool again and reposition this text field at an exposition to zero and wide position of zero as well by the Property Inspector. There we go! You might notice something though up in the timeline in the top of the screen. We have the top layer selected when we created that text field so what it has done is it put that text field into that layer and we can see that by the solid circle indicator. You see the other three layers? That got empty key frames. Let us just reselect that text field, right mouse click and we can choose Cut. Now, select the Enter Your Name layer and we can use the Edit, Paste in Place option to put it back exactly where it was before. That is better. And now, we have it on the right layer.

We are going to create the user input field now for our form. Let us just deselect that into Your Name text field. I am just going to click on the stage. I am going to reselect my text tool button. I am actually going to change the properties of the text field before I draw it on the stage. So, this time, we want to create an input text field. We are going to layout. The font, the size and the color are the same but we are going to choose a new option now for input text field and that show border. Now, my stage, I am going to drag the shape of the text field and there we have it. You can see with the text field that when you draw them, you can grab the corners or the sides and reshape them to however big you want them to be. I am just going to grab the bottom corner and drag it upward. Now, I am going to choose my selection tool again and reposition this text field by the X and Y on the Property Inspector. I am going to put in X — 0 and Y — 15. The one thing that is missing is the Submit Button and we already have one of those created force in our Library. So, we are just going to select that join button layer so they drop it on the right place, grab the instance of the join button click out of the Library and drag on to the stage. We are going to use the Property Inspector to position this button for us at our X position of 112 and Y - 36.

Probably just to neaten things up, we will extend the length of that input text field so that it matches the Join Button so that we can double click on it and drag in the button right hand corner up to the right just to match out. That looks better. Now, we want to interact with the Join button through action script so of course, we need to get it an instance name. Let us select the Join button again and down in the Property Inspector, we are given an instance name of join_btn which is the name in convention for a button. We need to also go back and give

So now, in Library, we have a Join Movie Clip and this is going to be a screen that is going to appear when they use these dots. So, let us go and edit that Join Movie Clip from the Library. We can just right mouse click on the Join... click to read more