Skip to content

Commit 79441d3

Browse files
committed
Modified the README.md
1 parent 26e62f3 commit 79441d3

File tree

4 files changed

+80
-1
lines changed

4 files changed

+80
-1
lines changed

Outputs/NumericTextBoxDisabled.jpg

41.1 KB
Loading

Outputs/NumericTextBoxFocused.jpg

45.3 KB
Loading
41.2 KB
Loading

README.md

Lines changed: 80 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,81 @@
11
# How-to-change-the-Xamarin.Forms-numeric-textbox-style-using-its-visual-states
2-
This article explains How to change the Xamarin.Forms numeric textbox style using its visual states
2+
3+
This article explains how to customize the Syncfusion Xamarin.Forms numeric text box control using visual states.
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.
6+
7+
[App.xaml]
8+
9+
```
10+
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>
39+
40+
41+
```
42+
43+
[XAML]
44+
45+
```
46+
47+
48+
<numeric:SfNumericTextBox x:Name="numericTextBox" Margin="0,20,0,0" Style="{StaticResource NumericTextBoxStyle}" Value="50"/>
49+
50+
51+
```
52+
53+
## Screenshot:
54+
55+
Normal State:
56+
57+
![Output image of NumericTextBox in normal state](Outputs/NumericTextBoxNormalState.jpg)
58+
59+
Focused State:
60+
61+
![Output image of NumericTextBox in focused state](Outputs/NumericTextBoxFocused.jpg)
62+
63+
Disabled State:
64+
65+
![Output image of NumericTextBox in disabled state](Outputs/NumericTextBoxDisabled.jpg)
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)
78+
79+
80+
81+

0 commit comments

Comments
 (0)