Difference between revisions of "Selector"
Jump to navigation
Jump to search
| Line 7: | Line 7: | ||
{{UI Object Parameter (image)}} | {{UI Object Parameter (image)}} | ||
{{UI Object Parameter (position)}} | {{UI Object Parameter (position)}} | ||
| + | *'''id''': the object's ID, used by UISets | ||
*'''size''': the image's width and height | *'''size''': the image's width and height | ||
*'''container ID''': the container's id associated to this selector | *'''container ID''': the container's id associated to this selector | ||
| Line 15: | Line 16: | ||
{{Note: IMG Filename}} | {{Note: IMG Filename}} | ||
== Syntax == | == Syntax == | ||
| − | (selector <image>; <position>; <width>; <height>; <container ID>; <group>; <label>; <css>) | + | (selector!id <image>; <position>; <width>; <height>; <container ID>; <group>; <label>; <css>) |
E.g. | E.g. | ||
| − | (selector apple.png; r3c5; 100; 100; mycontainer;; One) | + | (selector!id apple.png; r3c5; 100; 100; mycontainer;; One) |
Revision as of 15:00, 2 April 2015
For a description and a complete list of UI Objects, see The selector allows you to create a graphical behavior that is similar to having multiple panels with tab navigation, only more flexible than that. The graphical appearance of a selector is the same as an Image or ImageLink object, an image and a text label. You should create two or more overlapped containers in a page, each with a unique id. Then create a selector object for each container, with all selectors having the same group name. When a selector object is touched, the corresponding container's visibility will be set to visible, while all other containers associated to selectors with the same group name will become invisible.
Parameters
- image: image filename
- position: the object's position. Use the pixels or rows and columns coordinates format
- id: the object's ID, used by UISets
- size: the image's width and height
- container ID: the container's id associated to this selector
- group: optional group name, identifying a set of selectors. All selectors with no group name defined are part of the same group
- label: optional text label next to the button. Can contain HTML tags
- css: optional CSS style.
Image files are searched inside the www/<project's name>/img directory first, then inside the www/img directory.
If the filename is set with a UISet, it's possible to load an image from the web by entering the URL, or a path relative to www/<skin's name>/pic by specifying /pic/ followed by the filename
If the filename is set with a UISet, it's possible to load an image from the web by entering the URL, or a path relative to www/<skin's name>/pic by specifying /pic/ followed by the filename
Syntax
(selector!id <image>; <position>; <width>; <height>; <container ID>; <group>; <label>; <css>)
E.g.
(selector!id apple.png; r3c5; 100; 100; mycontainer;; One)
