Update a WPF UI from Another Thread

This is a shorter post with a small solution to a problem, but I wanted to add it here for my own reference. I have recently been working on a little WPF pet project as I want to learn XAML and WPF. I seemed to miss that generation of UI technology when I went from mainly doing WinForms work into WCF and back end enterprise development.

The issue I had the other day was that I had a timer running in my code that triggers an event when the elapsed time hits a certain time. From that event handler I wanted to update something on the user interface. If I update that UI item directly from the event I got the following exception being thrown. This is because the UI is operating on a different thread to the thread handling the timer event.

Thread Exception
Thread Exception

The solution is to use the Dispatcher.Invoke( Action ) method to make the call to the UI thread. This is demonstrated in the following example. We have a timer being setup with an event (OnTimedEvent) being fired every 5 seconds. When the OnTimedEvent is called, the UI is updated inside the Dispatcher.Invoke( Action ) method.

private Timer _timer = new Timer();
_timer = new Timer(5000);      
_timer.Elapsed += OnTimedEvent;
timer.Enabled = false;

private void OnTimedEvent( Object source, ElapsedEventArgs e)
{
     Dispatcher.Invoke(() =>
     {
          // Set property or change UI compomponents.              
     }); 
}

MSDN describes this solution as follows:

In WPF, only the thread that created a DispatcherObject may access that object. For example, a background thread that is spun off from the main UI thread cannot update the contents of a Button that was created on the UI thread. In order for the background thread to access the Content property of the Button, the background thread must delegate the work to the Dispatcher associated with the UI thread. This is accomplished by using either Invoke or BeginInvoke. Invoke is synchronous and BeginInvoke is asynchronous. The operation is added to the event queue of the Dispatcher at the specified DispatcherPriority.

Invoke is a synchronous operation; therefore, control will not return to the calling object until after the callback returns.

Advertisements

Remove the Close Button from a WPF Window.

Recently for a bit of fun I thought I would play around with Windows Presentation Foundation. I come from a Winforms background, but I never really got into WPF development as my programming career steered more towards WCF Services development.

For my simple project I thought I would write a simple little game. The game is a board game where the game resides in the main application window. What I wanted to have was another window that pops up and contains the games main menu, with options like ‘New Game’, ‘Exit’ etc.

WPF Window With Close Button
WPF Window With Close Button

When I added the code and Xaml to define the window, I noticed that the window still had a close icon on it. I wanted to get rid of this because I wanted access out of the menu to be controlled by the menu items in the centre of the screen. This was easy to do in Winforms as there was an option for it in the Visual Studio designer. Unfortunately this is not easily supported in WPF, but after a little digging I found the solution which required a little interop into user32.dll.

Training : Windows Presentation Foundation

In this article I have collated a few training links about Windows Presentation Foundation. I will keep adding to this page as I find other useful free resources. If you have any videos or articles that you feel would be useful here then please let me know in the comments and I will add them to the post. I would like it to be an archive of good material.

Windows Presentation Foundation (WPF)
Windows Presentation Foundation (WPF)

WPF Tutorials

In this section I have provided links to different WPF tutorial resources that are ideal for beginners.

WPF Tutorial

Walkthrough: Getting Started with WPF on MSDN

The Complete WPF Tutorial

WPF Tutorial Video Channel on YouTube

Intertech : Windows Presentation Foundation Training Video

MVVM and WPF

This section contains tutorials and articles that explain how to build an MVVM (Model, View, View Model) application with Windows Presentation Foundation (WPF)

WPF/MVVM Quick Start Tutorial

The World’s Simplest C# WPF MVVM Example

WPF Apps With The Model-View-ViewModel Design Pattern

Easy MVVM Example on MSDN

The Model-View-ViewModel Pattern

WPF MVVM Pattern: A Simple Tutorial for Absolute Beginners

XAML

This section contains some links about the XAML markup language used by Windows Presentation Foundation. XAML is an XML markup that is used to define how user interfaces are rendered and events are wired up. XAML is a very feature rich language that can be edited as XML in Visual Studio, or you can use the built in forms designer. If you need to do any design work that is more in depth, you can use the Expression Blend tool.

XAML Overview (WPF) at MSDN

XAML Tutorial Video on YouTube

What is XAML?

XAML in Windows Presentation Foundation (WPF)

XAML Channel over at Channel 9