WPF String.Format in XAML with the StringFormat attribute

April 7th, 2009

So you want to format the output of information but don’t want do it in code behind or write a value converter to do it.  Well, good news, you don’t have to.  You can format your data directly in XAML.  How, you may be asking?  New in .NET 3.5 SP1 is the StringFormat attribute.

Example 1:  Lets say you want to format a double value into a currency:

<TextBlock Text="{Binding Amount, StringFormat={}{0:C}}" />

Notice the “{ }” just after the StringFormat attribute?  What that is doing is escaping the text after the “=” sign.  You need to do this because we do not have any text directly after the “=” sign.  If you don’t put the “{ }’”, strange things will happen. 

And now lets say we want to place some text in front of the currency:

<TextBlock Text="{Binding Amount, StringFormat=Total: {0:C}}" />

Since we now have text after the “=” sign we no longer need the “{ }”. 

How about a date you ask:

<TextBlock Text="{Binding Date, StringFormat={}{0:MM/dd/yyyy}}" />

Oh, and you want time:

<TextBlock Text="{Binding Date, StringFormat={}{0:MM/dd/yyyy hh:mm tt}}" />

What?  You want to create a tooltip comprised of more than one property of an object.  Well Okay:

<Button Content="Delete Me">
    <Button.ToolTip>
        <ToolTip>
            <StackPanel Orientation="Horizontal">
                <TextBlock>
                    <TextBlock.Text>
                        <MultiBinding StringFormat="Delete {0} {1}">
                            <Binding Path="FirstName" />
                            <Binding Path="LastName" />
                        </MultiBinding>
                    </TextBlock.Text>
                </TextBlock>
            </StackPanel>
        </ToolTip>
    </Button.ToolTip>
</Button>

As you can see the StringFormat attribute can be a time saver, and just make life a little easier.  One thing to note is that if you use the StringFormat attribute and you bind to a property that has no value, otherwise known as null, then the text that will be displayed is “{DependencyProperty.UnsetValue}".