Наложение над выпадающим списком ProgressRing (UWP)

Question

Я скрываю все элементы управления при использовании ProgressRing (круг загрузки), как показано (см. Изображение). Проект написан на пустом приложении (универсальная Windows платформа). Как затемнить все элементы управления, пока отображается ProgressRing.

элементы управления, показывающие

элементы управления затемнены

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;
}