break | continue | else | elseif | if | repeat | while
a | advance | body | br | div | footer | header | image | li | link | list | p | page | svg | use
call | debug | editdef | focus | include | index | inject | parse | print | script | template | trigger
button | checkbox | combobox | input
Breaks out of any repeat or while loop.
Skips to the end of the current repeat or while loop, then re-evaluates the loop conditions before restarting.
Pair with the if element to execute a branch if former if and elseif branches haven't executed.
The else element can paired with the if element to execute a branch when former if and elseif branches haven't executed.
If not declared in series with a previous if statement, the element is ignored by the parser.
Pair with the if element to evaluate a statement and execute a branch - but only if former if and elseif branches haven't executed.
| Attrib | Type | Description |
|---|---|---|
| exists | object | Tests if the referenced object still exists and executes the branch if it does. |
| isnull | string | Tests if the value is null. The test will pass if the value is 0, an empty string, or only containing whitespace. |
| not | boolean | Reverses the result of the conditional test. |
| notnull | string | Tests if the value is not null. The test will pass if the value is a number other than 0 or has content (whitespace does not count as content). |
| statement | string | Tests the conditional statement and executes the branch if it evaluates to true. |
The elseif element is paired with the if element to evaluate a conditional and execute its branch - but only if former if and elseif branches haven't executed.
Only one of the statement, exists, isnull and notnull attributes may be used for conditional testing. The not attribute can be combined with any of these to reverse the conditional result.
Please refer to the if element for further documentation.
Evaluates a simple conditional statement and executes the encapsulated code if the statement is true.
| Attrib | Type | Description |
|---|---|---|
| exists | object | Tests if the referenced object still exists and executes the branch if it does. |
| isnull | string | Tests if the value is null. The test will pass if the value is 0, an empty string, or only containing whitespace. |
| not | boolean | Reverses the result of the conditional test. |
| notnull | string | Tests if the value is not null. The test will pass if the value is a number other than 0 or has content (whitespace does not count as content). |
| statement | string | Tests the conditional statement and executes the branch if it evaluates to true. |
The if element is used to evaluate conditional statements and then act on the result. It can be paired with the elseif and else elements to create complex decision making trees during document processing.
Only one of the statement, exists, isnull and notnull attributes may be used for conditional testing. The not attribute can be combined with any of these to reverse the conditional result.
The following example illustrates the construction of a complete if statement and alternative branches:
<if statement="[@hello] = World">
<debug msg="if statement executed."/>
</if>
<elseif statement="[@hello] = Hello">
<debug msg="elseif statement executed."/>
</elseif>
<else>
<debug msg="else statement executed."/>
</else>Currently, only simple conditional statements can be tested. Supported conditions are =, >, <, >=, <=, != and <>. Complex conditionals involving parentheses and the use of and and or operators is not possible. Numbers can be tested against each other, as can strings. If more complex decision making is required in your document, we recommended that you use a script on those occasions.
Repeats a section of code for a specific number of times.
| Attrib | Type | Description |
|---|---|---|
| count | integer | Defines a fixed number of times for the repeat loop to execute. Overrides the end attribute. |
| end | integer | Defines a non-inclusive end-point at which the repeat loop must stop. Ignored if the count attribute has been set. |
| index | string | Declares the name of a global variable that will store the repeat loop's index while it is processed. |
| start | integer | A starting value for the repeat loop may be set with this attribute. The default is 0. |
| step | integer | Sets a stepping value other than the default of 1. This is added to the starting index until the loop is satisfied. Can be negative for reversing the loop. |
The repeat element is used to repeatedly execute sections of document code for a fixed number of times. It is useful for data processing and compacting repeated areas of document content. At a minimum, the count or end attributes must be defined so that the required number of executions is known to the parser. A poorly defined repeat loop will be ignored by the parser.
During execution, the parser will store an incrementing index for each pass and this can be accessed with references to [%index]. Sometimes this can cause referencing problems if the loop is nested within other repeat or while loops. To resolve this, set the index attribute with a name and the index value will now be stored in a named global variable, accessible as [@your_index_name].
A loop can be broken at any time with the break element, and specific iterations can be skipped with continue.
This simple example prints the numbers 0 through 9 to the debug log:
<repeat count="10" index="counter">
<debug msg="[@counter]"/>
</repeat>| Attrib | Type | Description |
|---|---|---|
| exists | object | Tests if the object referenced in the value still exists. |
| index | string | Declares the name of a global variable that will store the repeat loop's index while it is processed. |
| isnull | string | Tests if the value is null. The test will pass if the value is 0, an empty string, or only containing whitespace. |
| not | boolean | Reverses the result of the conditional test. |
| notnull | string | Tests if the value is not null. The test will pass if the value is a number other than 0 or has content (whitespace does not count as content). |
| statement | integer | Tests a conditional statement that must evaluate to true, or the loop is broken. |
The while element is used to repeatedly execute sections of document code for as long as a conditional statement is satisfied. When the statement is no longer true, the loop will be broken.
During execution, the parser will store an incrementing index for each pass and this can be accessed with references to [%index]. Sometimes this can cause referencing problems if the loop is nested within other repeat or while loops. To resolve this, set the index attribute with a name and the index value will now be stored in a named global variable, accessible as [@your_index_name].
A while loop can be broken at any time with the break element, and portions of the code can be skipped by using continue.
| Attrib | Type | Description |
|---|---|---|
| author | string | The author(s) of the document. |
| copyright | string | Copyright and licensing information. |
| description | string | Custom description for the document |
| keywords | string | Relevant keywords in CSV format. |
| title | string | The title of the document (can be displayed in the browser window). |
The info element declares meta information about the document, such as the author and copyright details.
This HTML compatible element is used as a short-form for defining a hyperlink. Please refer to the link element for further details.
| Attrib | Type | Description |
|---|---|---|
| x | unit | Increases the cursor's horizontal position. |
| y | unit | Increases the cursor's vertical position. |
The advance element controls the position of the cursor during the parsing of a document page.
When the parser encounters an advance element, it will move the cursor by the number of pixels indicated by the x and y attribute values. The provided values must be positive, as it is not possible to move the cursor to an earlier point in the document.
| Attrib | Type | Description |
|---|---|---|
| clip-path | uri | Refer to an SVG clip definition to mask graphics outside of the clipping path. |
| cursor-stroke | painter | Defines an SVG stroke operation for the text cursor. |
| fill | painter | Defines the fill operation for the background. Set to 'none' to disable the background and make the document transparent. |
| font-face | string | Defines the default font face. |
| font-size | unit | Defines the default font size. |
| font-fill | painter | Defines the default font fill. |
| line-height | integer | Defines the default line height. |
| link | painter | The default fill for hyperlinked text can be defined here. Applies to URI-based hyperlinks only. |
| select-fill | painter | The default fill operation to use for a hyperlink when it has been selected (e.g. via tab key). |
| margins | string | The default size of all four page margins can be defined here. Specify four unit values in clockwise order, Left Top Right Bottom. |
| v-link | painter | The default fill operation for previously visited hyperlinks. |
| width | dimension | Declares the width of the page, either as a fixed pixel value, or as a percentage of the available viewing area. The default is 100% of the viewing area. |
The body element defines global page body attributes.
If the body contains user defined content, it will be used as a template through which page content may be displayed. For instance, one might want to create an appealing graphical frame for the borders of a page and display content within it. This could be achieved by creating a table in the body and then using an inject element in the cell where the page content is to be displayed.
The body is a root-level element and may not be declared inside a page.
Use div to structure the document in a similar way to paragraphs. Its main difference is that it avoids the insertion of paragraph start and end points and can be used to alter the attributes of an existing paragraph for a particular section of content.
Please refer to p for the full list of available attributes.
The footer is a special template that will be processed when the parser reaches the end of the page. The footer is a root-level element that will be applied to all pages in the file. It can be manually turned off for any given page by using the nofooter attribute in the page element.
The header is a special template that will be processed when the parser reaches the end of the page. The header is a root-level element that will be applied to all pages in the file. It can be manually turned off for any given page by using the noheader attribute in the page element.
| Attrib | Type | Description |
|---|---|---|
| fill | painter | The default fill operation applied to the link's text can be overridden by this attribute. |
| href | uri | The link will load the referenced URI in-place when activated. That is if the URI refers to a RIPL page, the document will load the new page and unload the current one. |
| hint | string | Attaches a hint to the hyperlink. This hint may be displayed to the user when the mouse pointer rests above the hyperlink. |
| on-click | function | The link will execute the referenced function when it is clicked by the user. |
| on-crossing | function | The link will execute the referenced function when the mouse cursor crosses in or out of its boundary. |
| on-motion | function | The link will execute the referenced function when the user moves the mouse cursor over it. |
| select | boolean | The link will be selected (given the focus) when the document is displayed. |
The link element defines a hyperlink that is attached to encapsulated content. The content may be in the form of text and/or visual object. When the user interacts with the hyperlink, it is activated. Hyperlinks can either activate a new URI location in-place, or execute a script function.
If both the href and on-click attributes have been defined in the element, the first definition will take precedence. It is not possible to have both a function and URI attached to one hyperlink for execution.
Parameters can be forwarded to a referenced function by attaching them to the link. All parameters must be listed inside the element and identified with the @ prefix. Parameters will be passed to the function in the order in which they are given. For example: <link on-click="function" @arg1="hello" @arg2="world"/>
It is also possible to set global variables when the hyperlink is activated (normally requires use of the set element). To set a global variable, use an underscore as a prefix to the variable name.
| Attrib | Type | Description |
|---|---|---|
| fill | painter | The fill operation to use for the bullet in bullet point lists. |
| indent | unit | When embedding lists, the indent value determines the amount of indentation the child list has from the parent. |
| type | lookup | Defines the type of the list, which affects the style of bullet points that are used for list items. Valid types are bullet, custom and ordered. |
| v-spacing | unit | Defines the amount of whitespace between list items. The default value is 1.0 and is used as a multiplier of the page's default line height. |
The list element defines a grouping of paragraphs that are accompanied with a bullet point for each item in the list.
| Attrib | Type | Description |
|---|---|---|
| aggregate | bool | For ordered lists only. If true, parent bullet values are prefixed to this one. |
| value | string | For custom lists, specify each bullet point's custom string value here. |
The li element is used to declare a new list item with encapsulated content. It's behaviour matches that of the p element and inherits the same attributes. The key difference is the addition of a bullet point that precedes the item content.
If the element belongs to a custom style list, the value attribute must be set with customised bullet point text. If not, the bullet point will remain empty.
| Attrib | Type | Description |
|---|---|---|
| align | string | Determines the alignment of content within the paragraph. The default is left. Valid values are left, center and right |
| font-size | unit | The size of the font for this paragraph. |
| font-face | string | The name of a font face for this paragraph. |
| font-fill | painter | The fill operation to use when rendering text. |
| font-style | string | Sets the font style to bold, italic or bold italic. |
| indent | unit | Indent the paragraph by this amount of whitespace. |
| kerning | unit | TBA |
| leading | unit | The leading ratio adjusts the amount of vertical white space that is inserted prior to the paragraph content. It has precedence over the v-spacing value. If no content precedes the paragraph, the leading value is ignored. This makes the leading ratio ideal for headlines, where no space is desirable at the top of the page, but is needed to clearly separate a headline from preceding content. |
| line-height | unit | Declares the vertical advance from one line to the next when a wordwrap occurs. Expressed as a multiplier, 1.0 is the default. |
| no-wrap | boolean | Deactivates word-wrapping. |
| trim | boolean | Eliminates any leading whitespace found at the start of the content. |
| v-align | string | top, center, bottom |
| v-spacing | unit | Adjusts the amount of vertical white space from one paragraph to the next. The value is expressed as a ratio of the default line height, which is specified in the body element. For example, a vspacing value of 1.5 is one and a half times the standard lineheight. The default vspacing value is 1.0. |
Paragraphs are used to encapsulate content. Vertical whitespace is inserted before and after the paragraph to separate content between other paragraphs and visuals. The amount of whitespace is controlled by the leading and v-spacing attributes.
If a paragraph is embedded within another paragraph element, a new line is inserted at the start of the opening element. The amount of whitespace is controlled by the newly declared paragraph.
Note: The RIPL parser treats li elements as paragraphs, making the two elements somewhat interchangeable when used within a list.
| Attrib | Type | Description |
|---|---|---|
| hidden | boolean | Marks the page as hidden. This will prevent %nextpage and %prevpage from recognising it. |
| name | string | A page name should be specified here for identification purposes. |
| no-footer | boolean | Turns off the default footer if one is specified in the document. |
| no-header | boolean | Turns off the default header if one is specified in the document. |
The page element is used to encapsulate an entire page of content that can be displayed to the user. In most cases a document file should consist of at least one page of viewable content. If multiple pages are defined, they should all be given names so that they can be referenced individually.
Pages can be defined anywhere within a document - they don't have to be at the root level. Pages can be nested, but the parser will ignore the content of any nested page that is encountered during the processing of another page.
To view a page other than the default, the document location needs to be set with the new page name. Most commonly this is achieved through hyperlinks - an href value of #PageName in a link element is sufficient. Specific pages can also be manually requested by setting the document URI correctly.
| Attrib | Type | Description |
|---|---|---|
| placement | string | Set to foreground (default) or background to target the inner page or viewing window respectively. |
This element can only be used once per document.
Use svg to execute an SVG document, targeting either the document's page or view according to placement. Inline placement is not possible.
The inclusion of SVG support is not intended for direct graphics rendering as such. Use it to create named resources that can then be referred to in the document (e.g. for fill operations), or via the use element for symbols. For inline rendering of embedded SVG graphics, the image element is suitable for this purpose.
The use element allows SVG <symbol> declarations to be injected directly into the parent viewport (e.g. table cells). SVG graphics that are created in this way are treated as dynamically rendered background graphics. Regular content will be laid directly over the top, with no clipping considerations.
If more sophisticated inline or float embedding is required, consider using the image element.
| Attrib | Type | Description |
|---|---|---|
| function | function | Required. Refers to the function that will be called. |
Use this element to call a function during the parsing of the document. All attributes other than function are treated as parameters, and will be passed to the function in order of appearance.
For convenience, it is possible to set variables for the target script by prefixing attribute names with an underscore. These will not be passed to the function.
To call a function that isn't in the default script, use the naming convention script.function.
| Attrib | Type | Description |
|---|---|---|
| msg | string | A message to be logged. |
The debug element sends messages to the application log during parsing of the document.
| Attrib | Type | Description |
|---|---|---|
| edit-fonts | bool | If true, allow the font style and face information to be changed. |
| edit-images | bool | If true, allow images to be edited, inserted or removed. |
| edit-tables | bool | If true, allow tables to be edited, inserted or removed. |
| edit-all | bool | If true, allow the user to perform all forms of editing, without restriction. |
| line-breaks | bool | If true, allow the user to add line breaks with the enter key. |
| max-chars | integer | Limit the number of characters to this value. |
| name | string | A unique name for the editing area. |
| on-change | function | Function to call whenever content changes. |
| on-enter | function | Function to call when the user activates the editing area (gains focus). |
| on-exit | function | Function to call when the user leaves the editing area (lost focus). |
| select-fill | painter | Use this fill operation when content in the editing area is selected. |
WORK IN PROGRESS
Defines an area that the user can edit with the text cursor. For use by editable table cells only.
This element tells the parser that the next viable element that can receive the user's focus will do so when the document is activated. This feature is commonly used as a precursor to widgets such as input boxes.
Any encapsulated content is ignored.
Note that for hyperlinks, the select attribute can also be used as a convenient means to assign focus.
| Attrib | Type | Description |
|---|---|---|
| src | uri | Required. Refers to the source file for loading. |
| volatile | boolean | Marks the src as volatile and forces the cache engine to always check if it has changed on document refreshes. |
Use the include element to load external RIPL files into your document. Bear in mind that parsing of the document will stop while the file is retrieved from its source.
| Attrib | Type | Description |
|---|---|---|
| name | string | The name of the index. |
Indexes are used to create bookmarks in a page. These bookmarks can be used for quickly advancing to a specific point on the page via hyperlinks. Another usage is to mark areas in the document that your scripts need to access for content modification purposes (the FindIndex() method is used for this purpose).
For use in templates only. Injects content from the caller into a specific area in the template.
| Attrib | Type | Description |
|---|---|---|
| value | string | An XML compliant string value to insert into the document stream. |
The parse element injects RIPL code into the document stream while it is being processed by the interpreter. This allows RIPL code to be dynamically generated or retrieved from an external source for inclusion in the document.
For the insertion of plain text, please use the print element.
| Attrib | Type | Description |
|---|---|---|
| value | string | String value to insert into the document stream. |
The print element is used to inject raw text into the document stream during parsing. This feature is typically used to create or retrieve dynamically generated content that is not constant.
For the insertion of RIPL markup, please use the parse element.
| Attrib | Type | Description |
|---|---|---|
| cache-file | string | This attribute may be used in trusting environments only. It allows the script to specify a file path to which the compiled script will be saved. The next time that the document is processed, the pre-compiled script will be loaded in order to skip the entire compilation process. |
| default | boolean | If true, sets this script as the default for the entire document (all function names will be directed to it unless fully qualified). |
| external | object | Refer to a script that already exists outside of the document, by name or UID. This attribute may be used in trusting environments only. |
| name | string | Defines a name for the script. |
| persistent | boolean | Declares that the script is persistent. In this mode, the script will survive refreshes. |
| src | string | Allows script code to be loaded from an external file source. |
| type | string | Declares the type of scripting language that is used for the code. The default is Fluid. |
By default, scripts are automatically compiled and activated when the parser encounters them in the document. If the script returns a result string, that result is assumed to be valid XML and is processed by the parser as such.
If the script contains functions, those functions can be called at any time, either during the parsing process or when the document is displayed.
The first script encountered by the parser will serve as the default source for all function calls. If you need to call functions in other scripts then you need to access them by name - e.g. myscript.function().
Please refer to the script programming section of the official RIPL reference guide for further information on programming with scripts.
| Attrib | Type | Description |
|---|---|---|
| name | string | The name of the template. |
Templates provide a powerful means of creating customised elements in your documents. Any sequence of code that you frequently use should be placed into a template to keep your code as clean as possible. An additional benefit of doing this is that any modifications that you need to make to your code can now be made at a single location, rather than through the entire document. Templates are commonly used for managing document aesthetics, for instance headlines and other forms of styling are often implemented as templates. In cases where you might use CSS in HTML, you'll want to use templates in RIPL.
This template example emulates HTML's H1 element.
<template name="h1">
<p leading="2.0"><font face="Helvete" size="18" fill="#404050" style="bold"><inject/></font>
</template>The following code demonstrates how this template would be used:
<h1>Big Headline Here</>
Notice the use of the inject element in the template source. This tells the parser to inject the content that the user has encapsulated within the h1 opening and closing elements.
Any attributes that the user includes when referencing a template can be accessed as local variables. These follow the same format definition as global variables, i.e. [@attrib].
| Attrib | Type | Description |
|---|---|---|
| event | lookup | Must refer to an event that will be monitored. |
| function | function | The function that will be called when the trigger is activated. |
The trigger element allows you to devise custom responses to events that occur during document processing and in real-time document usage. It works by specifying the event that will be monitored and a reference to an existing function that will be called when the event occurs. Triggers are persistent, so they can be executed multiple times if the event frequently occurs.
The trigger must be declared after the script containing the function you wish to execute. We recommend that triggers are specified immediately after the script definition to which they are attached, or at the very end of the document file.
The following table illustrates the events that you may monitor:
| Event | Parameters | Description |
|---|---|---|
| after-layout | ViewWidth, ViewHeight, PageWidth, PageHeight | Executes just after the layout engine has arranged all the content on the page. It will re-execute whenever the layout needs to be re-calculated, e.g. when content is changed dynamically or the page is resized. |
| before-layout | ViewWidth, ViewHeight | Triggers just before the layout engine is going to arrange all content on the page. |
| focus | N/A | Triggered when the document receives the focus, i.e. the user has clicked on the document window. |
| focus-lost | N/A | Triggered when the document loses the focus, i.e. the user has clicked away from the document window. |
| leaving-page | OldURI, NewURI | Triggered when the document is about to move to a new page or document source. |
| on-click | X, Y, Type | Triggered whenever the mouse pointer is clicked on the document. The coordinates are indicated in X and Y. The type of clicks are LMB, RMB, MMB for the three most common mouse buttons. Additonal buttons are named from BUTTON4 onwards. |
| on-motion | X, Y | Triggers whenever the mouse pointer moves within the document. |
| on-release | X, Y, Type | Triggers whenever a clicked button is released over the document. |
| page-processed | N/A | Triggers after a document page has been processed by the parser. |
| refresh | N/A | Triggered when the document content is refreshed, whether that is automated or manually requested by the user. |
| Event | Args | Description |
|---|---|---|
| border | string | Defines the borders that will be painted for the cell. Can consist of any variation of the following values, in CSV format: all, top, left, bottom, right. Styling utilises the table stroke-width and stroke if the cell equivalents are not specified. |
| col-span | integer | Allows the cell to span multiple columns. Minimum value is 1. |
| fill | painter | The fill operation to apply to the cell's background. If not defined, the cell is transparent. |
| edit | string | Enables user editing mode within the cell if this value refers to a named editdef. |
| no-wrap | boolean | Disables word-wrapping if true. |
| on-click | function | The referenced function is called if the cell is clicked by the user. |
| on-crossing | function | The referenced function is called when the mouse cursor crosses in or out of the cell boundary. |
| on-motion | function | The referenced function is called when the user moves the mouse cursor over the cell. |
| row-span | integer | Allows the cell to span multiple rows. Minimum value is 1. |
| select | boolean | Give the cell the user focus (only valid if the cell has editing enabled). |
| stroke | painter | A stroke operation to apply when drawing the border of the cell. Overrides the table stroke. |
| stroke-width | float | The width of the stroke. Overrides the table stroke-width. |
The cell defines a table cell that can encapsulate content. The cell must be a child of a row element. Each cell is processed as if it were an independent page within the table.
Tip
The use element can inject vector graphics into the background of table cells.
| Event | Args | Description |
|---|---|---|
| fill | painter | The fill operation to apply to the row's background. If not defined, the row is transparent. |
| height | float | Minimum height of the row. |
| stroke | painter | A stroke operation to apply when drawing the row border. |
Declares a table row for containing cell elements. The row must be a child of a table element.
| Event | Args | Description |
|---|---|---|
| align | string | Defines the position of the table within its page area. Valid values are left (default), center and right |
| cell-padding | unit | Defines the spacing (margins) inside each cell. |
| collapsed | bool | If true, all spacing is disabled around the edges of the table. |
| columns | string | A CSV string of column widths, measured in pixels and/or percentages. When using percentages, the total of all values must not exceed 100%. Negative numbers are an error. |
| fill | painter | The fill operation to apply to the table's background. If not defined, the table is transparent. |
| h-spacing | unit | Horizontal spacing between cells. |
| padding | integer | This attribute is a synonym for the margins attribute. |
| spacing | unit | Defines v-spacing and h-spacing with one value. |
| stroke | painter | A stroke operation to apply when drawing the border of the table. |
| stroke-width | float | The width of the stroke. |
| thin | boolean | Declares a thin table, which results in any horizontal spacing being removed from the left and right sides of the table. Cells along the edge will be flush against the table borders. |
| v-spacing | unit | Vertical spacing between cells. |
| width, height | unit | Define minimum values for the table's width and height. |
Declares a table for arranging content into rows and cells.
Synonym for the cell element, provided to assist HTML compatibility only.
Synonym for the row element, provided to assist HTML compatibility only.
Activates bold styling for all text encapsulated by the element.
Forces a new line. Encapsulated content is not expected and will be ignored.
| Attrib | Type | Description |
|---|---|---|
| fill | painter | Defines the SVG-style fill operation to apply to font text. |
| face | string | The name of a recognised font. |
| preformat | boolean | Enables preformatting. In this mode, all whitespace is acknowledged by the parser and will not be automatically compacted. |
| size | unit | Requests a specific font point size. For fixed-size fonts, the nearest matching point size will be selected by the font server. |
| style | lookup | Valid font styles are bold, italic, bold italic. |
The font element applies a new font style to encapsulated text. This may result in the height of the current line increasing if the new font size exceeds that of the previous font style. The style is reversed to the previous one when the font element is terminated.
Adds italic styling to the current font and reverses this effect when the end of the element is encountered. If the font is already using italic styling, this element will do nothing.
The preformat element tells the parser to fully account for all whitespace that is within the encapsulated area. This means that multiple spaces will be treated as such, rather than being compacted to a single space.
Adds underlining to the current font style and reverses this effect when the end of the element is encountered. If the font style is already using underlining, this element will do nothing.
| Attrib | Type | Description |
|---|---|---|
| alt-fill | painter | The widget's alternative graphics can be customised by this fill operation, which should refer to a pattern named in an svg section. The alternative graphics state is activated when the button is depressed. |
| cell-padding | string | Set cell inner-padding values in clockwise order. If using percentages, the value is calculated from the diagonal of the parent. |
| fill | painter | The widget's graphics can be customised by this fill operation, which should refer to a pattern named in an svg section. |
| name | string | A unique name to identify the widget. |
| padding | string | Set cell outer-padding values in clockwise order. If using percentages, the value is calculated from the diagonal of the parent. |
| width, height | unit | The minimum width and height of the widget. |
The button widget allows for interactable buttons to be presented in a RIPL document. An unusual feature of this implementation is that the button text is defined as encapsulated content, allowing RIPL markup to be used to full advantage. For example:
<button width="400" height="60"><font size="30">Preset <i>400w<br/>60h</i></font> Size</button>| Attrib | Type | Description |
|---|---|---|
| fill | painter | The widget's graphics can be customised by this fill operation, which should refer to a pattern named in an svg section. |
| label | string | Gives the widget a text label. |
| label-pos | string | Set to left or right to define the side that the label will appear on. |
| name | string | A unique name to identify the widget. |
| value | string | Set to 1 or true to set the checkbox to an active state on its creation. |
| width | unit | The minimum width of the widget. |
The checkbox widget allows for interactable checkboxes to be presented in a RIPL document.
| Attrib | Type | Description |
|---|---|---|
| fill | painter | The widget's graphics can be customised by this fill operation, which should refer to a pattern named in an svg section. |
| font-fill | painter | The fill operation to use for the combobox text. |
| label | string | Gives the widget a text label. |
| label-pos | string | Set to left or right to define the side that the label will appear on. |
| name | string | A unique name to identify the widget. |
| value | string | Preset the combobox text to this string value. |
| width | unit | The minimum width of the widget. |
The combobox acts as an enhanced input widget that features a drop-down menu, allowing the user to select text from a list of predefined items.
The drop-down menu items are defined with a series of <option> elements in the <combobox> tag. Each option may feature an icon and define an identity value that differs to the presented content. The following example illustrates:
<combobox width="200" value="pre-defined content">
<option icon="icons:items/add" value="volvo">Volvo</option>
<option icon="icons:items/find" value="saab">Saab</option>
<option icon="icons:items/cancel" value="mercedes">Mercedes</option>
<option icon="icons:items/start" value="audi">Audi</option>
</combobox>It is valid for option elements to contain RIPL markup, if desired.
It is possible to change the style of the drop-down menu by adding a <style> tag that contains a separate RIPL document just for the menu. This should be achieved with the inclusion of an <svg placement="background"> tag and possibly a body. The following example illustrates:
<combobox ...>
<style>
<svg placement="background">
<rect rx="1%" ry="1%" x="1" y="1" xOffset="1" yOffset="1" fill="rgb(255,0,0)" stroke="rgb(255,255,255)" stroke-width="2"/>
<defs>
<pattern id="Highlight">
<rect width="100%" height="100%" fill="rgb(128,64,64)"/>
</pattern>
<image id="cancel" xlink:href="icons:items/cancel" width="32" height="32"/>
</defs>
</svg>
<body font-fill="rgb(255,255,255)" link="rgb(255,255,255)" v-link="rgb(255,255,255)"/>
</style>
<option value="volvo">This option includes an <image src="url(#cancel)"/> image.</option>
<option .../>
</combobox>Notice how an image is included in the style that can then be referenced from the option. This is the only way to achieve this design pattern, as the drop-down menu has a distinctive RIPL state that is not shared with the main document.
| Attrib | Type | Description |
|---|---|---|
| fill | painter | The widget's graphics can be customised by this fill operation, which should refer to a pattern named in an svg section. |
| font-fill | painter | The fill operation to use for the input text. |
| label | string | Gives the widget a text label. |
| label-pos | string | Set to left or right to define the side that the label will appear on. |
| name | string | A unique name to identify the widget. |
| value | string | Preset the input text to this string value. |
| width | unit | The minimum width of the widget. |
The input widget provides a space for the user to type text into a reserved entry box.