Bulleted Text with CSS in Flash
| Category | : Flash | Views | : 15604 | ||
| Version | : 8 | Rating | : | ||
| Type | : Text | Source File | : bulleted-text-with-css-in-flash.zip | ||
| Result | : See the result | ||||
This is done in the text field and the bullet is a simple Movie Clip.
Create you bullet Movie Clip and draw it like you want, I made four different bullets as examples:
Set the identifier for you bullet, I am going to use the square one, so my identifier will be "square".
Open the actions for the first frame in the main timeline and paste:
_root.createTextField("textBox", 33, 100, 100, 300, 300);
//let our text box have more than one line
textBox.multiline = true;
//wrap the text if it's too big
textBox.wordWrap = true;
//allow the use of html or CSS
textBox.html = true;
textBox.htmlText="<img src='square' vspace='5' hspace='10'>
Item 1</textformat><br><br>
<img src='square' vspace='5' hspace='10' >Item 2
</textformat><br><br><img src='square'
vspace='5' hspace='10' >Item 3</textformat>
<br><br><img src='square' vspace='5' hspace='10' >
Item 4 </textformat><br><br>";
In the first line we created a text box with these parameters:
_root.createTextField("name", depth, _x, _y, width, height);
You have to make the width and height big enough to fit all of our text.
In the last part of the code where we set the hmltText of our text box we used some CSS code:
//this is the code for the first item
<img src='square' vspace='5' hspace='10' >Item 1</textformat><br><br>
For the image source we used "square", which is the identifier of the bullet Movie Clip. "vspace" and "hspace" is used just to centralize the bullet with the text.
The rest of the CSS code is the same thing, just change the text between the tags or the identifier if you want to use different bullets:
To use this you always have to dynamically set the text or it won't work.
More cool tech articles from other blogs.
