User Tools
software:gui-designer:buttons
Differences
This shows you the differences between two versions of the page.
|
software:gui-designer:buttons [2013/03/20 23:47] aaron |
software:gui-designer:buttons [2013/04/04 04:09] (current) aaron |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== Button ====== | + | ====== Button Tool====== |
| Buttons in [[software:gui-designer|guiDesigner]] can be placed on any page or subpage.\\ | Buttons in [[software:gui-designer|guiDesigner]] can be placed on any page or subpage.\\ | ||
| \\ | \\ | ||
| - | To implement a button in guiDesigner, select the button icon {{:software:gui-designer:button_icon.png?nolink|}}on the tool bar. Then draw a box roughly the size of the button you wish to use. This size can be edited later on.\\ | + | To implement a button in guiDesigner: |
| - | You will then need to add a theme to the button. To do this, select a button theme from the [[software:gui-designer:theme-library|Theme Library]] and drag it onto the button you just added. | + | - Select the button icon {{:software:gui-designer:button_icon.png?nolink|}}on the tool bar. |
| + | - Then draw a box roughly the size of the button you wish to use. This size can be edited later on.\\ | ||
| + | - You will then need to add a theme to the button. To do this, select a button theme from the [[software:gui-designer:theme-library|Theme Library]] and drag it onto the button you just added. | ||
| You can also drag a button theme directly from the [[software:gui-designer:theme-manager|Theme Manager]] or [[software:gui-designer:theme-library|Theme Library]] onto an empty spot on an open page, and the button will be automatically created at the drop point and assigned the theme you dragged. | You can also drag a button theme directly from the [[software:gui-designer:theme-manager|Theme Manager]] or [[software:gui-designer:theme-library|Theme Library]] onto an empty spot on an open page, and the button will be automatically created at the drop point and assigned the theme you dragged. | ||
| Line 52: | Line 54: | ||
| === 9 - State Details - Serial Join === | === 9 - State Details - Serial Join === | ||
| + | This [[software:gui-designer:joins|serial join]] allows you to dynamically change the text value shown on each button state. By assigning a serial join above zero, when that serial join text value changes, any button assigned the same serial join will be updated to show the new text value. | ||
| === 10 - Overlay Image - Overlay Browser === | === 10 - Overlay Image - Overlay Browser === | ||
| Opens the overlay browser window which allows you to select an image from a library to overlay on the button.\\ | Opens the overlay browser window which allows you to select an image from a library to overlay on the button.\\ | ||
| + | The contents of the overlay library are taken from the guiDesigner installation location, within an ''overlays'' folder. You can add your own overlay images to the library by placing them within this folder. | ||
| + | |||
| {{:software:gui-designer:commandfusion_guidesigner_button_properties_overlay_browser.png?nolink|}} | {{:software:gui-designer:commandfusion_guidesigner_button_properties_overlay_browser.png?nolink|}} | ||
| + | |||
| == A - Overlay Set == | == A - Overlay Set == | ||
| Select the overlay set to choose from. | Select the overlay set to choose from. | ||
| Line 70: | Line 75: | ||
| === 12 - Overlay Image - Choose File === | === 12 - Overlay Image - Choose File === | ||
| - | Choose an image file to use an an overlay image. | + | Choose a custom image file to use as an overlay image. |
| === 13 - Overlay Image - Position and Size === | === 13 - Overlay Image - Position and Size === | ||
| This option allows for manual entry of the position and size of the overlay image. | This option allows for manual entry of the position and size of the overlay image. | ||
| - | * X Position | + | * X Position (left of the image, relative to the button left edge) |
| - | * Y Position | + | * Y Position (top of the image, relative to the button top edge) |
| * Width of the overlay image | * Width of the overlay image | ||
| * Height of the overlay image | * Height of the overlay image | ||
| Line 86: | Line 91: | ||
| === A - Common Settings === | === A - Common Settings === | ||
| - | For information on these settings, see the Button Properties Design Tab info. | + | For information on these settings, see the [[#button-properties-design-tab|Button Properties Design Tab]] info above. |
| === 1 - Page Flip === | === 1 - Page Flip === | ||
| + | Select a page to navigate to in your GUI when the button is pressed. Page flips will only work if your [[software:iviewer:licensing|device is licensed]] to run the GUI. | ||
| === 2 - URL === | === 2 - URL === | ||
| Line 95: | Line 100: | ||
| On iOS devices, you can also launch other apps by using their [[software:gui-designer:url-scheme|URL Schema]] as the URL. | On iOS devices, you can also launch other apps by using their [[software:gui-designer:url-scheme|URL Schema]] as the URL. | ||
| - | === 3 - Link GUI File === | + | You can also force iViewer to load another GUI by entering the URL of the GUI file to load, replacing ''http:%%//%%'' with ''cf:%%//%%''. |
| + | === 3 - Link GUI File === | ||
| + | When clicked, this will bring up documentation on how to use GUI File linking. | ||
| === 4 - Basic Actions/Advanced Actions === | === 4 - Basic Actions/Advanced Actions === | ||
| Line 106: | Line 113: | ||
| == Basic Actions == | == Basic Actions == | ||
| - | With basic actions, you can assign any Command and/or Macro to a button. This covers most needs for users. | + | With basic actions, you can assign any [[software:gui-designer:system-manager:commands|Command]] and/or [[software:gui-designer:system-manager:macros|Macro]] to a button. This covers most needs for users. |
| There is also a repeat delay option which controls how often the command and/or macro is sent whilst the button is held down. | There is also a repeat delay option which controls how often the command and/or macro is sent whilst the button is held down. | ||
| - | |||
| == Advanced Actions == | == Advanced Actions == | ||
| Line 118: | Line 124: | ||
| === 6 - Press Command === | === 6 - Press Command === | ||
| - | Choose a command that you have previously defined in the System Manager to assign to the button. | + | Choose a [[software:gui-designer:system-manager:commands|command]] that you have previously defined in the [[software:gui-designer:system-manager|System Manager]] to assign to the button. |
| === 7 - Press Macro === | === 7 - Press Macro === | ||
| - | Choose a macro that you have previously defined in the System Manager to assign to the button. | + | Choose a [[software:gui-designer:system-manager:macros|macro]] that you have previously defined in the [[software:gui-designer:system-manager|System Manager]] to assign to the button. |
| === 8 - JavaScript === | === 8 - JavaScript === | ||
| + | Enter a line of [[software:iviewer:iviewer-javascript-api|JavaScript]] code to execute when the button is pressed. The repeat delay will also cause this code to be executed repeatedly whilst held. | ||
| - | === 9 - Repeat Delay === | + | JavaScript as a language allows you to enter even long functions as a single line of text. |
| - | Enter the time in milliseconds that you want iViewer to wait until repeating the command if the button is held down. Enter 0 to disable repeating. | + | |
| + | For mor information on JavaScript support in iViewer, see the [[software:iviewer:iviewer-javascript-api|JavaScript API Documentation]]. | ||
| + | |||
| + | === 9 - Repeat Delay === | ||
| + | Enter the time in milliseconds that you want iViewer to wait until repeating the command if the button is held down. Enter 0 to disable repeating. For example, 1000 means "repeat every second". | ||
software/gui-designer/buttons.1363823279.txt.gz · Last modified: 2013/03/20 23:47 by aaron
