Difference between revisions of "Image"

From HSYCO
Jump to navigation Jump to search
Line 4: Line 4:
  
 
== Parameters ==
 
== Parameters ==
*'''address''': device data point name
+
{{UI Object Parameter (ID)}}
*'''position''': the object's position. Use the pixels or rows and columns coordinates format
+
{{UI Object Parameter (img)}}
*'''label''': the text label on the button. Can contain HTML tags
 
  
 +
{{Note: IMG Filename}}
 
== Syntax ==
 
== Syntax ==
  (button <address>; <position>; <label>)
+
  (image<!id> <image's filename>; <pos>; <width>; <height>; <label>; <css>)
 
E.g.
 
E.g.
  (button autom.1; x10y20; Front Door)
+
  (background!menubackground menubackground.png)
  
 
== UI Attributes ==
 
== UI Attributes ==
 
{{UI Object Attributes (Common)}}
 
{{UI Object Attributes (Common)}}
 +
{{:UI Object Attributes (Image)}}

Revision as of 13:04, 21 January 2014

Note  For a description and a complete list of UI Objects, see UI Objects.

This object shows an image file from the www/img directory. You can add an optional label text next to the image, and define several optional CSS attributes to control the text’s format and position. The “top” CSS attribute is used to move the text from its default position. If top is not defined, the text will be located just below the image. If defined, you can specify a positive or negative offset, in pixels. The zero offset position is at the top corner of the image; a positive offset moves the text down, a negative offset moves the text up.

Parameters

  • id: the object's ID, used by UISets

Template:UI Object Parameter (img)

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

Syntax

(image<!id> <image's filename>; <pos>; <width>; <height>; <label>; <css>)

E.g.

(background!menubackground menubackground.png)

UI Attributes

Common attributes

Name Value Description
pos x<x>y<y> Position specified as x/y coordinates. E.g. x-5y10
r<r>c<c> Position specified as row/column. E.g. r1c2
visible true Default. Show the object
false Hide the object
blink true | slow Blink the object at a slow speed
fast Blink the object at a fast speed
false Stop the blinking
opacity 0.0 ... 1.0 Object opacity from 0 (not visible) to 1 (fully visible)

UI Object Attributes (Image)