ToolTipsFactory

Object Model - Common Properties - BorderGradientFocus

Gets or sets a value that specifies the center of the linear gradient for the tooltip border.

[Visual Basic]
Public Property BorderGradientFocus As Single
[C#]
public Single BorderGradientFocus {get; set;}

Property Value

Any value in the range from  0 to 1.

Overridable

Layout-file

Description

A value from 0 through 1 that specifies the center of the gradient. This value is only significant for layouts where Border=LinearGradient and BorderGradientShape <> GradientShape.Linear. Linear gradients with BorderGradientShape <> GradientShape.Linear use only the first two colors from the BorderGradientColor-array, where BorderGradientShape(0) represents the starting color and BorderGradientShape(1) the ending color.

The BorderGradientFocus is the point where the gradient is composed only of the ending color. The BorderGradientFocus represents a location as a proportion of the distance along the gradient line. The gradient falls off to the starting color based on either a bell curve shape (as in a normal distribution curve) or a triangular curve shape to both sides. In other words, the ending color can be imagined as the peak of a symmetrical curve and the starting color as the valleys on both sides of that curve. 

The concept of the gradient focus is easier to understand with some rendered examples, as provided by the following table. In the samples we use BorderGradientMode=Horizontal, which makes the gradient flow from left to right. In this horizontal setting, the focus position also ranges from Left=0 to Right=1

 

BorderGradient settings Result Description
With focus=0 we get the pure ending color (Blue) on the far left side of the border. From there the gradient falls off to the right until it becomes pure starting color (OrangeRed). (The left side of the curve is outside the bounds of the tooltip.)
As this sample shows, setting the focus=0.25 makes the pure ending color (the blue peak) move more to the right. Now also a part of the left slope becomes visible.
As expected, the ending color (the blue peak of the curve) is now exactly in the middle of the tooltip and the gradient falls symmetrically off to both sides until it becomes the pure starting color (OrangeRed) at the left and right edges of the tooltip.
With the focus on the opposite side as in the first sample, we now get into view only the left slope of the curve, with the starting color (OrangeRed) on the right and the ending color (Blue) on the left side of the tooltip.

 

With other BorderGradientModes then Horizontal, the focus axis has to be rotated accordingly. For BorderGradientMode=Vertical it runs from the top to the bottom of the tooltip (rotate the samples 90° clockwise). For BorderGradientMode=ForwardDiagonal it runs from the upper left to the lower right corner of the tooltip (rotate the samples 45° clockwise). With BorderGradientMode=BackwardDiagonal the focus axis runs from the upper right to the lower left corner.

If specified at the component-level for a tooltip component (i.e. by defining the BorderGradientFocus directly for the component), the assigned focus position will become the default BorderGradientFocus for the tooltips of all controls on the same form:

'Assign a new linear gradient focus position to the tooltip component

Me.MultiLine.GetMultiLineToolTip(Panel1).BorderGradientFocus = 0.5

This default BorderGradientFocus can be overridden for each control through the Override-property provided to all controls on the same form by the tooltip component (see "The Override-Property").

If the override-value for the BorderGradientFocus has to be set or changed at runtime for the tooltip of a specific control, code like the following is needed:

'Assign a new linear gradient focus position to the override-object for Panel1

Me.MultiLine.GetMultiLineToolTip(Panel1).Override _

.BorderOverride.BorderGradientFocus = 0.75

Example 1

This statements define a linear gradient border at the component level. The individual colors of the BorderGradientColors-property are changed and a triangular BorderGradientShape with the a centered focus is set:

'define a linear gradient border for the tooltips provided by the component (MultiLine).

Me.MultiLine.Border = BorderStyle.LinearGradient

Me.MultiLine.BorderGradientMode = LinearGradientMode.Horizontal

Me.MultiLine.BorderWidth = 15  'make the border 15 pixel wide

'assign the start-color...

Me.MultiLine.BorderGradientColors(0) = Color.OrangeRed 

'...and the end-color for the gradient.

Me.MultiLine.BorderGradientColors(1) = Color.Blue

'set the gradient shape...

Me.MultiLine.BorderGradientShape = GradientShape.Triangular

'...and it's focus position.

Me.MultiLine.BorderGradientFocus = 0.5