|
| 1 | +## `NumberBox<T>` |
| 2 | + |
| 3 | +Port of WinUI's NumberBox control to support generic number types. |
| 4 | + |
| 5 | +This control supports validation, increment stepping, and computing inline calculations of basic equations such as multiplication, division, addition, and subtraction. |
| 6 | + |
| 7 | +Port of WinUI's `NumberBox` to `NumberBox<T>` to allow for any numeric datatype. Exposes two controls out of the box: `NumberBoxDecimal` and `NumberBoxInt32` but you can extend with your own by creating the class. |
| 8 | + |
| 9 | +### Binding non-nullable values |
| 10 | +The NumberBox<T>.Value is of type `T?` (nullable) to allow for null values when the user clears the text. If you bind to a non-nullable property, you must set `AllowNull="False"` on the control to prevent binding errors. |
| 11 | + |
| 12 | +### Note on assigning decimal values: |
| 13 | +To be able to assign Decimal values to the NumberBoxDecimal control, it can't be done in XAML (although x:Bind works). Support for decimal values is a limitation in the Windows App SDK and is supposed to be addressed in v1.8, but is currently not available in 1.8preview1 (see microsoft/WindowsAppSDK#5756) |
| 14 | + |
| 15 | +## Usage |
| 16 | + |
| 17 | +Register the WinUIEx xmlns namespace and add one of the specified controls : |
| 18 | +```xml |
| 19 | + <ex:NumberBoxInt32 Header="NumberBoxInt32" AllowNull="True" |
| 20 | + AcceptsExpression="True" |
| 21 | + Value="{x:Bind VM.IntValue, Mode=TwoWay}" |
| 22 | + AllowNulls="False" |
| 23 | + Minimum="-10" |
| 24 | + Maximum="10" |
| 25 | + IsWrapEnabled="True" |
| 26 | + Description="32bit Integer" |
| 27 | + PlaceholderText="Enter a whole number" /> |
| 28 | + |
| 29 | +<ex:NumberBoxDecimal Header="NumberBoxDecimal" AllowNull="False" |
| 30 | + AcceptsExpression="False" |
| 31 | + NumberFormatter="{x:Bind VM.Formatter, Mode=OneWay}" |
| 32 | + Value="{x:Bind VM.DecimalValue, Mode=TwoWay}" |
| 33 | + Description="Decimal" |
| 34 | + PlaceholderText="Enter number" />> |
| 35 | +``` |
| 36 | +to |
| 37 | +```xml |
| 38 | +<winex:WindowEx xmlns:winex="using:WinUIEx" Width="1024" Height="768" ...> |
| 39 | +``` |
| 40 | + |
| 41 | +## Extending with your own number-type |
| 42 | + |
| 43 | +First create a custom subclass of `NumberBox<T>`, for example for `float`: |
| 44 | + |
| 45 | +```cs |
| 46 | +public class NumberBoxFloat : NumberBox<float> |
| 47 | +{ |
| 48 | + public NumberBoxFloat() => DefaultStyleKey = typeof(NumberBoxFloat); |
| 49 | +} |
| 50 | +```cs |
| 51 | + |
| 52 | +Next duplicate the control template from the other NumberBox controls and update the target type to match the new type name. |
| 53 | + |
0 commit comments