ProgressRing (UWP) 浮出控件上方的叠加层

Question

我在使用 ProgressRing（加载圈）时隐藏了所有控件，如图所示（见图）。该项目是在空白应用程序（通用 Windows 平台）上编写的。如何在显示 ProgressRing 时调暗所有控件。

controls showing

controls dimmed

Answer 1

如果您想使所有控件变暗，您可以在当前页面中放置一个不可见的图层，并在其中添加 ProgressRing。当您想要显示 ProgressRing 时，请将图层设置为可见。例如，我添加了一个网格作为不透明度为 0.4 的图层。

.xaml:

<Grid>
    <Grid x:Name="MyBorder" Background="Black" Visibility="Collapsed"  Opacity="0.4">
        <ProgressRing IsActive="True" Height="100" Width="100" x:Name="MyRing"/>
    </Grid>

    <StackPanel>
        <TextBlock Text="hello"></TextBlock>
        <TextBlock Text="world" ></TextBlock>
        <Button Click="Button_Click">show progress</Button>
        <Image Source="Assets/StoreLogo.png" Width="400" Height="400"></Image>
    </StackPanel>
</Grid>

.cs:

private async void Button_Click(object sender, RoutedEventArgs e)
{
    MyBorder.Visibility = Visibility.Visible;
    await Task.Delay(5000);
    MyBorder.Visibility = Visibility.Collapsed;
}