menu

WinUI

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class SfNumberBox - WinUI API Reference | Syncfusion

    Show / Hide Table of Contents

    Class SfNumberBox

    Represents a control that can be used to display and edit numbers.

    Inheritance
    System.Object
    SfNumberBox
    Namespace: Syncfusion.UI.Xaml.Editors
    Assembly: Syncfusion.Editors.WinUI.dll
    Syntax
    public class SfNumberBox : Control
    Examples
    <editor:SfNumberBox PlaceholderText = "Enter your age"
       Value="{x:Bind Path=ViewModel.NumberBoxValue, Mode=TwoWay}" />

    Constructors

    SfNumberBox()

    Initializes a new instance of the SfNumberBox class.

    Declaration
    public SfNumberBox()

    Fields

    AllowNullProperty

    Identifies AllowNull dependency property.

    Declaration
    public static readonly DependencyProperty AllowNullProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    CultureProperty

    Identifies Culture dependency property.

    Declaration
    public static readonly DependencyProperty CultureProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    CustomFormatProperty

    Identifies CustomFormat dependency property.

    Declaration
    public static readonly DependencyProperty CustomFormatProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    DescriptionProperty

    Identifies Description dependency property.

    Declaration
    public static readonly DependencyProperty DescriptionProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    HeaderProperty

    Identifies Header dependency property.

    Declaration
    public static readonly DependencyProperty HeaderProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    HeaderTemplateProperty

    Identifies HeaderTemplate dependency property.

    Declaration
    public static readonly DependencyProperty HeaderTemplateProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    InputScopeProperty

    Identifies InputScope dependency property.

    Declaration
    public static readonly DependencyProperty InputScopeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    IsEditableProperty

    Identifies IsEditable dependency property.

    Declaration
    public static readonly DependencyProperty IsEditableProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    LargeChangeProperty

    Identifies LargeChange dependency property.

    Declaration
    public static readonly DependencyProperty LargeChangeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    MaximumProperty

    Identifies Maximum dependency property.

    Declaration
    public static readonly DependencyProperty MaximumProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    MinimumProperty

    Identifies Minimum dependency property.

    Declaration
    public static readonly DependencyProperty MinimumProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    NumberFormatterProperty

    Identifies NumberFormatter dependency property.

    Declaration
    public static readonly DependencyProperty NumberFormatterProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    PlaceholderTextProperty

    Identifies PlaceholderText dependency property.

    Declaration
    public static readonly DependencyProperty PlaceholderTextProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ShowClearButtonProperty

    Identifies ShowClearButton dependency property.

    Declaration
    public static readonly DependencyProperty ShowClearButtonProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for the ShowClearButton dependency property.

    SmallChangeProperty

    Identifies SmallChange dependency property.

    Declaration
    public static readonly DependencyProperty SmallChangeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    TextBoxVisibilityProperty

    Identifies TextBoxVisibility dependency property.

    Declaration
    public static readonly DependencyProperty TextBoxVisibilityProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    UpDownPlacementModeProperty

    Identifies UpDownPlacementMode dependency property.

    Declaration
    public static readonly DependencyProperty UpDownPlacementModeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ValueProperty

    Identifies Value dependency property.

    Declaration
    public static readonly DependencyProperty ValueProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    Properties

    AllowNull

    Gets or sets a value indicating whether the SfNumberBox allows null value or not.

    Declaration
    public bool AllowNull { get; set; }
    Property Value
    Type Description
    System.Boolean

    true when SfNumberBox allows null value input, otherwise false. The default value is true.

    Remarks

    Placeholder text will only appear when Value is set to NaN or null or when the input is cleared by the user.

    Culture

    Gets or sets the culture for SfNumberBox.

    Declaration
    public CultureInfo Culture { get; set; }
    Property Value
    Type Description
    System.Globalization.CultureInfo

    The default value is "en-US".

    Remarks

    When NumberFormatter is not null, Culture property not effective.

    CustomFormat

    Gets or sets the format used to specify the formatting of Value.

    Declaration
    public string CustomFormat { get; set; }
    Property Value
    Type Description
    System.String

    The default value is null.

    Remarks

    Change the display format of the Value using NumberFormatter or CustomFormat. When both NumberFormatter and CustomFormat are specified, CustomFormat will take higher precedence. NumberFormatter.

    Examples

    To display custom text.

    editor.CustomFormatter = "#.# dollars";

    To display a minimum of 2 decimal digits and maximum of 4 digits, with grouping.

    editor.CustomFormatter = "#,0.00##";

    To remove group separator.

    editor.CustomFormatter = "#,#.#";

    To display currency format.

    editor.CustomFormatter = "C";

    To display percentage format, with a minimum of 2 decimal digits.

    editor.CustomFormatter = "#.#%";

    Description

    Gets or sets content that is shown below the control. The content should provide guidance about the input expected by the control.

    Declaration
    public object Description { get; set; }
    Property Value
    Type Description
    System.Object

    The default value is null.

    Examples

    Set string as description.

    <!-- String description -->
    <editor:SfNumberBox Description = "Quantity" />

    Set a control as description.

    <!-- TextBlock as description -->
    <editor:SfNumberBox>
        <editor:SfNumberBox.Description>
            <TextBlock Text = "Quantity" FontWeight="Bold"/>
        </editor:SfNumberBox.Description>
    </editor:SfNumberBox>

    Header

    Gets or sets the content for the control's header.

    Declaration
    public object Header { get; set; }
    Property Value
    Type Description
    System.Object

    The default value is null.

    Examples

    Set string as Header.

    <!-- String header -->
    <editor:SfNumberBox Header = "Quantity" />

    Set a control as Header.

    <!-- TextBlock as header -->
    <editor:SfNumberBox>
        <editor:SfNumberBox.Header>
            <TextBlock Text = "Quantity" FontWeight="Bold"/>
        </editor:SfNumberBox.Header>
    </editor:SfNumberBox>

    Apply a DataTemplate as Header.

    <!-- Templated header -->
    <editor:SfNumberBox Header = "Quantity">
        <editor:SfNumberBox.HeaderTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding}" FontWeight="Bold"/>
            </DataTemplate>
        </editor:SfNumberBox.HeaderTemplate>
    </editor:SfNumberBox>

    HeaderTemplate

    Gets or sets the DataTemplate used to display the content of the control's header.

    Declaration
    public DataTemplate HeaderTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    The default value is null.

    Examples

    Set string as Header.

    <!-- String header -->
    <editor:SfNumberBox Header = "Quantity" />

    Set a control as Header.

    <!-- TextBlock as header -->
    <editor:SfNumberBox>
        <editor:SfNumberBox.Header>
            <TextBlock Text = "Quantity" FontWeight="Bold"/>
        </editor:SfNumberBox.Header>
    </editor:SfNumberBox>

    Apply a DataTemplate as Header.

    <!-- Templated header -->
    <editor:SfNumberBox Header = "Quantity">
        <editor:SfNumberBox.HeaderTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding}" FontWeight="Bold"/>
            </DataTemplate>
        </editor:SfNumberBox.HeaderTemplate>
    </editor:SfNumberBox>

    InputScope

    Gets or sets the context for input used.

    Declaration
    public InputScope InputScope { get; set; }
    Property Value
    Type
    Microsoft.UI.Xaml.Input.InputScope
    See Also
    Use input scope to change the touch keyboard

    IsEditable

    Gets or sets a value indicating whether the SfNumberBox allows editing the value or not.

    Declaration
    public bool IsEditable { get; set; }
    Property Value
    Type Description
    System.Boolean

    true when SfNumberBox is editable, otherwise false. The default value is true.

    LargeChange

    Gets or sets the value that is added to or subtracted from Value when a large change is made, such as with the PageUP and PageDown keys.

    Declaration
    public double LargeChange { get; set; }
    Property Value
    Type Description
    System.Double

    The default value is 10.

    Maximum

    Gets or sets the numerical maximum for Value.

    Declaration
    public double Maximum { get; set; }
    Property Value
    Type Description
    System.Double

    The default value is double.MaxValue.

    Minimum

    Gets or sets the numerical minimum for Value.

    Declaration
    public double Minimum { get; set; }
    Property Value
    Type Description
    System.Double

    The default value is double.MinValue.

    NumberFormatter

    Gets or sets the object used to specify the formatting of Value.

    Declaration
    public INumberFormatter NumberFormatter { get; set; }
    Property Value
    Type Description
    Windows.Globalization.NumberFormatting.INumberFormatter

    The default value is null.

    Remarks

    Change the display format of the Value using NumberFormatter or CustomFormat. When both NumberFormatter and CustomFomat are specified, CustomFormat will take higher precedence. CustomFormat.

    Examples

    To display a minimum of 2 decimal digits and maximum of 4 digits.

    editor.NumberFormatter = new DecimalFormatter()
    {
        FractionDigits = 2,
        NumberRounder = new IncrementNumberRounder
        {
            Increment = 0.0001
        }
    };

    To remove group separator and change the language.

    editor.NumberFormatter = new DecimalFormatter()
    {
        IsGrouped = false,
        NumeralSystem = "Arab",
    };

    To display currency format.

    editor.NumberFormatter = new CurrencyFormatter("USD");

    To display percentage format, with a minimum of 2 decimal digits.

    editor.NumberFormatter = new PercentFormatter()
    {
        FractionDigits = 2
    };
    See Also
    DecimalFormatter
    CurrencyFormatter
    PercentFormatter

    PlaceholderText

    Gets or sets the text that is displayed in the control until the value is changed by a user action or some other operation.

    Declaration
    public string PlaceholderText { get; set; }
    Property Value
    Type Description
    System.String

    The default value is null.

    Remarks

    Placeholder text will only appear when Value is set to NaN or when the input is cleared by the user. Value can be cleared by selecting all the text and delete, by clicking the clear button, or by setting Value to null. Value can be cleared, only when AllowNull is set to true.

    ShowClearButton

    Gets or sets a value indicating whether to show or hide the clear button in SfNumberBox.

    Declaration
    public bool ShowClearButton { get; set; }
    Property Value
    Type Description
    System.Boolean

    The default value is true.

    SmallChange

    Gets or sets the value that is added to or subtracted from Value when a small change is made, such as with an arrow key or scrolling.

    Declaration
    public double SmallChange { get; set; }
    Property Value
    Type Description
    System.Double

    The default value is 1.

    TextBoxVisibility

    Gets or sets a value indicating whether to show or hide the text box.

    Declaration
    public Visibility TextBoxVisibility { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Visibility

    The default value is visible.

    Remarks

    If the value is set to Collapse, only the up and down buttons will be visible.

    UpDownPlacementMode

    Gets or sets a value that indicates the placement of buttons used to increment or decrement the Value property.

    Declaration
    public NumberBoxUpDownPlacementMode UpDownPlacementMode { get; set; }
    Property Value
    Type Description
    NumberBoxUpDownPlacementMode

    Default value is Hidden.

    Value

    Gets or sets the numeric value of a SfNumberBox.

    Declaration
    public Nullable<double> Value { get; set; }
    Property Value
    Type Description
    System.Nullable<System.Double>

    The default value is null.

    Remarks

    When Value is changed, ValueChanged event will be triggered. When editing, Value will not be updated immediately. The entered value will be validated and updated when enter key is pressed or the control loses focus. Disable value editing by setting IsEditable to false.

    Methods

    OnApplyTemplate()

    Declaration
    protected override void OnApplyTemplate()

    OnCreateAutomationPeer()

    Declaration
    protected override AutomationPeer OnCreateAutomationPeer()
    Returns
    Type
    Microsoft.UI.Xaml.Automation.Peers.AutomationPeer

    OnGotFocus(RoutedEventArgs)

    Declaration
    protected override void OnGotFocus(RoutedEventArgs e)
    Parameters
    Type Name Description
    Microsoft.UI.Xaml.RoutedEventArgs e

    OnLostFocus(RoutedEventArgs)

    Declaration
    protected override void OnLostFocus(RoutedEventArgs e)
    Parameters
    Type Name Description
    Microsoft.UI.Xaml.RoutedEventArgs e

    OnPointerEntered(PointerRoutedEventArgs)

    Declaration
    protected override void OnPointerEntered(PointerRoutedEventArgs e)
    Parameters
    Type Name Description
    Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e

    OnPointerExited(PointerRoutedEventArgs)

    Declaration
    protected override void OnPointerExited(PointerRoutedEventArgs e)
    Parameters
    Type Name Description
    Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e

    OnPointerWheelChanged(PointerRoutedEventArgs)

    Declaration
    protected override void OnPointerWheelChanged(PointerRoutedEventArgs e)
    Parameters
    Type Name Description
    Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e

    Events

    ValueChanged

    Occurs after the user triggers evaluation of new input by pressing the Enter key, clicking a spin button, or by changing focus.

    Declaration
    public event EventHandler<ValueChangedEventArgs> ValueChanged
    Event Type
    Type
    System.EventHandler<ValueChangedEventArgs>
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved