Skip to main content

DxTimeSpanMaskProperties Class

Defines time span mask settings.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.2.dll

NuGet Package: DevExpress.Blazor

Declaration

public class DxTimeSpanMaskProperties :
    DxMaskPropertiesBase

Remarks

You can apply time span masks to the Masked Input component. Time span masks allow users to enter only time intervals. Users can navigate between mask sections (such as days, hours, and minutes) and increase or decrease section values with the Up and Down arrow keys, and the mouse wheel.

Time Span Masks

Run Demo: Time Span Masks

You can choose a mask from a number of predefined patterns or use a standard or custom time span format string. To customize mask-related settings, add the DxTimeSpanMaskProperties component to the editor’s markup:

@using System.Globalization

<MaskedInput @bind-Value="@time" 
            Mask="dd DD hh HH mm MM">
    <DxTimeSpanMaskProperties AllowNegativeValue="false"
                              CaretMode="@MaskCaretMode.Advancing"
                              Culture="Culture"
                              DefaultFocusSection="@TimeSpanSection.Hours"
                              HideAllZeroValueOptionalSections="true"
                              InvalidInputNotificationText="The time interval is invalid."
                              OutOfBoundsValueProcessMode="@TimeSpanOutOfBoundsValueProcessMode.Deny"
                              SelectAllInputMode="@TimeSpanSelectAllInputMode.ResetAllSections"
                              UpdateNextSectionOnCycleChange="true" />
</DxMaskedInput>

@code {
    TimeSpan time new TimeSpan(5, 16, 30, 15, 7);
    CultureInfo Culture = new CultureInfo("fr-FR");
}

Refer to the following topic for more information: Mask Settings.

Inheritance

See Also