如何在 WPF 中编写 throbber（“正在加载”或“等待”图形）？

Question

如何在 WPF 中编写“正在加载”或“等待”图形的代码？

如果某人的页面需要加载大量信息（通常在 Flash 网站上），您会看到某种圆形旋转，这通常意味着正在加载大量数据，用户需要等待。

这不仅仅是一个好的效果。它具有现实世界的应用和重要性。如果某人打开一个没有此图形的表单、页面或窗口，而是看到一个应该显示信息的表单，但看到的是空白字段，那么他的第一个想法可能是没有信息可看。即使光标转到等待模式，这也可能是正确的。与可能处于某种旋转状态的光标相比，广阔的空旷领域将更具有图像的存在性和压倒性。

我想我可以把一些东西放在一起。我想我可以呈现一个旋转圆圈的 gif，该圆圈在开始时显示，然后在调用所有数据加载方法后隐藏。但也许有某种共享的通用图形可以免费使用，并且在不确切知道这个东西叫什么的情况下，我不知道使用什么名称或短语来搜索它。他们叫什么？

另外，也许 WPF 甚至 MVVM 中已经内置了一些使用它的东西。有没有？另外，也许有人已经找到了一种方法，可以在显示旋转圆圈时使整个表单或页面变灰且不活动，并且很友善地分享它。这是真的吗？

Answer 1

在我看来，你在这里问了一堆不同的问题。所以，虽然我通常不喜欢零碎的回复，但这里是：

但也许有某种共享
免费使用的通用图形
不知道这到底是什么
东西叫什么，我不知道
用于搜索的名称或短语
一。他们叫什么？

我确信网络上有您可以使用的免版税图片。我可能会搜索“忙碌光标”甚至“沙漏”，因为直到最近，这就是主要操作系统呈现它们的方式。

另外，也许已经有一些东西了
构建到 WPF 或 WCF 甚至 MVVM 中
使用这个。有吗？

首先，我们最好明确一下我们的术语：

• MVVM 没有“内置”任何东西，因为它是一种编程模式，而不是一个框架。有很多实现，但我不知道是否有特定的图形元素。可能是！
• WCF 是 Windows Communication Foundation，其库几乎肯定不包含任何图形元素。
• WPF 是 Windows Presentation Foundation，您可以在其中找到（或定义您自己的）图形元素。它确实包含一个进度条，但是尽管您可以自定义任何 WPF 控件的外观，但它实际上是为了显示从起点到终点的进度。那可能不是你想要的。不过，WPF 当然可以显示动画图像。这是SO 中用于显示动画 GIF 的示例< /a>.

此外，也许有人已经制定了
制作整个表单或页面的方法
显示时呈灰色且处于非活动状态
旋转圈子一直善良
足以分享它。这是真的吗？

几乎可以肯定。同样，您可以在这里采取多种方法。例如，此问题中提到了其中一些。搜索“覆盖”或“启动画面”可能会为您指明正确的方向。简而言之（在 WPF 中）：

• 使页面“非活动”
• 通过设置其控件的 Inactive 属性和/或捕获 Preview(Key|Mouse)Down 事件“灰显”， 通过在页面顶部显示半透明元素（例如 Grid 或 Rectangle）来显示页面。根据您执行此操作的方式，它也可能会处理使底层控件“不活动”（不要引用我的话，但我相信像矩形这样的元素会拦截鼠标单击，因此用户无法单击其下方的控件...）

Answer 2

使用后台工作程序，对于 wpf 中的圆形进度条，请参阅 http://www.codeproject.com/Articles/49853/Better-WPF-Circular-Progress-Bar.aspx 非常好的一个。

Answer 3

BackGroundWorker 线程是你的朋友。
http://msdn.microsoft.com/en-us/library /system.componentmodel.backgroundworker.aspx

Answer 4

我不确定，只是一个想法。显示包含旋转圆圈的透明模式窗口，直到后台线程加载数据。当数据加载时。关闭模态窗口。

Answer 5

您可以简单地使用附加属性

这是一篇包含完整示例代码的帖子（只有几个类）

您的主 WPF 窗口看起来就像这样：

    <Window.Resources>
    <CollectionViewSource x:Key="DataList" Source="{Binding TestData}"  />
</Window.Resources>
<Grid Background="AliceBlue" app:AsyncNotifier.Trigger="{Binding IsDataLoading}" 
      app:AsyncNotifier.SpinnerText="Loading...">
    <TabControl Grid.RowSpan="2">
        <TabItem Header="TabItem">
            <Grid Background="#FFE5E5E5">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <ListBox ItemsSource="{Binding 
                    Source={StaticResource DataList}}" />
                <Button Content="Do Update" HorizontalAlignment="Left" Command="{Binding LoadData}"
                        VerticalAlignment="Top" Width="75" Grid.Row="1" Margin="0,5" />
            </Grid>
        </TabItem>
        <TabItem Header="TabItem">
            <Grid Background="#FFE5E5E5"/>
        </TabItem>
    </TabControl>
</Grid>