Fill Color

Fill Color specifies the color of the element's background.

Background color can be changed can be changed in Lycia Theme Designer and via css styles.

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:

SetFillColor ↓

GetFillColor

SetAlpha  ↓

GetAlpha

SetBlueColor  ↓

GetBlueColor

SetGreenColor  ↓

GetGreenColor

SetRedColor ↓  

GetRedColor

SetSystemColorName ↓  

GetSystemColorName

Influence and behavior:

In Lycia Theme Designer, there are three ways to change background colors: New Custom Color, Default Color, and New System Color.

With New Custom Color, you can choose among the available custom colors or add your own custom color:

Choosing a custom color among the available standard ones	Adding a new custom color
	Yon can add a new custom color by entering its RGB or hex values as well as by moving your cursor directly over the palette in the Advanced colors page

With Default Color, you choose the default color (i.e. the color set in the system theme) to be used for the text:

With New System Color, you choose the system color (i.e. one of the colors set for the application server) to be used as the background one:

 

You can use css styles to change background color of the element:

or

Regardless of whether you usedLycia Theme Designer or css, you get this at runtime:

 

At runtime, you can use ui methods to change the background color for form elements - containers, widgets, toolbars, and menubars.

It can be done in two ways:

• via an object called ui.SystemColor, and
• via an object called ui.CustomizedColor.

With ui.SystemColor, you must

1. define a variable of this data type,
2. apply the <var>.SetSystemColorName() to this variable,
3. specify a name of a system color as the argument for this method, and
4. apply the fore color to the form element by the <var>.SetFillColor() method.

4gl code sample	MAIN DEFINE lb ui.Label DEFINE bg ui.Background DEFINE sc ui.SystemColor OPEN WINDOW w WITH FORM "system_color" ATTRIBUTE(BORDER)   LET lb= ui.Label.ForName("lb1")     CALL sc.SetSystemColorName("LightCyan")     CALL bg.SetFillColor(sc) CALL lb.SetBackground(bg) CALL fgl_getkey() END MAIN
default appearance (in the form)
runtime appearance

Customized colors are defined according to the RGB color model, where

<var>.Alpha()	specifies the degree of the color's transparency (from 0 for completely transparent to 255 for completely opaque)
<var>.RedColor()	indicates how much of the red is included in the color (from 0 to 255)
<var>.GreenColor()	indicates how much of the green is included in the color (from 0 to 255)
<var>.BlueColor()	indicates how much of the blue is included in the color (from 0 to 255)

With ui.CustomizedColor, you must

1. define a variable of this data type,
2. assign a value to this variable via the ui.CustomizedColor.Create() method,
3. use <var>.Alpha(), <var>.RedColor(), <var>.GreenColor(), and <var>.BlueColor() methods to define the necessary color,
4. apply the fore color to the form element by the <var>.setForeColor() method.

4gl code sample	MAIN DEFINE lb ui.Label DEFINE bg ui.Background DEFINE cc ui.CustomizedColor OPEN WINDOW w WITH FORM "custom_color" ATTRIBUTE(BORDER) LET lb= ui.Label.ForName("lb1")     LET cc= ui.CustomizedColor.Create("cc")       CALL cc.SetAlpha(255)       CALL cc.SetRedColor(0)       CALL cc.SetGreenColor(153)       CALL cc.SetBlueColor(207)    CALL bg.SetFillColor(cc)    CALL lb.SetBackground(bg) CALL fgl_getkey() END MAIN
default appearance (in the form)
runtime appearance

Try the example program to learn more about manipulating background colors with ui methods.