Ursa.Avalonia/demo/Ursa.Demo/Pages/NumericUpDownDemo.axaml

<UserControl
    x:Class="Ursa.Demo.Pages.NumericUpDownDemo"
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:u="https://irihi.tech/ursa"
    xmlns:vm="using:Ursa.Demo.ViewModels"
    d:DesignHeight="450"
    d:DesignWidth="800"
    x:CompileBindings="True"
    x:DataType="vm:NumericUpDownDemoViewModel"
    mc:Ignorable="d">

    <UserControl.Styles>
        <Style Selector=":is(u|NumericUpDown)">
            <Setter Property="Width" Value="240" />
            <Setter Property="HorizontalAlignment" Value="Left" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
        </Style>
    </UserControl.Styles>

    <Grid ColumnDefinitions="*,*" RowDefinitions="100,*">
        <StackPanel Grid.ColumnSpan="2">
            <u:Divider Content="Change Right -&gt;" />
            <u:NumericUIntUpDown
                Name="numd"
                Command="{Binding TrythisCommand}"
                Width="{Binding Width}"
                HorizontalAlignment="{Binding HorizontalAlignment}"
                HorizontalContentAlignment="{Binding HorizontalContentAlignment}"
                AllowDrag="{Binding AllowDrag}"
                AllowSpin="{Binding AllowSpin}"
                FontFamily="{Binding FontFamily, Mode=OneWay}"
                FormatString="{Binding FormatString}"
                InnerLeftContent="{Binding InnerLeftContent}"
                IsEnabled="{Binding IsEnable}"
                IsReadOnly="{Binding IsReadOnly}"
                Maximum="{Binding Maximum}"
                Minimum="{Binding Minimum}"
                ParsingNumberStyle="{Binding ParsingNumberStyle}"
                ShowButtonSpinner="{Binding ShowButtonSpinner}"
                Step="{Binding Step}"
                Watermark="{Binding Watermark}"
                Value="{Binding Value}" />
            <u:Divider Content="Demo" />
        </StackPanel>

        <Grid
            Grid.Row="1"
            Grid.Column="0"
            HorizontalAlignment="Left">
            <StackPanel Grid.Row="1">
                <u:Divider Content="{Binding #input.Value, StringFormat='Int = {0}'}" />
                <u:NumericIntUpDown
                    Name="input"
                    Classes="ClearButton"
                    InnerLeftContent="Age"
                    Step="1"
                    Watermark="Input Value"
                    Value="2" />
                <u:Divider Content="{Binding #inputDouble.Value, StringFormat='Double = {0}'}" />
                <u:NumericDoubleUpDown
                    Name="inputDouble"
                    EmptyInputValue="1"
                    Step="0.5"
                    Value="3.1" />
                <u:Divider Content="{Binding #inputByte.Value, StringFormat='Byte = {0}'}" />
                <u:NumericByteUpDown
                    Name="inputByte"
                    EmptyInputValue="1"
                    Step="1"
                    Value="3" />
                <u:Divider Content="{Binding #Drag_Int.Value, StringFormat='Drag Int = {0}'}" />
                <u:NumericIntUpDown
                    Name="Drag_Int"
                    AllowDrag="True"
                    InnerLeftContent="Drag"
                    Step="1"
                    Watermark="Input Value"
                    Value="2" />

                <!--  hex demo  -->

                <u:Divider Content="{Binding #uint_HexNumber.Value, StringFormat='Don‘t Use = {0}, hex={0:X}'}" />
                <!--  =================this is error usage  -->
                <u:NumericUIntUpDown
                    Name="uint_HexNumber"
                    AllowDrag="False"
                    FormatString="{}{0:X8}"
                    InnerLeftContent="HexNumber"
                    ParsingNumberStyle="HexNumber"
                    Step="1"
                    Watermark="Input Value"
                    Value="2" />

                <!--  =================we should use AllowHexSpecifier  -->
                <u:Divider Content="{Binding #uint_AllowHexSpecifier.Value, StringFormat='uint = {0}, hex={0:X}'}" />
                <u:NumericUIntUpDown
                    Name="uint_AllowHexSpecifier"
                    HorizontalContentAlignment="Right"
                    AllowDrag="False"
                    FontFamily="Consolas"
                    FormatString="{}{0:X8}"
                    InnerLeftContent="AllowHexSpecifier"
                    ParsingNumberStyle="AllowHexSpecifier"
                    Step="1"
                    Watermark="AllowHexSpecifier"
                    Value="2" />

                <u:Divider Content="{Binding #Consolas_uint.Value, StringFormat='Font=Consolas {0}, hex={0:X}'}" />
                <u:NumericUIntUpDown
                    Name="Consolas_uint"
                    HorizontalContentAlignment="Right"
                    AllowDrag="False"
                    FontFamily="Consolas"
                    FormatString="X8"
                    InnerLeftContent="0x"
                    ParsingNumberStyle="AllowHexSpecifier"
                    Step="1"
                    Watermark="AllowHexSpecifier"
                    Value="2" />
            </StackPanel>
        </Grid>

        <StackPanel
            Grid.Row="1"
            Grid.Column="1"
            HorizontalAlignment="Left"
            Orientation="Vertical">

            <CheckBox Content="AutoWidth" IsChecked="{Binding AutoWidth}" />
            <u:NumericDoubleUpDown
                AllowDrag="True"
                InnerLeftContent="Width"
                IsEnabled="{Binding !AutoWidth}"
                Value="{Binding Width}" />

            <TextBox InnerLeftContent="FontFamily" Text="{Binding FontFamily}" />

            <CheckBox Content="AllowDrag" IsChecked="{Binding AllowDrag}" />

            <CheckBox Content="IsReadOnly" IsChecked="{Binding IsReadOnly}" />

            <Label Content="HorizontalAlignment" />
            <ComboBox ItemsSource="{Binding Array_HorizontalAlignment}" SelectedItem="{Binding HorizontalAlignment}" />
            <Label Content="HorizontalContentAlignment" />
            <ComboBox ItemsSource="{Binding Array_HorizontalContentAlignment}" SelectedItem="{Binding HorizontalContentAlignment}" />

            <TextBox
                InnerLeftContent="InnerLeftContent"
                InnerRightContent="obj"
                Text="{Binding InnerLeftContent}" />

            <TextBox InnerLeftContent="Watermark" Text="{Binding Watermark}" />

            <TextBox
                MinWidth="100"
                InnerLeftContent="FormatString"
                MaxLength="100"
                Text="{Binding FormatString}" />

            <Label Content="ParsingNumberStyle" />
            <ComboBox ItemsSource="{Binding Array_ParsingNumberStyle}" SelectedItem="{Binding ParsingNumberStyle}" />

            <CheckBox Content="AllowSpin" IsChecked="{Binding AllowSpin}" />

            <CheckBox Content="ShowButtonSpinner" IsChecked="{Binding ShowButtonSpinner}" />

            <u:NumericUIntUpDown
                Name="nudV"
                AllowSpin="True"
                InnerLeftContent="Value"
                IsEnabled="True"
                IsReadOnly="False"
                Value="{Binding Value, Mode=TwoWay}" />

            <u:NumericUIntUpDown InnerLeftContent="Max" Value="{Binding Maximum}" />

            <u:NumericUIntUpDown InnerLeftContent="Min" Value="{Binding Minimum}" />

            <Label Content="{Binding Step, StringFormat='Step {0}'}" />
            <Slider
                Minimum="1"
                ToolTip.Tip="{Binding Step}"
                Value="{Binding Step}" />

            <CheckBox Content="IsEnable" IsChecked="{Binding IsEnable}" />

        </StackPanel>
    </Grid>
</UserControl>