Background Image

Background Image is used to add images to elements' backgrounds.

Theme property filter XML code:

CSS property code:

Default value:

not specified

Associated containers, widgets and theme elements:

BorderPanel CoordPanel GridPanel GroupBox StackPanel ScrollViewer Tab TabPage Table TreeTable

BlobViewer Browser Button Calendar Canvas CheckBox ComboBox FunctionField Label MenuGroup MenuCommand

ProgressBar RadioGroup Slider Spinner TextArea TextField Toolbar ToolbarButton TimeEditField WebComponent

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):

Images are not added directly to the Background Image property but to the placeholder called New Resource ID. New Resource ID is an optional ui object (=ui.ResorceID) created to hold media resources that are applied to other ui elements.

Where are five ways to specify the image location:

• for private (= included in the 4gl project) images – qx://application/ and qx://clienttemp/:

  

• for built-in (=provided with Lycia) images – qx://embedded/ and qx://icon/:

  

• for public image – {CONTEXT}

 

At runtime, you can use ui method - <var>.SetBackgroundImage() - to change the background image of the element.

For this purpose, you must

1. define a variable of the ui.Background data type,
2. apply <var>.SetBackgroundImage() to this variable, and
3. apply the background to the form element by the <var>.setBackground() method:

4gl code sample	MAIN DEFINE lb ui.Label DEFINE bg ui.Background DEFINE sc ui.SystemColor OPEN WINDOW w WITH FORM "background_ui" ATTRIBUTE(BORDER)   LET lb= ui.Label.ForName("lb1")   CALL bg.SetBackgroundImage("qx://application/querix.png")   CALL lb.SetBackground(bg) CALL fgl_getkey() END MAIN
default appearance (in the form)
runtime appearance