Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxTitleSettings Class

Contains title settings.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
public class DxTitleSettings :
    TitleBaseSettings

#Remarks

Use DxTitleSettings objects to customize title settings for the following components:

DxBarGauge
A component that visualizes data as circular bars where each bar indicates a single value.
DxSankey
A component that depicts value flow between two entity sets.
DxRangeSelector
An interactive component that visualizes data on a linear scale and allows users to select a value range.

To display the target component’s title, add a DxTitleSettings object to component markup and specify the Text property.

#Component-Level Settings

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

Text
Specifies title text.
PlaceholderSize
Reserves an area for the title and its subtitle.
HorizontalAlignment | VerticalAlignment
Position the title and its subtitle in the legend pane.
TextOverflow | WordWrap
Specify how to display overflowing title text.

#Nested Objects

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

DxSubtitleSettings
Contains subtitle settings.
DxFontSettings
Contains the element’s font settings.
DxMarginSettings
Contains settings for the element’s margins.

#Example

The following code snippet customizes the Bar Gauge‘s title and subtitle:

Bar Gauge - Title and Subtitle Customization

Razor
<DxBarGauge Width="100%"
            Height="500px"
            StartValue="0"
            EndValue="100"
            Values="@Values">
    <DxTitleSettings Text="Custom Title"
                     VerticalAlignment="VerticalEdge.Bottom">
        <DxFontSettings Size="28" Weight="600" />
        <DxSubtitleSettings Text="Custom Subtitle">
            <DxFontSettings Opacity="0.5" Weight="500" />
        </DxSubtitleSettings>
    </DxTitleSettings>
    @* ... *@
</DxBarGauge>

@code {
    double[] Values = new double[] { 47.27, 65.32, 84.59, 81.86, 99 };
    // ...
}

#Inheritance

Object
ComponentBase
DxSettingsComponent<DevExpress.Blazor.ClientComponents.Internal.TitleSettingsModel>
DxComplexSettingsComponent<TitleBaseSettings, DevExpress.Blazor.ClientComponents.Internal.TitleSettingsModel>
TextBaseSettings<TitleBaseSettings, DevExpress.Blazor.ClientComponents.Internal.TitleSettingsModel>
TitleBaseSettings
DxTitleSettings
See Also