在视图中的其他控件(ZIndex)上显示进度环

Question

我正在制作一个UWP,我已经有了一个ListView观点.当我单击a时ListViewItem,我调用API,然后导航到另一个页面,传递被调用API的响应.我想要做的是,在调用API时,我想显示进度环(直到导航发生)

这是我现在的XAML:

<Grid>
    <ProgressRing Name="MyProgressRing" Grid.Row="0" Height="100" Width="100" Foreground="Red" IsActive="True" Visibility="Visible" />
            <ListView   Name="SearchResultListView"
                        SelectionMode="Single"
                        IsItemClickEnabled="True"
                        ItemClick="SearchResultListView_ItemClick">

                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                    </Style>
                </ListView.ItemContainerStyle>

                <ListView.ItemTemplate>
                    <DataTemplate x:DataType="ViewModel:SearchResultViewModel">

                        <Grid Style="{StaticResource SearchResultListViewStyle}">
                            <Grid.RowDefinitions>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                            </Grid.RowDefinitions>

                            <StackPanel Grid.Row="0">
                                <TextBlock Text="{x:Bind Name}"
                                    Grid.Row="0"/>
                            </StackPanel>

                            <TextBlock Text="{x:Bind Source}"
                                    Grid.Row="1"/>

                            <TextBlock Text="{x:Bind Author}"
                                    Grid.Row="2"/>

                            <TextBlock Text="{x:Bind EducationalLevel}"
                                    Grid.Row="3"/>

                            <StackPanel Orientation="Horizontal"
                                        Grid.Row="4">
                                <Border Background="Gray"
                                        Padding="3"
                                        CornerRadius="1">
                                    <TextBlock Text="{x:Bind Language}"
                                                FontSize="12"
                                                Margin="0, 0, 0, 2"/>
                                </Border>
                            </StackPanel>
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
    <RelativePanel>

        <Button Name="FilterButton"
                Foreground="Red"
                Width="85"
                Height="85" 
                BorderBrush="Blue"
                RelativePanel.AlignRightWithPanel="True"
                RelativePanel.AlignBottomWithPanel="True"
                Margin="0, 0, 40, 30"
                Style="{StaticResource CircleButtonStyle}"
                Click="FilterButton_Click">
            <Grid Width="60"
                    Height="60">
                <Ellipse Height="60" Width="60">
                    <Ellipse.Fill>
                        <ImageBrush ImageSource="/Assets/LandingPageLogos/LearningResourceTypeList/Article.png"/>
                    </Ellipse.Fill>
                </Ellipse>
            </Grid>
        </Button>

    </RelativePanel>
</Grid>

我想我ProgressRing是在此之上ListView,该页面的中间时,我做MyProgressRing.Visibility = Visibility.Visible.

Answer 1

您必须更改布局并放置ProgressRing内容元素.例如:

<Grid>
    <Grid>
    <!-- your content here -->
    </Grid>

    <ProgressRing Name="MyProgressRing" Grid.Row="0" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center" Width="100" Foreground="Red" IsActive="True" Visibility="Visible" />
</Grid>