.NET 4.0+

WPF Data Binding - String Formatting

by Richard Carr, published at http://www.blackwasp.co.uk/WPFStringFormat.aspx

The ninety-sixth part of the Windows Presentation Foundation Fundamentals tutorial continues the examination of data binding. This article looks at the ways in which values can be formatted when displayed as strings.

Adding a Prefix or Suffix

You can add extra text around the formatted value in a similar manner to the way you might if you were using the String class's Format method. To do so, you provide the text to the StringFormat value and include a placeholder. The placeholder must include a reference number, which for a basic binding is always zero, surrounded by brace characters. For example, "{0}". If you wish to apply a format string, this should appear after the zero, separated by a colon. For example, "{0:C}" for currencies.

Let's add another bound text block. The XAML below creates a value with a prefix, a suffix and currency formatting:

<TextBlock Grid.Row="3">Extra Text</TextBlock>
<TextBlock Grid.Row="3" Grid.Column="1"
           Text="{Binding ElementName=MyValue,Path=Value,StringFormat='Only {0:C} each'}"/>

Using a Custom Picture Format

When converting numbers to strings using the .NET framework, you can apply a picture format. This is a set of characters that allow fine control over the end result. You can also use picture formats to format values in the XAML, applied in the same manner as a standard format specifier.

The following creates a text block that shows the slider's value with a single decimal place, a prefix and a suffix. The picture format is "0.0".

<TextBlock Grid.Row="4">Custom</TextBlock>
<TextBlock Grid.Row="4" Grid.Column="1"
           Text="{Binding ElementName=MyValue,Path=Value,
           StringFormat='Reduced by {0:0.0}%'}"/>

If you use a custom format without a prefix, the opening brace of the value's placeholder will be the first character in the StringFormat value. As braces are used extensively in XAML, this is not permitted. In these situations you must escape the string format with a pair of braces at the start of the string. This is shown in the next example, which would not work if the initial braces were omitted.

<TextBlock Grid.Row="5">Custom (no prefix)</TextBlock>
<TextBlock Grid.Row="5" Grid.Column="1"
           Text="{Binding ElementName=MyValue,Path=Value,
           StringFormat='{}{0:0.0}% reduction'}"/>

Creating Culture-Specific Data Bindings

Many of the standard format specifiers and the custom picture format strings can include culture-specific information. For example, formatting a value as a currency produces different results for different countries.

If you wish to specify the culture to use when converting a value to a string, you can add the ConverterCulture value to the data binding's configuration. You set this to an ISO culture code.

Add two bound text blocks using the code below. These text blocks use the same source value and string format but different cultures.

<TextBlock Grid.Row="6">German Culture</TextBlock>
<TextBlock Grid.Row="6" Grid.Column="1"
           Text="{Binding ElementName=MyValue,Path=Value,
                          StringFormat='{}{0:C}',ConverterCulture=de-DE}"/>

<TextBlock Grid.Row="7">Japanese Culture</TextBlock>
<TextBlock Grid.Row="7" Grid.Column="1"
           Text="{Binding ElementName=MyValue,Path=Value,
                          StringFormat='{}{0:C}',ConverterCulture='ja-JP'}"/>

Run the program for a final time to see the results. You should see that the last two bindings show currencies using German and Japanese styles.