Class

WebStyle

Description

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

Properties

Name	Type	Read-Only	Shared
BackgroundColor	ColorGroup
Bold	Boolean
BorderColor	ColorGroup
BorderThickness	Integer
Cursor	Cursors
FontName	String
FontSize	Double
ForegroundColor	ColorGroup
Italic	Boolean
Opacity	Integer
Strikethrough	Boolean
Underline	Boolean

Methods

Name	Parameters	Returns
AddTransition	CSSPropertyName As String, Duration As Double, SpeedPattern As SpeedPatterns, Delay As Double = 0
Clone	deep As Boolean = False	WebStyle
CSSValue	Selector As String	String
HasCSSProperty	cssPropertyName As String	Boolean
Remove	cssPropertyName As String
RemoveTransition	cssPropertyName As String
SubClass		WebStyle
Value	cssPropertyName As String	String
	cssPropertyName As String, Assigns value As String

Enumerations

WebStyle.Cursors

Cursors

All cursors available that can appear when the user hovers over the object.

Enum
CrossHair
Default
Help
Inherit
Move
NoDrop
None
NotAllowed
Pointer
Progress
ResizeColumn
ResizeEast
ResizeNorth
ResizeNorthEast
ResizeNorthWest
ResizeRow
ResizeSouth
ResizeSouthEast
ResizeSouthWest
ResizeWest
Text
VerticalText
Wait

WebStyle.SpeedPatterns

SpeedPatterns

All available speeds at which a transition can occur that can be applies to CSS properties.

Enum	Description
Ease	The pace is constant throughout the transition and is slower than Linear.
EaseIn	The pace begins slow then speeds up.
EaseInOut	The pace begins slow then speeds up and then slows back down again at the end.
EaseOut	The pace slows at the end.
Linear	The pace is constant throughout the transition and is faster than Ease.

Property descriptions

WebStyle.BackgroundColor

BackgroundColor As ColorGroup

The color used to draw the background of the object to which the WebStyle is assigned.

WebStyle.Bold

Bold As Boolean

If True and the object to which the WebStyle is assigned has text, the text will be style in bold.

WebStyle.BorderColor

BorderColor As ColorGroup

The color used to draw the border of the object to which the WebStyle is assigned.

WebStyle.BorderThickness

BorderThickness As Integer

The thickness of the border of the object to which the WebStyle is assigned.

WebStyle.Cursor

Cursor As Cursors

The cursor displayed when the user hovers over the object to which the WebStyle is assigned.

WebStyle.FontName

FontName As String

The font used to for any text in the object to which the WebStyle is assigned.

WebStyle.FontSize

FontSize As Double

The font size used to draw any text in the object to which the WebStyle is assigned.

WebStyle.ForegroundColor

ForegroundColor As ColorGroup

The color used to draw everything except the border and background of the object to which the WebStyle is assigned.

WebStyle.Italic

Italic As Boolean

If True, the text of the object to which the WebStyle is assigned will be use the italic style.

WebStyle.Opacity

Opacity As Integer

The level of opacity of the control to which the WebStyle is assigned.

Valid values are 0 (invisible) to 100 (fully opaque).

WebStyle.Strikethrough

Strikethrough As Boolean

If True, the text of the object to which the WebStyle is assigned will be use the strikethrough style.

WebStyle.Underline

Underline As Boolean

If True, the text of the object to which the WebStyle is assigned will be use the underline style.

Method descriptions

WebStyle.AddTransition

AddTransition(CSSPropertyName As String, Duration As Double, SpeedPattern As SpeedPatterns, Delay As Double = 0)

Adds a transition with the values passed.

The transition is triggered when the property whose name was passed is modified in another event. The transition will then be from the previous value to the new value.

The default SpeedPattern is EaseInOut.

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

WebStyle.Clone

Clone(deep As Boolean = False) As WebStyle

Returns a copy of the WebStyle.

If Deep is True the copy will have the any values inherited from WebStyle's WebStyle parent instances.

WebStyle.CSSValue

CSSValue(Selector As String) As String

Returns the value of the CSS Selector whose name is passed.

WebStyle.HasCSSProperty

HasCSSProperty(cssPropertyName As String) As Boolean

Returns True if WebStyle has a CSS property with name passed.

WebStyle.Remove

Remove(cssPropertyName As String)

Removes the value of the CSS Selector whose name is passed.

WebStyle.RemoveTransition

RemoveTransition(cssPropertyName As String)

Removes the transition for the property whose name is passed.

WebStyle.SubClass

SubClass As WebStyle

Returns a subclass of the WebStyle.

The returned WebStyle inherits the values of the WebStyle from which it was created.

WebStyle.Value

Value(cssPropertyName As String) As String

Returns the value of the CSS Selector whose name was passed.

Value(cssPropertyName As String, Assigns value As String)

Sets the CSS Selector whose name is passed to the value assigned.

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

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.SpeedPatterns.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"

Compatibility

Web projects on all supported operating systems.