blob: 529a12c71033cda4c37f2fad309fefe0340ff229 [file] [log] [blame]
{ "type": "class",
"qname": "spark.components.Label",
"baseClassname": "spark.components.supportClasses.TextBase"
,
"description": "Label is a low-level UIComponent that can render one or more lines of uniformly-formatted text. The text to be displayed is determined by the <code>text</code> property inherited from TextBase. The formatting of the text is specified by the element's CSS styles, such as <code>fontFamily</code> and <code>fontSize</code>. <p>Label uses of the Flash Text Engine (FTE) in Flash Player to provide high-quality international typography. Because Label is fast and lightweight, it is especially suitable for use cases that involve rendering many small pieces of non-interactive text, such as item renderers and labels in Button skins.</p> <p>The Spark architecture provides three text &quot;primitives&quot; -- Label, RichText, and RichEditableText -- as part of its pay-only-for-what-you-need philosophy. Label is the fastest and most lightweight, but is limited in its capabilities: no complex formatting, no scrolling, no selection, no editing, and no hyperlinks. RichText and RichEditableText are built on the Text Layout Framework (TLF) library, rather than on FTE. RichText adds the ability to render rich HTML-like text with complex formatting, but is still completely non-interactive. RichEditableText is the slowest and heaviest, but can do it all: it supports scrolling with virtualized TextLines, selection, editing, hyperlinks, and images loaded from URLs. You should use the fastest one that meets your needs.</p> <p>The Spark Label control is similar to the MX Label control, mx.controls.Label. The most important differences are: <ul> <li>Spark Label uses FTE, the player's new text engine, while MX Label uses the TextField class.</li> <li>Spark Label offers better typography, and better support for international languages, than MX Label.</li> <li>Spark Label can display multiple lines, which MX Label cannot.</li> <li>MX Label can display a limited subset of HTML, while Spark Label can only display text with uniform formatting.</li> <li>MX Label can be made selectable, while Spark Label cannot.</li> </ul></p> <p>In Spark Label, three character sequences are recognized as explicit line breaks: CR (<code>&quot;\\r&quot;</code>), LF (<code>&quot;\\n&quot;</code>), and CR+LF (<code>&quot;\\r\\n&quot;</code>).</p> <p>If you don't specify any kind of width for a Label, then the longest line, as determined by these explicit line breaks, determines the width of the Label.</p> <p>If you do specify some kind of width, then the specified text is word-wrapped at the right edge of the component's bounds, because the default value of the <code>lineBreak</code> style is <code>&quot;toFit&quot;</code>. If the text extends below the bottom of the component, it is clipped.</p> <p>To disable this automatic wrapping, set the <code>lineBreak</code> style to <code>&quot;explicit&quot;</code>. Then lines are broken only where the <code>text</code> contains an explicit line break, and the ends of lines extending past the right edge is clipped.</p> <p>If you have more text than you have room to display it, Label can truncate the text for you. Truncating text means replacing excess text with a truncation indicator such as &quot;...&quot;. See the inherited properties <code>maxDisplayedLines</code> and <code>isTruncated</code>.</p> <p>You can control the line spacing with the <code>lineHeight</code> style. You can horizontally and vertically align the text within the element's bounds using the <code>textAlign</code>, <code>textAlignLast</code>, and <code>verticalAlign</code> styles. You can inset the text from the element's edges using the <code>paddingLeft</code>, <code>paddingTop</code>, <code>paddingRight</code>, and <code>paddingBottom</code> styles.</p> <p>By default a Label has no background, but you can draw one using the <code>backgroundColor</code> and <code>backgroundAlpha</code> styles. Borders are not supported. If you need a border, or a more complicated background, use a separate graphic element, such as a Rect, behind the Label.</p> <p>Label supports displaying left-to-right (LTR) text such as French, right-to-left (RTL) text such as Arabic, and bidirectional text such as a French phrase inside of an Arabic paragraph. If the predominant text direction is right-to-left, set the <code>direction</code> style to <code>&quot;rtl&quot;</code>. The <code>textAlign</code> style defaults to <code>&quot;start&quot;</code>, which makes the text left-aligned when <code>direction</code> is <code>&quot;ltr&quot;</code> and right-aligned when <code>direction</code> is <code>&quot;rtl&quot;</code>. To get the opposite alignment, set <code>textAlign</code> to <code>&quot;end&quot;</code>.</p> <p>Label uses the TextBlock class in the Flash Text Engine to create one or more TextLine objects to statically display its text String in the format determined by its CSS styles. For performance, its TextLines do not contain information about individual glyphs; for more info, see flash.text.engine.TextLineValidity.STATIC.</p> <p>The Label control has the following default characteristics:</p> <table class=&quot;innertable&quot;> <tr><th>Characteristic</th><th>Description</th></tr> <tr><td>Default size</td><td>0 pixels wide by 12 pixels high if it contains no text, and large enough ti display the text if it does</td></tr> <tr><td>Minimum size</td><td>0 pixels</td></tr> <tr><td>Maximum size</td><td>10000 pixels wide and 10000 pixels high</td></tr> </table> attributes of its superclass and adds the following tag attributes:</p> <pre>\\n &lt;s:Label\\n <strong>Styles</strong>\\n alignmentBaseline=&quot;baseline&quot;\\n baselineShift=&quot;0&quot;\\n cffHinting=&quot;0.0&quot;\\n color=&quot;0x000000&quot;\\n digitCase=&quot;default&quot;\\n digitWidth=&quot;default&quot;\\n direction=&quot;ltr&quot;\\n dominantBaseline=&quot;auto&quot;\\n fontFamily=&quot;Arial&quot;\\n fontLookup=&quot;embeddedCFF&quot;\\n fontSize=&quot;12&quot;\\n fontStyle=&quot;normal&quot;\\n fontWeight=&quot;normal&quot;\\n justificationRule=&quot;auto&quot;\\n justificationStyle=&quot;auto&quot;\\n kerning=&quot;false&quot;\\n ligatureLevel=&quot;common&quot;\\n lineBreak=&quot;toFit&quot;\\n lineHeight=&quot;120%&quot;\\n lineThrough=&quot;false&quot;\\n locale=&quot;en&quot;\\n paddingBottom=&quot;0&quot;\\n paddingLeft=&quot;0&quot;\\n paddingRight=&quot;0&quot;\\n paddingTop=&quot;0&quot;\\n renderingMode=&quot;cff&quot;\\n textAlign=&quot;start&quot;\\n textAlignLast=&quot;start&quot;\\n textAlpha=&quot;1&quot;\\n textDecoration=&quot;start&quot;\\n textJustify=&quot;interWord&quot;\\n trackingLeft=&quot;0&quot;\\n trackingRight=&quot;00&quot;\\n typographicCase=&quot;default&quot;\\n verticalAlign=&quot;top&quot;\\n /&gt;\\n </pre>",
"tags": [
{ "tagName": "includeExample",
"values": ["examples/LabelExample.mxml"]},
{ "tagName": "see",
"values": ["spark.components.RichEditableText", "spark.components.RichText", "flash.text.engine.TextLineValidity#STATIC"]},
{ "tagName": "mxml",
"values": ["<p>The <code>&lt;s:Label&gt;</code> tag inherits all of the tag"]},
{ "tagName": "playerversion",
"values": ["Flash 10", "AIR 1.5"]},
{ "tagName": "productversion",
"values": ["Royale 0.9.4"]},
{ "tagName": "langversion",
"values": ["3.0"]} ],
"members": [
{ "type": "method",
"qname": "spark.components.Label",
"namespace": "",
"bindable": [],
"details": [],
"deprecated": {},
"description": "Constructor.",
"tags": [
{ "tagName": "playerversion",
"values": ["Flash 10", "AIR 1.5"]},
{ "tagName": "productversion",
"values": ["Royale 0.9.4"]},
{ "tagName": "langversion",
"values": ["3.0"]} ],
"return": "",
"params": []}
,
{ "type": "accessor",
"access": "read-write",
"return": "Object",
"qname": "verticalAlign",
"namespace": "public",
"bindable": [],
"details": [],
"deprecated": {}},
{ "type": "accessor",
"access": "read-write",
"return": "String",
"qname": "digitWidth",
"namespace": "public",
"bindable": [],
"details": [],
"deprecated": {}},
{ "type": "accessor",
"access": "read-write",
"return": "String",
"qname": "textDecoration",
"namespace": "public",
"bindable": [],
"details": [],
"deprecated": {}},
{ "type": "accessor",
"access": "read-write",
"return": "Number",
"qname": "measuredWidth",
"namespace": "public",
"bindable": [],
"details": ["override"],
"deprecated": {},
"description": "",
"tags": [
{ "tagName": "private",
"values": []} ]},
{ "type": "accessor",
"access": "read-write",
"return": "Number",
"qname": "measuredHeight",
"namespace": "public",
"bindable": [],
"details": ["override"],
"deprecated": {},
"description": "",
"tags": [
{ "tagName": "private",
"values": []} ]}]
}