XAML special style for decimal places

Question

I have this number 1234.456 it has 3 decimal places, this can be very confuing for my users some of them interpret the nunber as a thousands but still they need it.

How can i do to style those numbers?

Someting like this image:

NOTE: Maybe show decimal places in other color.

Any help would be very apreciated.

EDIT 1: All I want is an Style (xaml) template to apply, the edition mode must show the number normal to allow the user to modify it. For now I'm totally lost I'm a beginer with it.

Note: I use MVVM as a primary architecture, Binding required for my XAML template

Answer 1

you'd have to put two elements on the page, one for the integer part and one for the decimal part. Then style them as you would expect. Something like this:

<TextBlock x:Name="IntPart" Text="1234." FontSize="12" />
<TextBlock x:Name="DecPart" Text="456" Margin="0,0,0,3" FontSize="8"  />

With Bindings:

<TextBlock Text="{Binding IntPart}" FontSize="12" />
<TextBlock Text="{Binding DecPart}" Margin="0,0,0,3" FontSize="8"  />

With Bindings and converters

<my:IntPartConverter x:Key="MyIntPartConverter" />
<my:DecPartConverter x:Key="MyDecPartConverter" />

<TextBlock Text="{Binding MyNumber, Converter={StaticResource MyIntPartConverter}}" FontSize="12" />
<TextBlock Text="{Binding MyNumber, Converter={StaticResource MyDecPartConverter}}" Margin="0,0,0,3" FontSize="8"  />

C#

public class IntPartConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (int)value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

public class DecPartConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (double)value - (int)value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}