KB-9 Customize flash text area's with the setstyle function (2014 - OBSOLETE)

Content

I have been asked a from time to time about how to personalize individual text area's or input boxes by developers. The answer as always is that it depends. If you have worked with flash before then you are use to the IntelliSense giving you hints as to what options are available for each UI component. This works well if you are customizing a textfield, however if you are working with a textinput or textarea box's (as most people do) the same _txt.backgroundColor and _txt.textColor show up in IntelliSense but make no change to the desired UI. Frustrating I know. The difference is the simple textfield is a simple display box and the textarea and textinput are pre-compiled, skinned components. That is where the setStyle function comes into play. This same function is used to modify any number of parts in just about all pre-compiled UI, but we will stick with the text for now.

 

SetStyle is a simple function consisting of 2 passed parameters:

  1. The style name to be modified, as a string.

  2. The value to change the style to, as an object.

The only hard part I have heard from people using this function is knowing what to send because there is no IntlleSence for this function, but with a little google searching and common sense you should be able to figure out what to send for each style name. For starters here is a link to help the searching click the styles option at the top right to see the available styles - make sure to click Show Inherited Styles so you see styles the control inherits from its base class. To use the function start with the instanceName of your UI we will call it ui then just call the function ui.setStyle(“backgroundColor”, 0xFF0000) this will change the backgroundColor of the UI text to turn red, or ui.setStyle(“fontSize”, 20) will give a you a 20 sized text. The link above will list the rest of the style names but they are all used the same way. One last quick code hint, if you have a style you want all of you UI's to follow use _global.style instead of the UI instance name for the setStyle() function and have the function run up front this will affect all the UI's so there is no need to type the code in for every UI.

Add Feedback