|
1 | | -# How-to-change-the-Xamarin.Forms-numeric-textbox-style-using-its-visual-states |
| 1 | +# How to change the Xamarin.Forms numeric textbox style using its visual states |
2 | 2 |
|
3 | | -This article explains how to customize the Syncfusion Xamarin.Forms numeric text box control using visual states. |
| 3 | +This repository contains sample to customize the [Syncfusion Xamarin.Forms Numeric TextBox](https://help.syncfusion.com/xamarin/numeric-entry/getting-started) control's style using visual states. |
4 | 4 |
|
5 | | -Let’s have a use case to keep default styles with having different background color which is varying based on its visual states if then Xamarin.Forms numeric text box control allows to do that with the help of global styles in Xamarin.Forms as per in below code snippet. |
| 5 | +Please refer the KB through this [link](https://www.syncfusion.com/kb/11785/how-to-change-the-xamarin-forms-numeric-textbox-style-using-its-visual-states). |
6 | 6 |
|
7 | | -[App.xaml] |
| 7 | +## Syncfusion controls: |
8 | 8 |
|
9 | | -``` |
10 | | - … |
| 9 | +This project used the following Syncfusion control(s): |
| 10 | +* [SfNumericTextBox](https://www.syncfusion.com/xamarin-ui-controls/xamarin-numeric-entry) |
11 | 11 |
|
12 | | -<Application.Resources> |
13 | | - <ResourceDictionary> |
14 | | - <Style x:Key="NumericTextBoxStyle" TargetType="numeric:SfNumericTextBox"> |
15 | | - <Setter Property="VisualStateManager.VisualStateGroups"> |
16 | | - <VisualStateGroupList> |
17 | | - <VisualStateGroup x:Name="CommonStates"> |
18 | | - <VisualState x:Name="Normal"> |
19 | | - <VisualState.Setters> |
20 | | - <Setter Property="BackgroundColor" Value="White" /> |
21 | | - </VisualState.Setters> |
22 | | - </VisualState> |
23 | | - <VisualState x:Name="Disabled"> |
24 | | - <VisualState.Setters> |
25 | | - <Setter Property="BackgroundColor" Value="DarkGray" /> |
26 | | - </VisualState.Setters> |
27 | | - </VisualState> |
28 | | - <VisualState x:Name="Focused"> |
29 | | - <VisualState.Setters> |
30 | | - <Setter Property="BackgroundColor" Value="Yellow" /> |
31 | | - </VisualState.Setters> |
32 | | - </VisualState> |
33 | | - </VisualStateGroup> |
34 | | - </VisualStateGroupList> |
35 | | - </Setter> |
36 | | - </Style> |
37 | | - </ResourceDictionary> |
38 | | - </Application.Resources> |
| 12 | +## Supported platforms |
39 | 13 |
|
40 | | - … |
41 | | -``` |
| 14 | +| Platforms | Supported versions | |
| 15 | +| --------- | ------------------ | |
| 16 | +| Android | API level 21 and later versions | |
| 17 | +| iOS | iOS 9.0 and later versions | |
| 18 | +| UWP | Windows 10 devices | |
42 | 19 |
|
43 | | -[XAML] |
| 20 | +## Requirements to run the sample |
44 | 21 |
|
45 | | -``` |
46 | | - … |
| 22 | +* [Visual Studio](https://visualstudio.microsoft.com/downloads/) or [Visual Studio for Mac](https://visualstudio.microsoft.com/vs/mac/) |
47 | 23 |
|
48 | | -<numeric:SfNumericTextBox x:Name="numericTextBox" Margin="0,20,0,0" Style="{StaticResource NumericTextBoxStyle}" Value="50"/> |
| 24 | +Refer to the following link for more details - [System Requirements](https://help.syncfusion.com/xamarin/system-requirements) |
49 | 25 |
|
50 | | - … |
51 | | -``` |
| 26 | +## How to run the sample |
52 | 27 |
|
53 | | -## Screenshot: |
| 28 | +1. Clone the sample and open it in Visual Studio. |
54 | 29 |
|
55 | | -Normal State: |
56 | | - |
57 | | - |
58 | | - |
59 | | -Focused State: |
60 | | - |
61 | | - |
62 | | - |
63 | | -Disabled State: |
64 | | - |
65 | | - |
66 | | - |
67 | | -## See also |
68 | | - |
69 | | -[To customize the font style of NumericTextBox](https://help.syncfusion.com/xamarin/numeric-entry/font-settings) |
70 | | - |
71 | | -[To set maximum number of demical digits in NumerTextBox](https://help.syncfusion.com/xamarin/numeric-entry/set-maximum-number-of-decimal-digits) |
72 | | - |
73 | | -[Custom numeric format strings](https://docs.microsoft.com/en-us/dotnet/standard/base-types/custom-numeric-format-strings#the--custom-specifier) |
74 | | - |
75 | | -[Number of decimal digits display](https://www.syncfusion.com/kb/7059/how-to-modify-number-of-decimal-digits-display) |
76 | | - |
77 | | -[Allowing null value](https://help.syncfusion.com/xamarin/numeric-entry/assign-nullable-value) |
| 30 | + *Note: If you download the sample using the "Download ZIP" option, right-click it, select Properties, and then select Unblock.* |
| 31 | + |
| 32 | +2. Register your license key in the App.xaml.cs file as demonstrated in the following code. |
78 | 33 |
|
| 34 | + public App() |
| 35 | + { |
| 36 | + //Register Syncfusion license |
| 37 | + Syncfusion.Licensing.SyncfusionLicenseProvider.RegisterLicense("YOUR LICENSE KEY"); |
| 38 | + |
| 39 | + InitializeComponent(); |
| 40 | + |
| 41 | + MainPage = new App1.MainPage(); |
| 42 | + } |
| 43 | + |
| 44 | + Refer to this [link](https://help.syncfusion.com/xamarin/licensing/overview) for more details. |
| 45 | + |
| 46 | +3. Clean and build the application. |
79 | 47 |
|
| 48 | +4. Run the application. |
80 | 49 |
|
| 50 | +## License |
81 | 51 |
|
| 52 | +Syncfusion has no liability for any damage or consequence that may arise by using or viewing the samples. The samples are for demonstrative purposes, and if you choose to use or access the samples, you agree to not hold Syncfusion liable, in any form, for any damage that is related to use, for accessing, or viewing the samples. By accessing, viewing, or seeing the samples, you acknowledge and agree Syncfusion’s samples will not allow you seek injunctive relief in any form for any claim related to the sample. If you do not agree to this, do not view, access, utilize, or otherwise do anything with Syncfusion’s samples. |
0 commit comments