WPF 4.5 – Part 4 : the new Binding’s ‘Delay’ property

, , 19 Comments

If you read the MSDN page on the new WPF 4.5 features, you’ll find it under the label “Automatically updating the source of a data binding“. This is more precise and understandable to me to say that a ‘Delay’ property has been added to the Binding markup extension !

This post is a part of the serie on WPF 4.5 new features. By reading it you’ll discover what is the goal of this property, how to use it and some scenario where it is really useful and smart to use it.

What is it ?

A binding is done between two objects : the source (where the data comes from) and the target (where the data go to). For example if you bind the Text property of a TextBlock to a property “Name” of your ViewModel, the TextBlock is the target and the source is your ViewModel.

A Binding performs synchronisation between two properties. If and only if the binding is done in TwoWay mode then the target is able to update the source value (the TextBlock is able to update the ViewModel).

This synchronisation is done immediately : each change of the target value, even a tiny tiny one update the source.

Since WPF 4.5, the Binding has a new property named ‘Delay’ which defines a timespan after which the source is updated. Each update of the target value will be done only after this delay and only if none has been done since. MSDN defines it as “The amount of time to wait before updating the binding source“.

We will see later when it can be useful.

How to use it ?

As this is an added property on the Binding, you only have to define it on each Binding you create.
The delay is defined in milliseconds and the default value of ‘0’ reproduce the classic behavior of a Binding.

Here is an example of a binding which sets a delay of 500 milliseconds:
[xml]<TextBlock Text="{Binding Name, Delay=500}"/>[/xml]

The delay is only applied on only one direction : from the target to the source.

When to use it ?

My first though was that it is not a really useful feature but after a certain amount of time I found some scenario in which this is very useful. Yes, my brain has a Delay too !

  1. As pointed out by MSDN, there is some controls like the Slider for which there is no need to update a source value for each pixel that the Slider moves;
  2. Refering to MSDN too, you can use this on TextBox to get the typed text by “block” instead of one letter at a time;
  3. It can be useful in master/details scenarii when the change of a selection trigger some time-consuming processing on the UI thread;
  4. In the same scenario, if you launch an async works on each change, it can strt a lot of them a saturation of the thread pool (or cause too much network use, etc.);
  5. Sometime in master/details scenarii, the details view is quite complex and it takes time to render it. Then the delay can trigger this rendering only when it’s useful.

A full example

The master/detail scenarii are the one where it can be the most useful for me so I have create a demo project to reproduce it. Let’s say that we a have a list of person and the selected one’s details are displayed. We will then have an interface which looks like this :

On each change of the Selected Person, a time-consuming process is triggered on the UI thread in the setter. I simulated this by a call of Thread.Sleep :
[csharp]public Person SelectedPerson
{
get { return _selectedPerson; }
set
{
_selectedPerson = value;
//Simulate time consuming operation
Thread.Sleep(500);
RaisePropertyChanged("SelectedPerson");
}
}
[/csharp]

When the delay is not set, navigation in the list is just slow and freeze the UI on each changes. Just letting the ‘arrow down’ key makes the UI freeze too much for me.

With the delay property set to a value of 500 milliseconds, I can easily navigate in the list with the keyboard.
[xml]<ListBox ItemsSource="{Binding Persons}" SelectedItem="{Binding SelectedPerson,Delay=500}" />[/xml]

Finally, I added a button to trigger a change from the source object just to prove that the Delay works in only one direction.

The complete code source of the Demo can be found on my dropbox folder after registration.

Again, it’s a discrete addition to the WPF framework but it’s a useful one !

If you want more info on it, you can read the MSDN page of this new property.

 

19 Responses

  1. Mario Vernari

    26/09/2011 14 h 12 min

    Hello Jon, and thanks for clarifying the new features of WPF.
    The Delay parameter is very interesting, but -if I understand well- your example of Delay applied to a TextBlock has no sense. Did you mean TextBox instead?
    However, it would have been useful in the “forward-direction” as well. I have an issue with a huge viewmodel (frequently modified), where the classic binding causes an (useless) overload of CPU. I solved without bindings, and using a periodic clock. The Delay would have been useful.
    Cheers

    • jmix90

      26/09/2011 14 h 16 min

      In fact I use the TextBlock to demonstrate what is a binding and not especially the use of the Delay property so I think it’s still correct :-).

      Thanks for reading my blog and for your comment !

  2. Jamie

    15/10/2011 16 h 56 min

    thanks for the post. I was also wondering what the use of that feature was…master detail makes sense.

  3. Richard

    09/11/2011 16 h 27 min

    English nit-picking again:
    The plural of "scenario" is "scenarios". "Scenarii" is not a word.

  4. fmunkert

    17/06/2012 11 h 15 min

    When you navigate through the list with the arrow keys, the delay is useful to avoid slowing down the UI. But if you click a particular list item with the mouse, you do not want to have such a delay. Can this also be achieved with WPF 4.5?

  5. Ross

    13/09/2012 1 h 17 min

    It feels a bit like a hack, but I can see it being useful in some situations.

    I sort of like what other control vendors have done, where they have an UpdateSourceTrigger property, where you can specify things like KeyDown, KeyUp, LostFocus ….

  6. Chris Bordeman

    21/04/2014 11 h 30 min

    Oddly, for me this isn’t working. I’ve set up to a 2000 millisecond delay and it seems to be ignored entirely, binding very frequently. There are only a few elements (in a list), though the ItemsSource itself isn’t bound, it is set in code to a private field…

  7. Kevin C

    14/11/2014 14 h 39 min

    Thanks for the explanation of the usage. I had encountered a Binding with a Delay in a team project I joined, and was wondering what the use of a Delay was. Your examples of Slider and TextBox are indeed reasonable reasons to add this delay. So thanks for this article.

  8. Rob

    24/06/2015 3 h 44 min

    Hi Jonathan, I recently used the Delay, but a side affect is that, if I edit a property then I can press a submit changes button before the Property Update can occur. This means that I lose my changes.
    Is there a way of waiting for pending delays to finishor make them execute immediately?
    I've asked the question on StackOverflow too. http://stackoverflow.com/questions/31016139/how-t

  9. Jason Hartman

    18/10/2016 16 h 38 min

    Truth be told I utilize the TextBlock to show what is an official and not particularly the utilization of the Delay property so I believe it's still right :- ).

Comments are closed.