| Both sides previous revision Previous revision Next revision | Previous revisionLast revisionBoth sides next revision |
| livebox:xapflash [2017/01/17 20:39] – brett | livebox:xapflash [2017/01/17 21:24] – brett |
|---|
| |
| Parent tag locations: | Parent tag locations: |
| * config.xml: ''<joggler> <layout> <defaults>'' | * config.xml: ''%%<joggler> <layout> <defaults>%%'' |
| * xapconfig.xml: ''<joggler> <layout> <defaults>'' | * xapconfig.xml: ''%%<joggler> <layout> <defaults>%%'' |
| * config.xml: ''<joggler> <override> <layout> <defaults>'' | * config.xml: ''%%<joggler> <override> <layout> <defaults>%%'' |
| |
| Here we establish the baseline for our visual components to create a common look and feel and to reduce the amount of repetition in their specification. | Here we establish the baseline for our visual components to create a common look and feel and to reduce the amount of repetition in their specification. |
| |
| ^^ Parent tag ^^ Allowed child tags ^^ Description ^^ | ^^ Parent tag ^^ Allowed child tags ^^ Description ^^ |
| || <label> || <font> <fontsize> <fontcolour> <alpha> <offset> || || | || %%<label>%% || %%<font> <fontsize> <fontcolour> <alpha> <offset>%% || || |
| || <bsctext> || <font> <fontsize> <fontcolour> <alpha>|| || | || <bsctext> || %%<font> <fontsize> <fontcolour> <alpha>%% || || |
| || <button> || <font> <fontsize> <fontcolour> <alpha>|| || | || %%<button>%% || %%<font> <fontsize> <fontcolour> <alpha>%% || || |
| || %%<textBox>%% || <font> <fontsize> <fontcolour> <alpha> <align> || || | || %%<textBox>%% || %%<font> <fontsize> <fontcolour> <alpha> <align>%% || || |
| || <time> || <font> <fontsize> <fontcolour> <alpha> <show> || || | || <time> || %%<font> <fontsize> <fontcolour> <alpha> <show>%% || || |
| || <button> || <style> <height> <width> <alpha> || || | || %%<button>%% || %%<style> <height> <width> <alpha>%% || || |
| |
| Details about the children | Details about the children |
| ^^ Tag ^^ Description ^^ | ^^ Tag ^^ Description ^^ |
| || <font> || The name of a Font available from inside Flash. **Default: Verdana** || | || %%<font>%% || The name of a Font available from inside Flash. **Default: Verdana** || |
| || <fontsize> || the size of the font. **Default: 14** || | || %%<fontsize>%% || the size of the font. **Default: 14** || |
| || <fontcolour> || A Hex triple in the format 0xRRGGBB \\ \\ Default: \\ label,textBox: 0xFFFFFF\\ bsctext,time: 0xFFFFCC || | || %%<fontcolour>%% || A Hex triple in the format 0xRRGGBB \\ \\ Default: \\ label,textBox: 0xFFFFFF\\ bsctext,time: 0xFFFFCC || |
| || <alpha> || Floating point number indicating transparency: 0 transparent, 1 Opaque. **Default 1** || | || %%<alpha>%% || Floating point number indicating transparency: 0 transparent, 1 Opaque. **Default 1** || |
| || <align> || valid values are: left, right, centre, justify. **Default: left** || | || %%<align>%% || valid values are: left, right, centre, justify. **Default: left** || |
| || <show> || valid values: true, false. **Default: true** || | || %%<show>%% || valid values: true, false. **Default: true** || |
| || <offset> || This is the vertical offset of the label from its default - just below the button position (positive or negative, you can also use the word 'centre' to auto compute an offset. || | || %%<offset>%% || This is the vertical offset of the label from its default - just below the button position (positive or negative, you can also use the word 'centre' to auto compute an offset. || |
| || <style> || Defines the look and feel for the button. see [[#the 'style' tag]] || | || %%<style>%% || Defines the look and feel for the button. see [[#the 'style' tag]] || |
| || <width> || Default width || | || %%<width>%% || Default width || |
| || <height> || Default height || | || %%<height>%% || Default height || |
| |
| Example: | Example: |
| ===== User interface objects ===== | ===== User interface objects ===== |
| |
| The ''<button>'' object is the primary object which is used in the construction a user interface. There are 3 primary modes in which a button will be used | The ''%%<button>%%'' object is the primary object which is used in the construction a user interface. There are 3 primary modes in which a button will be used |
| * in a control mode to trigger an xAP event. | * in a control mode to trigger an xAP event. |
| * in a read-only mode to display xAP data. | * in a read-only mode to display xAP data. |
| They may be placed at a grid position using ''<gridX><gridY>'' or can be directly located at an absolute pixel position using ''<posX><posY>''; these are mutually exclusive if using absolute posX,posY coordinates. | They may be placed at a grid position using ''<gridX><gridY>'' or can be directly located at an absolute pixel position using ''<posX><posY>''; these are mutually exclusive if using absolute posX,posY coordinates. |
| |
| The ''<textbox>'' object is display only and has some additional properties from a button; its content may be HTML markup for example. | The ''%%<textbox>%%'' object is display only and has some additional properties from a button; its content may be HTML markup for example. |
| |
| 'Text Box' is really a misnomer as these may also contain local or remote images and even animated Flash (SWF) content. Text boxes differ from buttons in that they display textual/image content rather than on/off status, and they do not control devices. Indeed text boxes do not intercept clicks at all and so can be placed over other elements as required. You will find text boxes are far more flexible at displaying content from xAPBSC text devices than buttons. Buttons used for this purpose only have small centered text areas within the button boundaries whereas textbox's can be any size and at any position. | 'Text Box' is really a misnomer as these may also contain local or remote images and even animated Flash (SWF) content. Text boxes differ from buttons in that they display textual/image content rather than on/off status, and they do not control devices. Indeed text boxes do not intercept clicks at all and so can be placed over other elements as required. You will find text boxes are far more flexible at displaying content from xAPBSC text devices than buttons. Buttons used for this purpose only have small centered text areas within the button boundaries whereas textbox's can be any size and at any position. |
| |
| They maybe populated with any of the following child tags according to the usage key legend below | They maybe populated with any of the following child tags according to the usage key legend below |
| * BT - ''<button>'' & ''%%<textbox>%%'' | * BT - ''%%<button>%%'' & ''%%<textbox>%%'' |
| * B - ''<button>'' only | * B - ''%%<button>%%'' only |
| * T - ''%%<textbox>%%'' only | * T - ''%%<textbox>%%'' only |
| |
| | <width> | BT | Element width either in pixels or /2 \2 x2 *3 etc\\ *2 will be double size\\ x3 will be triple size plus any gutter width additions (two widths in this case) to ensure right hand edges align\\ /2 will be half size\\ \2 will be half size less any gutter width additions (one in this case) to ensure right hand edges align non integer values may be used but do not right align when using \ or x | | | <width> | BT | Element width either in pixels or /2 \2 x2 *3 etc\\ *2 will be double size\\ x3 will be triple size plus any gutter width additions (two widths in this case) to ensure right hand edges align\\ /2 will be half size\\ \2 will be half size less any gutter width additions (one in this case) to ensure right hand edges align non integer values may be used but do not right align when using \ or x | |
| | <height> | BT | Element height either in pixels or /2 \2 x2 *3 etc as for width above | | | <height> | BT | Element height either in pixels or /2 \2 x2 *3 etc as for width above | |
| | <text> | BT | Default text to display. Will be replaced when an associated xAP event is received. | | | %%<text>%% | BT | Default text to display. Will be replaced when an associated xAP event is received. | |
| | <textPrefix> | BT | If <mode> is text this is prepended to the xAP item.| | | <textPrefix> | BT | If %%<mode>%% is text this is prepended to the xAP item. | |
| | <textSuffix> | BT | If <mode> is text this is appended to the xAP item. | | | <textSuffix> | BT | If %%<mode>%% is text this is appended to the xAP item. | |
| | <html> | T | boolean, default: false. If defined allows full HTML inside the <textPrefix> <textSuffix> and <text> tags\\ When entering html within CDATA tags the html tags do not need to be paired but must adhere to html standards\\ \\ <textPrefix><![CDATA[<FONT FACE="Times New Roman" SIZE="36" COLOR="#BB5566">]]></textPrefix>\\ <textSuffix><![CDATA[</FONT>]]></textSuffix>\\ \\ <text><![CDATA[<img height="200" width="200" src="http://www.bbc.co.uk/home/beta/7.2/object/clock/tiny.swf"></img>]]></text> | | | %%<html>%% | T | boolean, default: false. If defined allows full HTML inside the %%<textPrefix> <textSuffix>%% and %%<text>%% tags\\ When entering html within CDATA tags the html tags do not need to be paired but must adhere to html standards\\ \\ <textPrefix><![CDATA[<FONT FACE="Times New Roman" SIZE="36" COLOR="#BB5566">]]></textPrefix>\\ <textSuffix><![CDATA[</FONT>]]></textSuffix>\\ \\ %%<text><![CDATA[<img height="200" width="200" src="http://www.bbc.co.uk/home/beta/7.2/object/clock/tiny.swf"></img>%%]]></text> | |
| | <font> | T | The default font used for display | | | %%<font>%% | T | The default font used for display | |
| | <fontcolour> | T | RGB hex triple for the colour. Must be prefix with 0x. i.e. 0xDDFFAA | | | <fontcolour> | T | RGB hex triple for the colour. Must be prefix with 0x. i.e. 0xDDFFAA | |
| | <fontsize> | T | Default font size of the displayed text | | | <fontsize> | T | Default font size of the displayed text | |
| | <multiline> | T | Boolean: true/false | | | <multiline> | T | Boolean: true/false | |
| | <wordwrap> | T | Boolean: true/false | | | <wordwrap> | T | Boolean: true/false | |
| | <hide> | B | text,state, default: none. For a BSC text button (''<mode>text</mode>'') defines what is hidden | | | <hide> | B | text,state, default: none. For a BSC text button (''%%<mode>text</mode>%%'') defines what is hidden | |
| | <style> | B | see [[#the 'style' tag]] | | | %%<style>%% | B | see [[#the 'style' tag]] | |
| | <alpha> | BT | Amount of transparency of ALL items contained withing the UI element.\\ Floating point number: 0 transparent, 1 Opaque. Default 1 | | | <alpha> | BT | Amount of transparency of ALL items contained withing the UI element.\\ Floating point number: 0 transparent, 1 Opaque. Default 1 | |
| | <xAP> | BT | see [[#the 'xAP' tag]] this is how you link a GUI object to an xAP endpoint | | | <xAP> | BT | see [[#the 'xAP' tag]] this is how you link a GUI object to an xAP endpoint | |
| | <background> | T | see [[#the 'background' section]]. | | | %%<background>%% | T | see [[#the 'background' section]]. | |
| | <border> | T | Boolean: true/false. Default: false | | | %%<border>%% | T | Boolean: true/false. Default: false | |
| | <bordercolour> | T | RGB hex triple for the colour. Default 0x888888 | | | <bordercolour> | T | RGB hex triple for the colour. Default 0x888888 | |
| | <group> | B | makes a button into a radio button with 'mutually exclusive' style. Each button in the group must be named with the same group name. <group>myGroup</group> | | | <group> | B | makes a button into a radio button with 'mutually exclusive' style. Each button in the group must be named with the same group name. <group>myGroup</group> | |
| ^ Tag ^ Description ^ | ^ Tag ^ Description ^ |
| | <design> | Currently only two available: o2, sleek. Default: nothing\\ The contents of the tag are use to construct a filename for the slider VALUEslider.swf, where VALUE is the <design> tag contents. | | | <design> | Currently only two available: o2, sleek. Default: nothing\\ The contents of the tag are use to construct a filename for the slider VALUEslider.swf, where VALUE is the <design> tag contents. | |
| | <style> | The name of the underlying SWF file ie "o2volumecontrol.swf" becomes its style; o2volumecontrol, sleekvolumecontrol | | | %%<style> %%| The name of the underlying SWF file ie "o2volumecontrol.swf" becomes its style; o2volumecontrol, sleekvolumecontrol | |
| | <rotation> | vertical(-left), vertical-right, horizontal(-left), horizontal-right | | | <rotation> | vertical(-left), vertical-right, horizontal(-left), horizontal-right | |
| | <min> | Sliders minimal range scaling value | | | <min> | Sliders minimal range scaling value | |
| </code> | </code> |
| |
| The style of the pop-up volume level can also be controlled by including a <slider> section using the following as the style type: ''<style>sleekvolumecontrol</style>'' or ''<style>o2volumecontrol</style>''. Default: sleekvolumecontrol | The style of the pop-up volume level can also be controlled by including a <slider> section using the following as the style type: ''%%<style>sleekvolumecontrol</style>%%'' or ''%%<style>o2volumecontrol</style>%%''. Default: sleekvolumecontrol |
| |
| * **screenbrightnesslevel** (Joggler Only) | * **screenbrightnesslevel** (Joggler Only) |
| </button> | </button> |
| </code> | </code> |
| The style of the pop-up brightness level can also be controlled by including a <slider> section, just like volumelevel, using the following as the style type: ''<style>sleekslider</style>'' or ''<style>o2slider</style>''. Default: sleekslider | The style of the pop-up brightness level can also be controlled by including a <slider> section, just like volumelevel, using the following as the style type: ''%%<style>sleekslider</style>%%'' or ''%%<style>o2slider</style>%%''. Default: sleekslider |
| |
| * **screensaverhold** (Joggler Only) | * **screensaverhold** (Joggler Only) |
| ^ Tag ^ Description ^ | ^ Tag ^ Description ^ |
| | <Class> | the xAP schema name ''class='' value | | | <Class> | the xAP schema name ''class='' value | |
| | <body> | The name of the message block container. xAP messages may include several message blocks but they each have a unique name. | | | %%<body>%% | The name of the message block container. xAP messages may include several message blocks but they each have a unique name. | |
| | <parameter> | The name of the data value you wish to extract. | | | <parameter> | The name of the data value you wish to extract. | |
| |
| ^ Tag ^ Description ^ | ^ Tag ^ Description ^ |
| | <password> | Joggler only - Allows a page to be password protected, displays a on screen keyboard for entry of the password. Each time the page is navigated the password will be required. For non-Joggler displays this entry will be ignored and access allowed. | | | <password> | Joggler only - Allows a page to be password protected, displays a on screen keyboard for entry of the password. Each time the page is navigated the password will be required. For non-Joggler displays this entry will be ignored and access allowed. | |
| | <background> | see [[#the 'background' section]]. | | | %%<background>%% | see [[#the 'background' section]]. | |
| | <alpha> | Alpha blending from 0.0 (transparent) to 1.0 (opaque). ALL objects on the page will inherit this value. | | | <alpha> | Alpha blending from 0.0 (transparent) to 1.0 (opaque). ALL objects on the page will inherit this value. | |
| | <visible> | Boolean to show or hide the element at startup. Default: true | | | <visible> | Boolean to show or hide the element at startup. Default: true | |
| | <group> | Only one member of a group can be active at once (radio group). If a page in the group is made visible all others will be hidden. | | | <group> | Only one member of a group can be active at once (radio group). If a page in the group is made visible all others will be hidden. | |
| |
| Empty <layout>, <button> and <textbox> tags have been inserted to show their relationship with respect to a <page> tag. | Empty <layout>, %%<button>%% and %%<textbox>%% tags have been inserted to show their relationship with respect to a <page> tag. |
| |
| <code xml> | <code xml> |