在 Windows 10 应用 C# 中加载下一个图像时,在翻转视图中显示进度条

本文关键字:视图 翻转 显示 图像 Windows 应用 下一个 加载 | 更新日期: 2023-09-27 18:37:05

I 使用此代码在翻转视图中显示图像

XAML 代码:

<Grid>    
  <FlipView x:Name="flpvwImageBind" 
            Margin="0,0,0,0" 
            HorizontalAlignment="Center" 
            VerticalAlignment="Center" 
            Loading="flpvwImageBind_Loading" 
            Loaded="flpvwImageBind_Loaded">
    <FlipView.ItemTemplate>
      <DataTemplate>
        <Image Source="{Binding Thumbnail}" 
               Stretch="Fill" 
               x:Name="image" 
               Margin="0,0,0,0" >
        </Image>
      </DataTemplate>
    </FlipView.ItemTemplate>
  </FlipView>
</Grid>

XAML.cs代码

flpvwImageBind.ItemsSource = ShowCastManager.Loadpopupimages(PersonID);

在这里,我绑定了来自在线的图像URL,因此加载下一张图像需要时间,因此我想在加载下一张图像之前显示进度条,如何执行此操作。

在 Windows 10 应用 C# 中加载下一个图像时,在翻转视图中显示进度条

将进度环放在翻转视图之后,并为图像控件添加加载和加载事件

<Grid>    
<FlipView x:Name="flpvwImageBind" Margin="0,0,0,0" HorizontalAlignment="Center" VerticalAlignment="Center" Loading="flpvwImageBind_Loading" Loaded="flpvwImageBind_Loaded">
            <FlipView.ItemTemplate>
                <DataTemplate>
                    <Image Source="{Binding Thumbnail}" Loading="image_Loading" Loaded="image_Loaded" Stretch="Fill" x:Name="image" Margin="0,0,0,0" ></Image>
                </DataTemplate>
            </FlipView.ItemTemplate>
        </FlipView>
  <ProgressRing x:Name="progressring" Height="50" Width="50"/>
</Grid>

并将此代码放入您的 cs 文件中

private void image_Loading(FrameworkElement sender, object args)
{ 
  progressring.IsActive = true;
}
private void image_Loaded(object sender, RoutedEventArgs e)
{
  progressring.IsActive = false;
}