Binding Formatting

Windows Phone Tutorial

When you are binding data there are additional properties that allow you to format the display and to handle errors and null values.

The StringFormat property allows you to add any standard .NET format string that matches the type you are binding to.

The FallbackValue instructs the binding on what to display if the binding fails.

The TargetNullValue instructs the binding on what to display if the value bound to is null.

To see this at work, let’s create a very simple application with three StackPanels, each holding a prompt and a TextBlock,

<StackPanel Grid.Row="0"
   Orientation="Horizontal">
   <TextBlock
      Text="Promised Date: " />
   <TextBlock
      Margin="5,0,0,0"
      Text="{Binding PromisedDate, 
      StringFormat=d,
      FallbackValue='Date Not Found', 
      TargetNullValue='No Date'}" />
   </StackPanel>
<StackPanel
   Grid.Row="1"
   Orientation="Horizontal">
   <TextBlock
      Text="Delivered Date: " />
   <TextBlock
      Margin="5,0,0,0"
      Text="{Binding DeliveredDate, 
      StringFormat=d,
      FallbackValue='Date Not Found', 
      TargetNullValue='No Date'}" />
</StackPanel>
<StackPanel
   Grid.Row="2"
   Orientation="Horizontal">
   <TextBlock
      Text="Action: " />
      <TextBlock
         Margin="5,0,0,0"
      Text="{Binding Path=ReturnDate,
      StringFormat=d 
      FallbackValue='Date Not Found', 
      TargetNullValue='No Date'}" />
</StackPanel>

Notice that all three TextBlocks use the identical properties except for the name of the property that it will bind to.

In Main.xaml.cs we’ll create a tiny class to act as the data context for the binding,

public partial class MainPage : PhoneApplicationPage
{
    public class Book
    {
        public DateTime? PromisedDate
        {
            get { return DateTime.Now; }
            set { PromisedDate = value; }
        }

        public DateTime? ReturnDate
        {
            get { return null; }
        }
    }

Notice that PromisedDate returns a date, there is no property for DeliveredDate. amd ReturnDate returns null.  In the body of Main we’ll instantiate a Book object and set as the page’s DataContext. 

public MainPage()
{
    Book b = new Book();
    DataContext = b;
    InitializeComponent();
}

When this is run, PromisedData provides a date which is formatted by the StringFormat property.  Because there is no DeliveredDate the binding on that property fails and the FallbackValue is used.  Finally, because ReturnDate is null, the TargetNullValue is used for that value.  The output is shown in the illustration at the start of this posting.