Wikia

WoWWiki

UIOBJECT SimpleHTML

Talk0
102,225pages on
this wiki
Revision as of 17:59, September 16, 2013 by Celess22 (Talk | contribs)

(diff) ←Older revision | Latest revision (diff) | Newer revision → (diff)
Widget API < SimpleHTML

SimpleHTML widgets allow display of simple HTML markup as well as standard escape sequences. The two may be combined; if HTML is not valid (not well-formed XHTML), it will be displayed literaly.

Note: SimpleHTML appears to have all the methods of FontInstance, and they can indeed be used in the same way to set the default font, but they all have an optional first parameter for which element's font to set ("h1", "h2", "p", etc). The Font instance methods are not reflected in the SimpleHTML frame until you SetText on the frame. It also appears that you can only supply the block elements and not the inline elements (ie Hyperlinks cannot be colored a different color). Other than that, see FontInstance for documentation of these methods.

Supported HTMLEdit

The following HTML tags are supported:

h1, h2, h3, p
<(h1|h2|h3|p) [align="(left|center|right)"]>...</(h1|h2|h3|p)>
Text containers; following optional attributes are supported:
  • align - (left, center, right) controls positioning of the text element,
img
<img src="IMAGE_SOURCE" [align="(left|center|right)"] [width="NUM"] [height="NUM"] />
Image, only outside of text containers; following attributes are supported:
  • align - (left, center, right) controls positioning of the image.
  • width - (number) width of image in pixels.
  • height - (number) height of image in pixels.
  • src - (string) image source, for example Interface\Icons\Ability_Ambush
a
<a href="LINK">TEXT</a>
anchor (link only), only displayed inside text containers; following attributes are required:
  • href - (string) link to pass OnHyperLink* widget handlers
br
<br />
line break, no attributes.

Well-formed HTMLEdit

SimpleHTML will only display text as HTML if it is well-formed; the following conditions and quirks apply:

  • Tag names are case insensitive, img and iMg achieve the same result.
  • All tags must be closed; closing tags must match the case of the opening tag; some tags are self-closing (br, img).
  • Attribute values must be quoted; both double and single quotes are supported.
  • Quotes, less/greater than signs, and amperstands must be entity-escaped (&quot; &lt; &gt; &amp;). No other entity-escapes are supported.
  • Unrecognized tags are ignored entirely, even if they contain known tags inside; unrecognized attributes are ignored.
  • Document content must be enclosed in <html><body> </body></html> tags.

Standard escape sequencesEdit

SimpleHTML also supports the usual UI Escape Sequences, which can be used to change font color, or as an alternative syntax to specify hyperlinks.

Setting element stylesEdit

It is possible to set different fonts for the text-container elements (h1, h2, h3, and p), using SetFont:

SimpleHTML:SetFont('h1', GameFontHighlightLarge);

You can also define font properties for these elements in your XML files, eg:

<SimpleHTML ...>
 <FontStringHeader1 inherits="GameFontHighlightLarge"/>
</SimpleHTML>

Creation Using Pure LUAEdit

Creating a SimpleHTML object using pure LUA is very simple.

MySimpleHTMLObject = CreateFrame('SimpleHTML');

After, the creation of the object you can assign the HTML code to be displayed. But, there is one more required step!

MySimpleHTMLObject:SetText('<html><body><h1>Heading1</h1><p>A paragraph</p></body></html>');

For the SimpleHTML object to actual render the HTML code you gave it (or plain text) a font must be set.

MySimpleHTMLObject:SetFont('Fonts\\FRIZQT__.TTF', 11);

The literal number 11 specifies the size of the font.

ExampleEdit

The following is an example of a combination of HTML markup and UI Escape Sequences, as well as custom element styles; the code below was passed to SimpleHTML:SetText() to generate the image on the right.

SimpleHTMLExample

The finished product

<html><body>
<h1>SimpleHTML Demo: Ambush</h1>
<img src="Interface\Icons\Ability_Ambush" width="32" height="32" align="right"/>
<p align="center">|cffee4400'You think this hurts? Just wait.'|r</p>
<br/><br/>
<p>Among every ability a rogue has at his disposal,<br/>
Ambush is without a doubt the hardest hitting Rogue ability.</p>
</body></html>

Around Wikia's network

Random Wiki