DxTooltipSettings Class

Contains tooltip settings.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

public class DxTooltipSettings :
    DxComplexSettingsComponent<DxTooltipSettings, TooltipSettingsModel>,
    IModelProvider<BorderSettingsModel>,
    IModelProvider<FontSettingsModel>,
    IModelProvider<TextFormatSettingsModel>,
    IModelProvider<ShadowSettingsModel>

Remarks

Use DxTooltipSettings objects to configure tooltips for the following components:

DxBarGaugeA component that visualizes data as circular bars where each bar indicates a single value.DxSankeyA component that depicts value flow between two entity sets.DxSparklineA component that visualizes value trends as an inline graph.

To enable the component’s tooltip functionality, add a DxTooltipSettings object to component markup and set its Enabled property to true.

Component-Level Settings

The DxTooltipSettings component allows you to specify the following properties at the component level:

Color | Opacity | ArrowLength | CornerRadiusCustomize tooltip appearance.PaddingLeftRight | PaddingTopBottomConfigure paddings between tooltip edges and its content.ZIndexSpecifies the tooltip stack order.

Nested Objects

In addition to component-level settings, you can also add the following objects to DxTooltipSettings markup:

DxBorderSettingsContains the element’s border settings.DxFontSettingsContains the element’s font settings.DxShadowSettingsContains settings for the element’s shadows.DxTextFormatSettingsContains the element’s format settings.

The following code snippet configures tooltips in the DxBarGauge component:

razor

<DxBarGauge Width="100%"
            Height="500px"
            StartValue="0"
            EndValue="100"
            Values="@Values">
    @* ... *@
    <DxTooltipSettings Enabled="true" Color="lightyellow" >
        <DxFontSettings Size="16" Weight="600" />
        <DxTextFormatSettings LdmlString="@LabelFormat" />
        <DxShadowSettings Blur="8" Color="purple" />
        <DxBorderSettings LineStyle="LineStyle.DashDotDot" Width="2" Color="purple" />
    </DxTooltipSettings>
</DxBarGauge>

@code {
    double[] Values = new double[] { 47.27, 65.32, 84.59, 81.86, 99 };
    string LabelFormat = "##.# '%' ";
}

Implements

Inheritance

Object ComponentBase DxSettingsComponent<DevExpress.Blazor.ClientComponents.Internal.TooltipSettingsModel> DxComplexSettingsComponent<DxTooltipSettings, DevExpress.Blazor.ClientComponents.Internal.TooltipSettingsModel> DxTooltipSettings