WebStyle

Class (inherits from Object)

New in 2020r1

A WebStyle is a collection of methods and properties that manage the look of a user interface elements in your web app.

Properties

BackgroundColor Cursor Italic Bold FontName Opacity BorderColor FontSize Strikethrough BorderThickness ForegroundColor Underline

Methods

AddTransition HasCSSProperty SubClass CSSValue Remove Value Clone RemoveTransition

Enumerations

Cursors SpeedPatterns

Notes

A WebStyle can be applied to any object that has a WebStyle property.

You can create WebStyle objects that are subclasses of an existing WebStyle using the SubClass method. A subclass inherits all of the values of the parent object and can then override any of those values.

Sample Code

Transitions

There are many CSS Selectors that can be animated.

This code in a WebRectangle's Opening event adds a transition that will change the width of the WebRectangle. It then stores the width of the WebRectangle in the style's width property. This is done so that when the transition is triggered later by modifying the width, the width stored in the width property of the WebStyle will match that of the WebRectangle being animated:

Me.Style.AddTransition("width", 5, WebStyle.TransitionTimingFunctions.EaseInOut, 0)
Me.Style.Value("width") = Me.Width.ToString + "px"

The transition animation of the width of the WebRectangle is then triggered by changing the width value to a new value:

Var currentWidth As Integer = Rectangle1.Style.Value("width").ToInteger
currentWidth = currentWidth + 600
Rectangle1.Style.Value("width") = currentWidth.ToString + "px"

Because the name ("width" in this case) above passed to both AddTransition and Value is the name of a CSS selector, it must be in lowercase as selector names are case-sensitive.

Because WebStyles use CSS under the hood, there are many CSS properties that can be animated.

Dimensions

Selectors that are dimensions such as width and height are in pixels and thus you must add "px" (lowercase) to the values you pass as in the example above.

Compatibility

Web projects on all supported operating systems.