如何在DataTemplate中显示不同的图像

本文关键字：图像 显示 DataTemplate | 更新日期: 2023-09-27 17:51:00

在ListView的DataTemplate中，我有以下代码

<Image Grid.Column = "1" Grid.ColumnSpan = "2" Grid.Row = "0" Source = "{Binding Picture}" VerticalAlignment = "center" />

我是一个绑定图片属性。此属性是一个字符串，包含web上图像的地址。我如何在没有互联网连接的情况下显示我在项目中的图像?

如何在DataTemplate中显示不同的图像

一个快速的方法是订阅ImageFailed事件:

<Image Source="{Binding Picture}" ImageFailed="ImageFailed" />

然后，在事件处理程序中，将Source属性更改为本地图片:

private void ImageFailed(object sender, ExceptionRoutedEventArgs e)
{
    ((Image)sender).Source = new BitmapImage(new Uri("ms-appx:///Assets/WideLogo.scale-240.png"));
}

此链接表示存在Image.ImageFailed事件。您可以在其处理程序中设置另一个源。

或者，您可以在视图模型代码中检查互联网连接，并将图片值设置为"ms-appx:///Assets/image_name.png"

根据使用情况(例如在GridView中显示图像，其中您知道目标图像大小)，另一种选择是始终显示默认图像，然后如果并且当正确的图像被下载时，它将显示在默认图像的顶部。

只要列出两张图片，第二张就会显示在第一张上面。

<Grid>
   <Image Source="{Binding DefaultPicture}" />
   <Image Source="{Binding Picture}" />
</Grid>

您可以尝试使用转换器。只需使用IValueConverter和HttpClient来检查文件是否存在于互联网上。如果HttpClient失败，返回本地图像URL。

相关文章：