Background Image is used to add images to elements' backgrounds. |
|
Background image can be added and changed both in Lycia Form Designer and in Lycia Theme Designer. However, we recommend applying background properties via user themes created in Lycia Theme Designer.
in Lycia Form Designer |
|
in Lycia Theme Designer |
|
Form XML code:
<element_name.background>
<Background backgroundImage="qx://application/lycia"/>
</element_name.background>
By default, elements have no background image and, thus, this property is absent from the form XML code. The property value will appear in the form XML code only once any background image is added to the form.
Theme property filter XML code:
<DoStyleAction>
<SetProperty>
<PropertyPath>
<PropertyName>Background</PropertyName>
<PropertyName>BackgroundImage</PropertyName>
</PropertyPath>
<PropertyValue type="ResourceId" />
</SetProperty>
</DoStyleAction>
Default value: not specified
Associated containers, widgets and theme elements:
Associated ui methods:
SetBackgroundImage
GetBackgroundImage
Influence and behavior:
In Lycia Theme Designer, background images are added by specifying the path to the file (image location):
In Lycia Theme Designer, images are not added directly to the Background Image property but to the placeholder called New Resource ID which is an optional ui element (ui.ResorceID) created to hold media resources to be applied to other ui elements..
Where are three ways to specify the image location:
→ qx://application/<image_name>.<image_extention> - specifies the path relative to the application on the application server:
→ qx://embedded/<image_name>.<image_extention> - specifies that the image is an embedded one, i.e. is installed together with the GUI client and is located in the following folders (by default):
C:\ProgramData\Querix\Lycia 7\jetty\temp
C:\Program Files\Querix\Lycia 3 Development Suite 7.1\Lycia\client\www\pack
/opt/Querix/tmp/jetty
→ qx://clienttemp/<image_name>.<image_extention> - specifies that the image is located in the temporary directory generated on the client side:
In Lycia Form Designer, you employ two ways of adding and changing background images:
→ to choose an image among application dependencies or files located in the folder specified by FGLIMAGEPATH:
Step 1 |
Left-click the empty space of the property value or the Add icon:
|
Step 2 |
Choose the file and click OK:
|
Step 3 |
The image is added:
|
→ to specify the path to the file (image location):
Step 1 |
Left-click the Enter path icon:
|
Step 2 |
Type in the file name and extension:
|
Step 3 |
The image is added:
|
Regardless of whether you used Lycia Theme Designer or Lycia Form Designer, you get this at runtime:
Related articles:
Size
Location