Displays a block of HTML formatted text which has different styles, hyperlinks and images.
Save time and effort. The HTML article component makes it easy to re-use content and to link to other web resources.
- Breaks and paragraphs <br> <p>
- Basic formatting: italic, bold, emphasised, strong. <i> <b> <em>
- Headings <h1> <h2> <h3>
- Preformatted text <pre>
- Images can come either from the web, using an HTTP link, or locally in your project images folder, using just a filename .
- Tables including col and row spans. <table>
- Lists <ol> <ul>
This component does not support the following tag.
- Relative URL
Supported CSS properties
- Font names, size, color and styling: font-family, font-size, color, background-color, font-weight, font-style.
- Borders, margins and padding.
- Text alignment
We recommend you don’t use CSS for layout beyond these properties. This component is designed for displaying content, rather than controlling the layout, for which you use the facilities of Umajin itself.
Please refer “HTML – CSS selector and properties support” page for more detail.
Properties for HTML Article
|Name||When components are placed on a page they appear highlighted blue in the scene tree and can be renamed by double clicking in this panel and typing the new name. Components can also be set to be visible/invisible on the page, using the ‘eye’ icon on this panel.|
|Position and Size||Sets position and size. As long as measurements are maintained as percentages it deals automatically with dynamic layout and resizing for different devices and orientations. You can use millimeters to control aspects of size like width or height on order to create an article whose size will be maintained across devices.|
|Appearance||Set the look of the text on the page.|
|HTML||Use the text panel popup to write or copy HTML code into the Text Editor.|
|HTML file||Use the folder to locate your .html file|
|HTML Scale||Slider ranging from 0.5 to 5 alters size|
|Resize Type||Dropdown to select ‘Scale with screen’,’Pixels’, or ‘Scale with point’ as the resizing mode.|
‘Millimeters’ is fixed size in pixels.
‘Scale with screen’ maintains relative to app proportions. (Default)
‘Scale with point’ same as ‘Scale with screen’, but then scaled for correct point size.
|Resize to Content||When the box is checked the text will reflow vertically to fit in all the original content.|
The HTML Article Component has 2 specific events associated with it:
- On URL Clicked – could add an Action such as ‘Show Web Page’ which would activate any web page links in the HTML content. Can add multiple actions for different links.