Class SfTooltip

The SfTooltip component displays a pop-up containing information or a message when you hover, click, focus, or touch an element.

Inheritance

System.Object

SfBaseComponent

SfTooltip

Inherited Members

SfBaseComponent.Dispose()

SfBaseComponent.Dispose(Boolean)

SfBaseComponent.OnObservableChange(String, Object, Boolean, NotifyCollectionChangedEventArgs)

Namespace: Syncfusion.Blazor.Popups

Assembly: Syncfusion.Blazor.dll

Syntax

public class SfTooltip : SfBaseComponent

Constructors

SfTooltip()

Declaration

public SfTooltip()

Properties

Animation

It is used to customize the animation of the Tooltip while opening and closing. The animation property also allows you to set delay, duration, and various other effects of your choice. You can set the same or different animation options to the Tooltip when it is in the open or close state.

Declaration

public AnimationModel Animation { get; set; }

Property Value

Type	Description
AnimationModel

Closed

The event Closed will be fired when the Tooltip component gets closed.

Declaration

public EventCallback<TooltipEventArgs> Closed { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TooltipEventArgs>

CloseDelay

To close the Tooltip after a specified delay in millisecond.

Declaration

public double CloseDelay { get; set; }

Property Value

Type	Description
System.Double

Container

It is used to set the container element in which the Tooltip’s pop-up will be appended. It's default value is body, in which the Tooltip’s pop-up will be appended.

Declaration

public string Container { get; set; }

Property Value

Type	Description
System.String

Content

To display the content of the Tooltip which can be a string element.

Declaration

public string Content { get; set; }

Property Value

Type	Description
System.String

Created

The event Created will be fired after the Tooltip component is created.

Declaration

public EventCallback<object> Created { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<System.Object>

CssClass

To customize the Tooltip which accepts the custom CSS class names that define specific user-defined styles and themes to be applied to the Tooltip element.

Declaration

public string CssClass { get; set; }

Property Value

Type	Description
System.String

Destroyed

The event Destroyed will be fired when the Tooltip component is destroyed.

Declaration

public EventCallback<object> Destroyed { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<System.Object>

EnableHtmlSanitizer

This property has been deprecated as we achieve this behavior by using ChildContent of render fragment type and and Content as a string value.

Declaration

public bool EnableHtmlSanitizer { get; set; }

Property Value

Type	Description
System.Boolean

EnablePersistence

As there are no properties required to persist in tooltip component, this property is deprecated.

Declaration

public bool EnablePersistence { get; set; }

Property Value

Type	Description
System.Boolean

EnableRtl

To enable or disable the rendering component in the right to left direction.

Declaration

public bool EnableRtl { get; set; }

Property Value

Type	Description
System.Boolean

Height

To set the height of the Tooltip component which accepts the string values. When the Tooltip content gets overflowed due to the height value, then the scroll mode will be enabled.

Declaration

public string Height { get; set; }

Property Value

Type	Description
System.String

HtmlAttributes

Adds the additional html attributes to the Tooltip element.

Declaration

public Dictionary<string, object> HtmlAttributes { get; set; }

Property Value

Type	Description
System.Collections.Generic.Dictionary<System.String, System.Object>

ijsRuntime

Declaration

protected IJSRuntime ijsRuntime { get; set; }

Property Value

Type	Description
Microsoft.JSInterop.IJSRuntime

IsSticky

To display the Tooltip in an open state until it is closed manually.

Declaration

public bool IsSticky { get; set; }

Property Value

Type	Description
System.Boolean

MouseTrail

It allows the Tooltip to follow the mouse pointer moves over the specified target element.

Declaration

public bool MouseTrail { get; set; }

Property Value

Type	Description
System.Boolean

OffsetX

It sets the space between the target and Tooltip element in X-axis.

Declaration

public double OffsetX { get; set; }

Property Value

Type	Description
System.Double

OffsetY

It sets the space between the target and Tooltip element in Y-axis.

Declaration

public double OffsetY { get; set; }

Property Value

Type	Description
System.Double

OnClose

The event OnClose will be fired before the Tooltip hides from the screen. The Tooltip close can be prevented by setting the cancel argument value to true.

Declaration

public EventCallback<TooltipEventArgs> OnClose { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TooltipEventArgs>

OnCollision

The event OnCollision will be fired for every collision fit calculation.

Declaration

public EventCallback<TooltipEventArgs> OnCollision { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TooltipEventArgs>

OnOpen

The event OnOpen will be fired before the Tooltip is displayed over the target element. When one of its arguments cancel is set to true, the Tooltip display can be prevented. This event is mainly used to refresh the Tooltip positions dynamically or to set customized styles in it and so on.

Declaration

public EventCallback<TooltipEventArgs> OnOpen { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TooltipEventArgs>

OnRender

The event OnRender will be fired before the Tooltip and its contents will be added to the DOM. When one of its arguments cancel is set to true, the Tooltip can be prevented from rendering on the page. This event is mainly used to customize the Tooltip before it shows up on the screen. For example, to load the AJAX content or to set new animation effects on the Tooltip, this event can be opted.

Declaration

public EventCallback<TooltipEventArgs> OnRender { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TooltipEventArgs>

OpenDelay

To open the Tooltip after a specified delay in millisecond.

Declaration

public double OpenDelay { get; set; }

Property Value

Type	Description
System.Double

Opened

The event Opened will be fired after the Tooltip component gets opened.

Declaration

public EventCallback<TooltipEventArgs> Opened { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.EventCallback<TooltipEventArgs>

OpensOn

To determine the type of open mode to display the Tooltip content. The available open modes are Auto, Hover, Click, Focus, and Custom.

Declaration

public string OpensOn { get; set; }

Property Value

Type	Description
System.String

Position

To set the position of the Tooltip element with respect to the Target element.

Declaration

public Position Position { get; set; }

Property Value

Type	Description
Position

ShowTipPointer

To show or hide the tip pointer of the Tooltip.

Declaration

public bool ShowTipPointer { get; set; }

Property Value

Type	Description
System.Boolean

Target

To denote the target selector where the Tooltip needs to be displayed. The target element is considered as the parent container.

Declaration

public string Target { get; set; }

Property Value

Type	Description
System.String

TipPointerPosition

It is used to customize the position of the tip pointer on the tooltip. The available options are Auto, Start, Middle, and End. When set to auto, the tip pointer gets auto adjusted within the space of the target's length and does not point outside.

Declaration

public TipPointerPosition TipPointerPosition { get; set; }

Property Value

Type	Description
TipPointerPosition

Width

To set the width of the Tooltip component which accepts a string value. When set to auto, the Tooltip width gets auto adjusted to display its content within the viewable screen.

Declaration

public string Width { get; set; }

Property Value

Type	Description
System.String

WindowCollision

It is used to set the collision target element as page viewport (window) or Tooltip element, when using the target. If this property is enabled, tooltip will perform the collision calculation between the target elements. and viewport(window) instead of Tooltip element.

Declaration

public bool WindowCollision { get; set; }

Property Value

Type	Description
System.Boolean

Methods

BuildRenderTree(RenderTreeBuilder)

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder	__builder

CloseAsync(TooltipAnimationSettings)

It is used to hide the Tooltip with a specific animation effect. You can pass the animation settings for tooltip close action.

Declaration

public Task CloseAsync(TooltipAnimationSettings animation = null)

Parameters

Type	Name	Description
TooltipAnimationSettings	animation	animation.

Returns

Type	Description
System.Threading.Tasks.Task	="Task".

OnAfterRenderAsync(Boolean)

Method invoked after each time the component has been rendered.

Declaration

protected override Task OnAfterRenderAsync(bool firstRender)

Parameters

Type	Name	Description
System.Boolean	firstRender	Set to true for the first time component rendering; otherwise gets false.

Returns

Type	Description
System.Threading.Tasks.Task	="Task".

Overrides

SfBaseComponent.OnAfterRenderAsync(Boolean)

OnInitializedAsync()

Method invoked when the component is ready to start.

Declaration

protected override Task OnInitializedAsync()

Returns

Type	Description
System.Threading.Tasks.Task	="Task".

Overrides

SfBaseComponent.OnInitializedAsync()

OnParametersSetAsync()

Method invoked when any changes in component state occurs.

Declaration

protected override Task OnParametersSetAsync()

Returns

Type	Description
System.Threading.Tasks.Task	="Task".

OpenAsync(Nullable<ElementReference>, TooltipAnimationSettings)

It is used to show the Tooltip on the specified target with specific animation settings. You can also pass the additional arguments like target element in which the tooltip should appear and animation settings for the tooltip open action.

Declaration

public Task OpenAsync(Nullable<ElementReference> element = null, TooltipAnimationSettings animation = null)

Parameters

Type	Name	Description
System.Nullable<Microsoft.AspNetCore.Components.ElementReference>	element	element.
TooltipAnimationSettings	animation	animation.

Returns

Type	Description
System.Threading.Tasks.Task	="Task".

RefreshAsync()

Refresh the tooltip component when the target element is dynamically used.

Declaration

public Task RefreshAsync()

Returns

Type	Description
System.Threading.Tasks.Task	="Task".

RefreshPositionAsync(Nullable<ElementReference>)

Dynamically refreshes the tooltip element position based on the target element.

Declaration

public Task RefreshPositionAsync(Nullable<ElementReference> target = null)

Parameters

Type	Name	Description
System.Nullable<Microsoft.AspNetCore.Components.ElementReference>	target	target.

Returns

Type	Description
System.Threading.Tasks.Task	="Task".