--- title: "Seamlessly Integrate Numeric Up-Down UI in Your .NET MAUI App" published_at: "2023-07-18T12:27:01+00:00" modified_at: "2025-03-21T07:40:30+00:00" url: "https://www.syncfusion.com/blogs/post/seamlessly-integrate-numeric-up-down-ui-in-your-net-maui-app" excerpt: "This blog explains the numeric up-down button feature available in the Syncfusion .NET MAUI Numeric Entry control and the steps to get started with it." taxonomy_category: - ".NET MAUI" - "Desktop" - "Mobile" - "Syncfusion" - "UI" - "What's new" taxonomy_post_tag: - ".NET MAUI" - "desktop" - "MAUI" - "Mobile" - "NumericEntry" - "What's New" --- # Seamlessly Integrate Numeric Up-Down UI in Your .NET MAUI App [Vijayakumar Viswanathan](https://www.syncfusion.com/blogs/author/vijayakumar-viswanathan) ![MAUI Numeric updown control](https://www.syncfusion.com/blogs/wp-content/uploads/2023/07/MAUI-Numeric-updown-control.png) In the Essential Studio® [2023 Volume 2](https://www.syncfusion.com/forums/183035/essential-studio-2023-volume-2-main-release-v22-1-34-is-available-for-download) release, we introduced a new [Numeric Entry control for the .NET MAUI](https://www.syncfusion.com/maui-controls/maui-numeric-entry) platform. This control offers e**ntry** and n** umeric** u** p**–d** own** behaviors for getting numeric inputs from users. The numeric up-down behavior provides increment and decrement buttons that greatly enhance the user experience by providing an intuitive way to enter numeric values. These buttons also provide range validation support that permits numeric input only within a specific range. In this blog, we will explore the numeric up-down button feature in the .NET MAUI Numeric Entry control and see how to begin working with its essential features. ## Key features The numeric up-down buttons support the following key features: - [Range validation](#Range) - [Step value](#Step) - [Cultures](#Cultures) - [Custom format](#Custom) Let’s check them out! ### Range validation You can set lower and upper boundaries for the input value to restrict users from submitting a value outside a particular range. For example, in a ticket reservation system, you can limit travelers to book a maximum of ten tickets at once. ![Range Validation Feature with Numeric Up-Down Buttons](https://www.syncfusion.com/blogs/wp-content/uploads/2023/07/Range-Validation-Feature-with-Numeric-Up-Down-Buttons.gif) Range Validation Feature with Numeric Up-Down Buttons ### Step value You can set the step value for each increment or decrement operation performed with the up and down buttons. ![Customized Step Value with Numeric Up-Down Buttons](https://www.syncfusion.com/blogs/wp-content/uploads/2023/07/Customized-Step-Value-with-Numeric-Up-Down-Buttons.gif) Customized Step Value with Numeric Up-Down Buttons ### Cultures The .NET MAUI Numeric Entry control automatically adapts values according to regional or cultural settings, guaranteeing that your app is localized and caters to various cultural practices. You can enjoy the same feature in the numeric up-down button UI. ![Custom Culture Support with Numeric Up-Down Buttons](https://www.syncfusion.com/blogs/wp-content/uploads/2023/07/Custom-Culture-Support-with-Numeric-Up-Down-Buttons.png) Custom Culture Support with Numeric Up-Down Buttons ### Custom format You can also customize the format of the numerical values, select the number of decimal digits, and even incorporate prefixes and suffixes in the numeric up-down button UI. ![Custom Format Support with Numeric Up-Down Buttons](https://www.syncfusion.com/blogs/wp-content/uploads/2023/07/Custom-Format-Support-with-Numeric-Up-Down-Buttons-1.png) Custom Format Support with Numeric Up-Down Buttons **Note:** For more details, refer to the [up-down button in .NET MAUI Numeric Entry control documentation](https://help.syncfusion.com/maui/numericentry/updown-button) . ## Integrating the numeric up-down button in a .NET MAUI app Let’s turn our attention to integrating the numeric up-down buttons into your .NET MAUI app by following these steps: **Step 1******:**** Create [a .NET MAUI application](https://learn.microsoft.com/en-us/dotnet/maui/get-started/first-app?view=net-maui-7.0&tabs=vswin&pivots=devices-android) . **Step 2******:**** The Syncfusion .NET MAUI controls are available on the [NuGet Gallery](https://www.nuget.org/) . To add the .NET MAUI **SfNumericEntry** control to your project, open the ** NuGet package manager** in [Visual Studio](https://visualstudio.microsoft.com/) . Search for the [Syncfusion.Maui.Inputs](https://www.nuget.org/packages/Syncfusion.Maui.Inputs) package and then install it. **Step 3******:**** Register the handler for Syncfusion core in the ** MauiProgram.cs** file. ``` using Microsoft.Maui; using Microsoft.Maui.Hosting; using Microsoft.Maui.Controls.Compatibility; using Microsoft.Maui.Controls.Hosting; using Microsoft.Maui.Controls.Xaml; using Syncfusion.Maui.Core.Hosting; namespace Numeric up-downSample { public static class MauiProgram { public static MauiApp CreateMauiApp() { var builder = MauiApp.CreateBuilder(); builder .UseMauiApp() .ConfigureSyncfusionCore() .ConfigureFonts(fonts => { fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular"); }); return builder.Build(); } } } ``` **Step 4****:** Add the ** Syncfusion.Maui.Core** and ** Syncfusion.Maui.Inputs** namespaces in your XAML page. ``` xmlns:inputs="clr-namespace:Syncfusion.Maui.Inputs;assembly=Syncfusion.Maui.Inputs" ``` **Step 5****:** Finally, initialize the Syncfusion .NET MAUI ** Numeric Entry** control. Here, we’ll set the value of the ** UpDownPlacementMode** property as ** Inline** to integrate the numeric up-down behavior in your app. Refer to the following code example. ``` ``` After executing the previous code examples, our output will look like the following image: ![Integrating Numeric Up-Down Button .NET MAUI App](https://www.syncfusion.com/blogs/wp-content/uploads/2023/07/Integrating-Numeric-Up-Down-Button-.NET-MAUI-App.png) Integrating Numeric Up-Down Button .NET MAUI App ## GitHub reference For more details, refer to the [.NET MAUI numeric up-down button GitHub demo](https://github.com/SyncfusionExamples/maui-numericentry-samples) . ## Conclusion Thanks for reading! In this blog, we explored the numeric up-down button feature of the Syncfusion [.NET MAUI Numeric Entry](https://www.syncfusion.com/maui-controls/maui-numeric-entry) control. This feature is available in our [2023 Volume 2](https://www.syncfusion.com/forums/183035/essential-studio-2023-volume-2-main-release-v22-1-34-is-available-for-download) release. Try it out now and leave your feedback in the comment section below! Check out our [release notes](https://www.syncfusion.com/products/release-history) and [What’s New](https://www.syncfusion.com/products/whatsnew) pages to see the other updates in this release. Also, we hope you will download [Essential Studio® for .NET MAUI](https://www.syncfusion.com/downloads/maui) to start evaluating the features immediately. You can always contact us through our [support forum](https://www.syncfusion.com/forums) , [support portal](https://support.syncfusion.com/) , or [feedback portal](https://www.syncfusion.com/feedback/) . We are always happy to help you! ## Related Blogs - [Introducing the New .NET MAUI Expander Control](https://www.syncfusion.com/blogs/post/new-dotnet-maui-expander-control.aspx) - [Unveiling the Cutting-Edge .NET MAUI Chips Control](https://www.syncfusion.com/blogs/post/new-dotnet-maui-chips-control.aspx) - [Chart of the Week: Creating .NET MAUI Area Chart for US Tech Companies Adopting Dual-Class Voting Structures](https://www.syncfusion.com/blogs/post/dotnet-maui-area-chart-visualize-us-companies-adopting-dual-class-voting.aspx) - [Introducing the New .NET MAUI Numeric Entry Control](https://www.syncfusion.com/blogs/post/dotnet-maui-numeric-entry.aspx)