Using the Text tool for TLF text
Using the Text tool for TLF text
You can create text in Flash by using the Text tool. In this movie, we'll look at using the Text tool to create Text Layout Framework style text. So on the Stage here, I have some artwork and I am going to add text to it. I'll do that by selecting the Text tool in the toolbar. Then for the Text engine in the Properties panel, I'll choose TLF Text and for the Text type I'm going to choose Read Only. Read Only is a good option if you are doing text for something like a logo that you don't want to be selected. Before I start writing, I am going to make sure that I am using horizontal text.
That's the Orientation dropdown right next to the Text type drop-down at the top of the Properties panel. Then in the Character section, I am going to choose Adobe Caslon Pro for my font. If you don't have that font, feel free to use anything you'd like. Then I am going to leave everything at the default except for the Paragraph Align setting, which I am going to set to Justify with last aligned to center. I'll click at the bottom center of the Stage. I am going to write 'Taste of' and then I am going to create a new line by pressing the Return key or Enter key and I am going to type California.
To stop typing in Flash, I press the Escape on the keyboard, which gets me out of Text Editing mode, and then I can use the Selection tool and move the text around. I am going to move the text up a little bit. It looks a little off-centered and rather than just eyeballing it, I am going to use the Align tool and just align it to the center of the Stage. So there's my text. Now we'll go over some of the other settings for the Text Layout Framework. Keep in mind that I'm not going to demonstrate every single setting for the Text Layout Framework in this movie.
I am just going to show you the most common ones that you'll be using when you're working in Flash. So I have my text selected. I am going to scroll down. In the Character setting, there is Leading and Tracking. Leading specifies the space between lines. So as I click-and-drag this back-and-forth, you can see California moving up and down. Tracking specifies the space between letters. So as I click-and-drag, you can see more space or less space between letters. Kerning controls the different space between letters based on the letter.
Some fonts have information about how each letter should fit with each other letter. So Kerning controls that and you can set it to Auto or On or Off. Most of the time you are going to want to Auto Set. You really don't want to mess with this if letters kind of look weird at displaying in Flash. So I really just leave that on Auto for the most part. Anti-aliasing allows you to control how text is anti-aliased. That means how it's smoothed. So you can choose for Readability, which is better for smaller fonts, or Animation, which is better for larger fonts.
We'll talk about device fonts in another movie. You can also set text field rotation and some other style settings like underline, strikethrough, superscript and subscript. In the Advanced Character section of the Properties panel, you can control things like the link. If you want this text to link to a URL you can put the URL in right here. Here, you can specify the case of the text and this is actually pretty useful because I would like my text right now to be all upper case, so I can set it like that. Then you can set the case for digits, so I can specify how the digits line up across the baseline of the text and how digits are spaced apart using digit width.
Dominant and Alignment Baseline are settings for Asian text, so I am going to skip over that for now. You can control how ligatures are displayed, with Minimum displaying no ligatures and Exotic displaying the most ligatures. You can control how the lines break. So I can break with each character or I can break based on the width of the text field. I am just going to choose Auto for there. I can move the baseline of the text. You can change the paragraph alignment. There are different settings for justifying lines of text.
So when you justify the text you can decide how the last line is displayed and then you can justify all lines. I am going to go back to Justify with last line aligned to center. You can control margins and spacing for paragraphs. You can choose to justify text using letters or words. Then when you have multiline text, you can choose whether text wraps around multiple lines when you have a text-box or you can choose whether it's a single line and it never creates a new line. With the Text Layout Framework, you can create columns of text and space the columns.
You can control the padding inside of the text field. If you click the Link button, you can keep the padding uniform with left, right, top, and bottom padding all being the same. I am going to set the padding back to 0. You can control border color of the text and a background fill color. I am going to set both of those to no color right now. Those are the main settings you are going to be working with, with the Text Layout Framework. So let's say you wanted to do something practical like make both of these lines of text take up the same amount of width in the text field.
To do that, I am just going to shrink the font size of the text that says California. So I am going to double-click inside of the text field to enter Text Editing mode. Then I am going to double- click the word California. You could see now that it's highlighted inside of the text box. So I am going to click-and-drag the Size drop-down until California is the same size as Taste of. I'll release my mouse button and there is my text. Now, if I want to make sure that it's aligned to the bottom rectangle, I can select the bottom rectangle, Shift- Click the text, and then use the Align panel to make sure they are aligned.
Before I do that, I am going to make sure to uncheck Align to Stage. So I am going to align the horizontal and vertical centers. There is the text on the Stage with my artwork. So to use the Text Layout Framework use the Text tool, choose TLF Text, and you can justify all of your settings in the Properties panel.
ActionScript 3.0 in Flash Professional CS5 Essential Training1,095,127 Views
Introduction to Flash Animation136,359 Views
Best Practices for Flash-based Banner Ads260,958 Views
Flash Professional CS6 Essential Training1,404,491 Views
Up and Running with Flash Professional186,227 Views
Illustrator CC 2013 One-on-One: Fundamentals1,678,359 Views
After Effects CC Essential Training2,632,490 Views
Edge Animate Essential Training632,647 Views