Introduction
The WPF Toolkit introduces a BusyIndiactor
control, which you can display to the user when your program is executing a time consuming task. You can inform the user about the progress of the task, but there is no built in way that allows the user to cancel the task. I show a simple way to introduce such a button to the BusyIndicator
control.
Using the Code
The first thing is to add the BusyIndicator
to your User Control and set the Style
property.
<xctk:BusyIndicator Style="{DynamicResource CancelBusyIndicatorStyle}">
You can define the style in the same User Control. Add a Resources-Entry directly to the top of the User Control. If you use expression blend, you can mark the BusyIndicator
in the Objects and Timeline Box on the left hand side. On top of the mainwindow
, there is a Box
with the name of your marked BusyIndicator
. If you click in that box, a dropdown menu will open. Click Edit Template, then Edit a Copy ... In the appearing dialog box, you can give the style a name like CancelBusyIndicatorStyle
. Leave Define in at This document and click the Ok Button. You now have a lot of lines with a copy of the style of the BusyIndicator
.
<UserControl.Resources>
<Style x:Key="CancelBusyIndicatorStyle"
TargetType="{x:Type xctk:BusyIndicator}">
...
</Style>
</UserControl.Resource>
Scroll down until you are almost at the bottom of the Style-definition. There is the definition of the ContentPresenter
named busycontent
. It contains a nameless Grid
that you can identify by the MinWidth
-Property of 150
. To this object, we want to add our button. The code should look like this:
<Grid MinWidth="150">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ContentPresenter ContentTemplate="{TemplateBinding BusyContentTemplate}"
Content="{TemplateBinding BusyContent}" Margin="8"/>
<ProgressBar Grid.Row="1" Style="{TemplateBinding ProgressBarStyle}"/>
</Grid>
We need to add another row to this grid and we need to add the button. The code should now look like this (added lines are bold):
<Grid MinWidth="150">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ContentPresenter ContentTemplate="{TemplateBinding BusyContentTemplate}"
Content="{TemplateBinding BusyContent}" Margin="8"/>
<ProgressBar Grid.Row="1"
Style="{TemplateBinding ProgressBarStyle}"/>
<Button x:Name="Button_Cancel"
Grid.Row="2" Content="Cancel" Margin="0,0,0,5"
Width="50" Click="<code>Button_Cancel_Click"/>
</Grid>
All that is left to do now is to add the EventHandler
for the Click
-event to the code behind file of your User Control:
private void <code>Button_Cancel_Click(object sender, System.Windows.RoutedEventArgs e)
{
MessageBox.Show("Cancel");
}
Instead of showing a MessageBox
, you can execute the code to cancel the task your program is executing and the user wants to be canceled.
History