Versions Compared
Key
- This line was added.
- This line was removed.
- Formatting was changed.
Table of Contents |
---|
Description
The info widget is a versatile labelled widget that can be used to output text. It supports both binding to a unit variable or function and displaying of lang file values directly.
The title is specified as a key to a lang file entry and is required. A tooltip can also be specified as a key to a lang file entry but is optional. Visibility bindings are also supported.
Example
Using the Input Widget with a Lang File Entry
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<info label="info.welcome" tooltip="info.welcome_tooltip" value="info.system_admin_welcome"/> |
Code Block | ||
---|---|---|
| ||
info.welcome = Welcome: info.welcome_tooltip = A welcome message info.system_admin_welcome = Welcome to your landing page |
Info |
---|
Displaying Dynamic Values Using the Lang File
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<info label="info.welcome" value="info.system_admin_welcome"/> |
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
unit SystemAdminHome; . . string firstName; string lastName; void init() { currentSystemAdminUser = SystemAdmin:user(); firstName = currentSystemAdminUser.firstName; lastName = currentSystemAdminUser.lastName; } |
Code Block | ||||
---|---|---|---|---|
| ||||
info.welcome = Welcome: info.system_admin_welcome = Welcome {SystemAdminHome:firstName} {SystemAdminHome:lastName} |
Info |
---|
Using the Input Widget with a Binding
Code Block | ||||
---|---|---|---|---|
| ||||
<info label="info.email_address"> <binding function="getSystemAdminEmailAddress"/> </info> <info label="info.mobile_number"> <binding variable="currentSystemAdminUser"> <attribute name="mobileNumber"/> </binding> </info> |
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
SystemAdmin currentSystemAdminUser; void init() { currentSystemAdminUser = SystemAdmin:user(); . . } // Return the mobile number of the current System Admin user string getSystemAdminMobileNumber() { return currentSystemAdminUser.mobileNumber; } // Return the email address of the current System Admin user string getSystemAdminEmailAddress() { return currentSystemAdminUser.emailAddress; } |
Code Block | ||||
---|---|---|---|---|
| ||||
info.email_address = E-mail address: info.mobile_number = Mobile number: |
Info |
---|
Markdown
The info widget can be allowed to render markdown using the optional "allowMarkdown" attribute. Markdown can be used to create hyperlinks or to otherwise style the text in the info widget.
Code Block | ||||
---|---|---|---|---|
| ||||
<info label="info.welcome" value="info.system_admin_welcome" allowMarkdown="true"/> |
The following text in an info widget that allows markdown will create a hyperlink.
Code Block | ||||
---|---|---|---|---|
| ||||
[Mezzanineware](https://mezzanineware.com) |
Background color
You can change the background color of the infobox to the following types:
Image Added
Code Block | ||||
---|---|---|---|---|
| ||||
<info label="info.example" allowMarkdown="true" cols-md="3" cols-xs="12" variant="clear">
<binding function="getBackgroundTextClear"/>
</info> |
The variant types can be: clear, info, warning and error
Additional Mentions and References
- Devoted sections in the Helium Tutorial Lesson 1: A Basic Helium App for simple info widget usage and more complex info widget usage.
- Helium DSL and View Quick Reference