Articles in this section
Category / Section

How to customise the text present in the SfNumericUpDown

1 min read

Syncfusion NumericUpDown provides the support to customize the text entered.


To change the Text Size:


Step 1: Set desired value to FontSize and the text size will be set based on the given value.


To change the Text color:


Step 1: Set desired color to TextColor and the text color will be set based on the given color.


To change the Font attribute:


Step 1: Set desired font style to Font and the text color will be set based on the given color.


The below code illustrates the way to achieve this


XAML code to set TextSize, Color and Attribute:


<?xml version="1.0" encoding="utf-8" ?>
<numeric:SfNumericUpDown HeightRequest="50" WidthRequest="60" VerticalOptions="Center" SpinButtonAlignment="Both" Value="10" TextAlignment="Center" FormatString="p" Minimum="0" Maximum="100" StepValue="1" Font="Italic" FontSize="8" TextColor="Red" MaximumDecimalDigits="0" PercentDisplayMode="Value"/>


C# code to set TextSize, Color and Attribute:

namespace NumericUpDown
public partial class MainPage : ContentPage
    SfNumericUpDown numeric = new SfNumericUpDown();
    public MainPage()
        numeric.HeightRequest = 50;
        numeric.WidthRequest = 60;
        numeric.VerticalOptions = LayoutOptions.Center;
        numeric.SpinButtonAlignment = SpinButtonAlignment.Both;
        numeric.Value = 10;
        numeric.TextAlignment = TextAlignment.Center;
        numeric.FormatString = "p";
        numeric.Minimum = 0;
        numeric.Maximum = 100;
        numeric.StepValue = 1;
        numeric.Font = Font.SystemFontOfSize(10, FontAttributes.Italic);
        numeric.TextColor = Color.Red;
        numeric.MaximumDecimalDigits = 0;
        numeric.PercentDisplayMode = PercentDisplayMode.Value;
        this.Content = numeric;

Image after setting TextSize, Color and Attribute:




Did you find this information helpful?
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment