Category / Section
How to create NumericTextBox sample in Xamarin.Forms platform
2 mins read
NumericTextBox is an advanced version of the Entry control that restricts input to numeric values. The below illustrates how to create the NumericTextBox control in Xamarin.Forms UWP platforms.
Needed assemblies:
For getting the view of NumericTextBox control, need to add the following assemblies in both PCL and UWP in Xamarin.
Project | Assemblies Required |
PCL | pcl\Syncfusion.SfNumericTextBox.XForms.dll
|
UWP | uwp\Syncfusion.SfInput.UWP.dll
|
Create a NumericTextBox in C# level:
namespace KBSolution
{
public partial class KBSolutionPage : ContentPage
{
public KBSolutionPage()
{
InitializeComponent();
Grid grid = new Grid() { BackgroundColor = Color.FromHex("E4EAF0") };
grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(30) });
grid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(50) });
Label firstNumeric = new Label()
{
Text = "NumericTextBox",
FontSize = 20,
HorizontalOptions = LayoutOptions.Center,
FontAttributes = FontAttributes.Bold,
HorizontalTextAlignment = TextAlignment.Start,
VerticalTextAlignment = TextAlignment.Start
};
SfNumericTextBox sfNumericTextBox = new SfNumericTextBox()
{
WidthRequest = 180,
ParserMode = Parsers.Decimal,
HorizontalOptions = LayoutOptions.Center,
MaximumNumberDecimalDigits = 2,
AllowNull = true,
BorderColor = Color.Blue,
TextColor = Color.Maroon,
Value = 25,
FormatString = "c",
ValueChangeMode = ValueChangeMode.OnKeyFocus,
PercentDisplayMode = PercentDisplayMode.Value,
FontSize = 27
};
grid.Children.Add(firstNumeric, 0, 0);
grid.Children.Add(sfNumericTextBox, 0, 1);
this.Content = grid;
}
}
}
Create a NumericTextBox in Xaml level:
<?xml version="1.0" encoding="utf-8"?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:KBSolution" xmlns:Synfusion="clr-namespace:Syncfusion.SfNumericTextBox.XForms;assembly=Syncfusion.SfNumericTextBox.XForms" x:Class="KBSolution.KBSolutionPage"> <ContentPage.Content> <Grid BackgroundColor="#E4EAF0"> <Grid.RowDefinitions> <RowDefinition Height="30"/> <RowDefinition Height="50"/> </Grid.RowDefinitions> <Label x:Name="firstNumeric" Text="NumericTextBox" FontSize="20" HorizontalOptions="Center" FontAttributes="Bold" HorizontalTextAlignment="Start" VerticalTextAlignment="Start"/> <Synfusion:SfNumericTextBox Grid.Row="1" WidthRequest="180" ParserMode="Decimal" HorizontalOptions="Center" MaximumNumberDecimalDigits="2" AllowNull="true" BorderColor="Blue" TextColor="Maroon" x:Name="sfNumericTextBox" Value="25" FormatString="c" ValueChangeMode="OnKeyFocus" PercentDisplayMode="Value" FontSize="27" /> </Grid > </ContentPage.Content> </ContentPage>
|
|
