c# - 如何使用 BackgroundWorker 显示/隐藏 WPF UI 元素？

Question

我有一个矩形，我想让它可见，然后我想等待 500 毫秒，然后我想让它再次不可见。

最初我试过这段代码:

MuzzleFlash.Visibility = Visibility.Visible;
Thread.Sleep(500);
this.UpdateLayout();
this.InvalidateVisual();
MuzzleFlash.Visibility = Visibility.Collapsed;

我尝试了那两条中间线，因为它们据说会强制窗口更新，但所有这一切只是暂停了半秒钟，没有改变任何类型的矩形。

所以我听说了 BackgroundWorkers 以及我应该如何使用它们。经过一些简短的阅读，我想出了这个。请注意，Shoot 订阅了 Canvas 上的 MouseDown 事件，该事件之前有效:

private void Shoot(object sender, System.Windows.Input.MouseButtonEventArgs e)
    {

        BackgroundWorker UIUpdater = new BackgroundWorker();
        UIUpdater.WorkerSupportsCancellation = true;
        UIUpdater.WorkerReportsProgress = false;

        UIUpdater.DoWork += new DoWorkEventHandler(UI_DoWork);
        UIUpdater.RunWorkerCompleted += new RunWorkerCompletedEventHandler(cancelUIUpdate);

    }

    private void UI_DoWork(object sender, DoWorkEventArgs e)
    {
        MuzzleFlash.Visibility = Visibility.Visible;
        Thread.Sleep(500);
        this.UpdateLayout();
        this.InvalidateVisual();
        MuzzleFlash.Visibility = Visibility.Collapsed;
    }

    private void cancelUIUpdate(object sender, RunWorkerCompletedEventArgs e)
    {
        BackgroundWorker bw = sender as BackgroundWorker;
        bw.CancelAsync();
    }

现在它甚至没有停顿半秒钟，向我表明 worker 没有做任何事情。我该如何解决这个问题，并使矩形出现/消失？

Answer 1

在 wpf 中使用后台 worker 来管理动画是个坏主意。动画应该从 Storyboard 运行。它可以通过 xaml 或在代码中指定。

使用 xaml 动画矩形的问题非常简单:

<Rectangle x:Name="MuzzleFlash" Height="100" Width="100" Fill="Red">
    <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames BeginTime="0:0:0.5"  Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Collapsed}" />
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Rectangle.Triggers>
</Rectangle>

对于更复杂的动画，您可以使用 Blend 以交互方式设计它们。

评论后的更新回复:如果你想让它出现和消失，你必须从父容器中操作它，因为一旦矩形被隐藏，它就不会响应鼠标事件。

您可以将矩形放在网格中并按名称引用它以更改其在动画中的可见性。

<Grid Background="Gray">
    <Grid.Triggers>
        <EventTrigger RoutedEvent="MouseDown">
            <BeginStoryboard>
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames BeginTime="0:0:0.0"  Storyboard.TargetProperty="Visibility" Storyboard.TargetName="MuzzleFlash">
                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Visible}" />
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="{x:Static Visibility.Hidden}" />
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Grid.Triggers>
    <Rectangle x:Name="MuzzleFlash" Height="100" Width="100" Fill="Red">

    </Rectangle>
</Grid>