We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Syncfusion Feedback

Trusted by the world’s leading companies

Syncfusion Trusted Companies

Overview

The .NET MAUI NumericUpDown control provides a user-friendly experience for capturing numeric input values. It features increment and decrement buttons for users to easily change the value and supports a wide range of numeric formats, including currency, percentage, decimal, and more. Its features enhance the user experience and facilitate input validation.

.NET MAUI NumericUpDown control.


.NET MAUI NumericUpDown code example

Get started with the .NET MAUI NumericUpDown by using just a few lines of XAML code, as illustrated below. Additionally, check out our .NET MAUI NumericUpDown example that demonstrates how to implement the NumericUpDown control.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="NumericUpdownGettingStarted.MainPage"
             xmlns:inputs="clr-namespace:Syncfusion.Maui.Toolkit.NumericUpDown;assembly=Syncfusion.Maui.Toolkit">
    <VerticalStackLayout VerticalOptions="Center">
        <inputs:SfNumericUpDown x:Name="NumericUpDown" 
                        WidthRequest="200"
                        Value="100" 
                        CustomFormat="C2"
                        ShowClearButton="True"
                        Placeholder="Enter input here..."/>
    </VerticalStackLayout>
</ContentPage>

Custom formats

Customize the display of numeric values by applying specific formats to control the number of decimal digits, as well as adding prefixes and suffixes to the input values.

.NET MAUI NumericUpDown custom format.


.NET MAUI NumericUpDown supports multiple cultures.

Globalization

The NumericUpDown control automatically formats its values according to the user’s regional or cultural settings, ensuring a localized experience.


Restriction

The .NET MAUI NumericUpDown control accepts only numerical inputs. However, as explained in the following sections, many more restrictions can be imposed.

.NET MAUI NumericUpDown limits the number range.

Limit the number range

Easily set minimum and maximum values to restrict users from entering numbers outside the defined range.

.NET MAUI NumericUpDown disables value editing.

Disable editing

Use the IsEditable property to prevent users from directly modifying the numeric value in the editor.

.NET MAUI NumericUpDown prevents an empty editor.

Prevent an empty editor

Implement data validation and input handling techniques to ensure that users cannot leave the editor empty or enter null values.


Placeholders

When the input is cleared, display helpful hints with placeholder text to guide users in the NumericUpDown control.

.NET MAUI NumericUpDown placeholder.


.NET MAUI NumericUpDown uses an up-down button.

Up-down placement modes

Customize the position of the up and down buttons by setting the UpDownPlacementMode property to Inline for horizontal orientation and InlineVertical for vertical orientation.


Alignment of up and down buttons

Customize the alignment of the up and down buttons to position them to the left, right, or on both sides of the entry field for enhanced usability.

.NET MAUI NumericUpDown Alignment


.NET MAUI NumericUpDown maximum decimal digits support.

Set maximum decimal digits

Define the number of decimal places displayed in the NumericUpDown control.


Keyboard and mouse interactions

Users can easily adjust the value in the NumericUpDown control by using the arrow keys and the Page Up and Page Down keys. Additionally, while hovering over the control, users can modify the value by rotating the mouse wheel.

.NET MAUI NumericUpDown changes values with keys or mouse.


Percentage display mode

Users have the option to present values in the NumericUpDown control in various percentage formats:

.NET MAUI NumericUpDown value percentage display mode.

Value

Shows the actual numerical value followed by the percent sign.

.NET MAUI NumericUpDown compute percentage display mode.

Compute

Displays the computed value along with a percent sign.


Struggling to decide on the right product?

Our comprehensive competitor comparison of .NET MAUI controls will guide you to the perfect choice.

tick-mark 60+ UI controls
tick-mark 200+ interactive .NET MAUI demos
tick-mark 951K+ downloads

Our Customers Love Us

Having an excellent set of tools and a great support team, Syncfusion® reduces customers’ development time.
Here are some of their experiences.

Rated by users across the globe

Syncfusion .NET MAUI Resources

Awards

Greatness—it’s one thing to say you have it, but it means more when others recognize it. Syncfusion® is proud to hold the following industry awards.

Up arrow icon