如何处理 Silverlight BusyIndicator？

• 下载演示 - 1.55 MB

引言

Silverlight BusyIndicator 在 Silverlight 中并不是一个新事物。它最早是在2009年11月发布的 Silverlight 3 Toolkit 中添加的（如果我没记错的话）。在这篇文章中，我将为那些想了解它的人进行描述。

那么，这个 Busy Indicator 是什么呢？Busy Indicator 是一个工具，您可以将其添加到您的 Silverlight 应用程序中，以便在数据库中保存某种操作时向用户显示加载指示。通常，当您调用 WCF 服务以在服务器中存储某些内容或从服务器检索某些数据时，它非常有用。

背景

在 BusyIndicator 之前，您必须创建一个包含某种动画效果的 UserControl，然后在加载 UserControl 时调用该动画效果并将其设置在应用程序的最顶层。但是，使用工具包中提供的这个控件，开发起来非常容易。

Using the Code

让我们深入了解一下如何在我们的 Silverlight 应用程序中添加它。首先，我们将创建一个新的 Silverlight 应用程序，其中包含一些内容。在我的示例中，我使用了一个 Text 和一个 Button，并将它们放在一个 StackPanel 中。XAML 看起来像这样

<StackPanel>
<TextBlock Text="Silverlight Toolkit Busy Indicator Demo" FontSize="36" 
FontWeight="Bold" Foreground="Red" TextWrapping="Wrap" 
TextAlignment="Center"/>
<Button x:Name="btnClick" Content="Click Here" Width="100" Height="25" 
Click="btnClick_Click"/>
</StackPanel>

现在我们希望在单击按钮时执行一些操作，并希望通知用户正在进行一些操作，所以请稍等。为此，我们必须使用 Silverlight Toolkit 中提供的 BusyIndicator 工具。您可以从 CodePlex 下载它。现在我们将使用 BusyIndicator 工具包裹我们的 StackPanel。这样做的意义在于在显示 busy indicator 时禁用内容。让我们看看 XAML

<Grid x:Name="LayoutRoot" Background="White">
<toolkit:BusyIndicator HorizontalAlignment="Center" VerticalAlignment="Center" 
Name="busyIndicator" IsBusy="False">
<StackPanel>
<TextBlock Text="Silverlight Toolkit Busy Indicator Demo" FontSize="36" 
FontWeight="Bold" Foreground="Red" TextWrapping="Wrap" 
TextAlignment="Center"/>
<Button x:Name="btnClick" Content="Click Here" Width="100" Height="25" 
Click="btnClick_Click"/>
</StackPanel>
</toolkit:BusyIndicator>
</Grid>

在按钮单击事件中，我们将 Indicator 的 IsBusy 属性首先设置为“True”。这将确保在 busyindicator 处于繁忙模式时，其中的内容将被禁用。操作完成后，我们将再次将 IsBusy 属性设置为“False”。这将自动使内部内容进入启用模式。让我们从代码中尝试一下

/// <summary>
/// Handles the Click event of the btnClick control.
/// </summary>
/// <param name="sender">The source of the event.</param>
/// <param name="e">The <see cref="System.Windows.RoutedEventArgs"/> instance 
/// containing the event data.</param>
private void btnClick_Click(object sender, RoutedEventArgs e)
{
busyIndicator.IsBusy = true;
//busyIndicator.BusyContent = "Fetching Data...";

ThreadPool.QueueUserWorkItem((state) =>
{
Thread.Sleep(3 * 1000);
Dispatcher.BeginInvoke(() => busyIndicator.IsBusy = false);
});
}

在这里，在按钮单击事件中，首先我将 busyIndicator.IsBusy 设置为 true，并设置了 3 秒的延迟来显示指示器以进行演示。在此期间，进度条将在屏幕上可见，并且整个内容将被禁用。

经过 3 秒的间隔后，它将恢复到其原始状态。进度对话框将自动隐藏。

关注点

当您调用 WCF 服务来获取/设置服务器中的某些数据时，只需将 busyindicator 设置为繁忙模式，并在完成事件中，将繁忙模式设置为 false。 这样，您可以告诉用户正在进行一些操作，以便他可以等待后续步骤。 不仅如此，您还可以通过编写以下代码在 busy indicator 中设置消息

busyIndicator.BusyContent = "Fetching Data...";

结束语

如果您有任何疑问或反馈，请不要忘记写下来。 我将非常乐意尽快回答您的问题。

历史

• 2010年5月9日：初始文章