Silverlight 4: Using the Busy Indicator

Tweet

When using Silverlight for enterprise line-of-business application or for any media operations, many-a-times we need to perform external HTTP calls for data access. The HTTP communication is totally dependent on the available bandwidth. Sometimes it happens that the data is too huge and downloading this data takes time. In such cases, the user often has to stare on an empty control in the browser, wondering what’s happening. It is irritating at times and I am sure you must have had a similar experience on some other site. So to make the user comfortable and informed while executing long running operations, we must use a technique that informs the user that something is “happening” behind the scenes. The Silverlight 4 BusyIndicator control provides one such usage in our application.

To make use of this control, we need to perform executable operations on a thread, other than the UI thread. Silverlight provides a Dispatcher property to every control using which the control on the UI thread can be updated by the value calculated on some other thread. When using the BusyIndicator, we need to make use of this property. Let us see the steps:

Step 1: Open VS2010 and create a new Silverlight project. Name it as ‘SilverlightBusyIndicator’. In this project, add a new class file and name it as ‘Dataclasses.cs’. Write the following code with data consumer classes in it:

Step 2: Open MainPage.Xaml and write the following XAML code in it:

Note that the BusyIndicator control is used here. This is a content control. This control updates the child controls of it when the operation in the background is over. Currently the content of the BusyIndicator is Grid element, which contains DataGrid and Button.

Step 3: In the MainPage.Xaml.cs write the following code:

The above code makes use of ThreadPool class which has the ‘QueueUserWorkItem’ method. This method queues method(s) for execution when thread from the thread pool is available. The Button click event first marks the BusyIndicator as Busy using its ‘IsBusy’ property. This property shows the ‘Busy’ effect. Then the current thread is configured to sleep for 5 seconds to emulate a busy operation. During this process, the data from the PersonCollection class is instantiated and using the Dispatcher property of the DataGrid control, the data is updated using ItemsSource property. Once the data is available, the BusyIndicator is set to false.

Step 4: Run the application, click on ‘Get Data’ button and the following result will be displayed:



and after the data is loaded, the following result will be displayed:



Where to use the Silverlight BusyIndicator control?
· Calling External WCF services which is reading huge amount of data.
· Downloading large Media/Images from Media/File servers.
· External HTTP calls that take too much time to execute

and so on.

Download the source code

Tweet

About The Author

Mahesh Sabnis is a Microsoft MVP having over 18 years of experience in IT education and development. He is a Microsoft Certified Trainer (MCT) since 2005 and has conducted various Corporate Training programs for .NET Technologies (all versions). He also blogs regularly at DotNetCurry.com. Follow him on twitter @maheshdotnet