在视图

时间:2017-06-12 06:06:17

标签: xaml uwp

我正在制作UWP,我的视图中已经有ListView。当我单击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时,我希望在此页面的中间位置。

3 个答案:

答案 0 :(得分:5)

您必须更改布局并将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>

答案 1 :(得分:3)

@AVK和@Andrii Krupka有一个很好的方法。

但我认为你可以设置Zindex以显示进度响铃。

代码如下:

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

10000000是一个数字,超过了所有控件的数量。

另一种方法是在代码中设置ProgressRing:

   MyProgressRing.SetValue(Canvas.ZIndexProperty,int.MaxValue);

答案 2 :(得分:2)

您可以右键单击控制,转到Order并选择Bring to Front

enter image description here