wpf - 加载图像时如何获得黑色背景？

Question

这是一个非常简单的应用程序，它加载一个黑色背景的窗口。

<Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Width="1365" Height="768"
        WindowStartupLocation="CenterScreen"
        Background="Black">
</Window>

效果很好，但如果我添加一个图像控件，我希望它会显示黑色一秒钟，直到我的图像加载完毕。

<Image Source="pack://application:,,,/assets/images/bg.jpg" />

但由于某种原因，背景显示为白色。图像加载后显示完美，但我希望加载的那 1 秒是黑色，而不是白色。

如何在加载图片时显示黑色背景？

Answer 1

我尝试从后台加载图像，但没有用。我尝试加载图像并使用动画从 0 到大动画，但这并没有真正起作用，你必须使用固定宽度。最后，我想我会使用在触发 Image.Loaded 事件时触发的 Storyboard 来更改可见性。

在工作解决方案中，包含图像的网格的可见性将在 Image.Loaded 事件触发 0.1 秒后从折叠变为可见。您可以通过将“MG”Grid 的默认可见性更改为 Hidden 或 Visible 来证明这是有效的，并注意窗口为白色的时间比设置为 Collapsed 时更长。

工作 XAML

<Window x:Class="Test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Test"
        mc:Ignorable="d"
        Title="MainWindow"
        Height="350"
        Width="525"
        Background="Black">
    <Grid x:Name="MG" Background="Black" Visibility="Collapsed">
        <Image Source="pack://application:,,,/assets/images/bg.jpg">
            <Image.Triggers>
                <EventTrigger RoutedEvent="Loaded">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Duration="0:0:0.1"
                                                               Storyboard.TargetName="MG"
                                                               Storyboard.TargetProperty="Visibility">
                                    <ObjectAnimationUsingKeyFrames.KeyFrames>
                                        <DiscreteObjectKeyFrame>
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames.KeyFrames>
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </Image.Triggers>
        </Image>
    </Grid>
</Window>

注意:您可能需要根据您正在渲染的图像的文件大小来调整时间。