下载后未加载 WinRT Image XAML答案

【问题标题】：WinRT Image XAML is not loaded after download下载后未加载 WinRT Image XAML
【发布时间】：2014-11-30 14:36:40
【问题描述】：

我正在为 Win 8.1 (WinRT) 开发一个 Windows 应用商店应用程序。该应用程序的其中一个页面是地址簿。在某些情况下，应用程序会收到推送通知。其中之一可能是某个联系人有一张新照片。当应用程序处理推送通知（不是推送通知的后台任务，它工作正常）时，它会从推送通知中指定的链接下载新图像并触发应该使用新图像更新 UI 的事件。图像存储在 LocalFolder (ApplicationData.Current.LocalFolder) 中。触发事件后，UI 会更新，但现在没有相应联系人的任何图片。重新启动应用程序后，出现图片。在应用程序运行时，我还打开了 Windows 资源管理器以查看文件是否已下载。一件奇怪的事情是，在应用程序重新启动（或停止）之前，没有新图片的缩略图。我真的不明白为什么我需要重新启动应用程序才能显示图片。图像非常小，大约 40-60KB。更新是通过重置绑定到引发 PropertyChanged 的属性的 ItemsSource 来实现的。可以看到设置了ItemsSource，因为短暂的闪烁，但是现在更新的item没有图片了。

这是下载的代码：

public async Task GetContactImage(String[] pushContent)
    {
        var folder = ApplicationData.Current.LocalFolder;
        var contactImagesfolder = await folder.CreateFolderAsync("ContactImages", CreationCollisionOption.OpenIfExists);

        HttpClient httpClient = new HttpClient();
        // Increase the max buffer size for the response so we don't get an exception with so many web sites
        httpClient.MaxResponseContentBufferSize = 256000;
        HttpResponseMessage response = await httpClient.GetAsync(pushContent[2]);

        StorageFile picture = await contactImagesfolder.CreateFileAsync(pushContent[2].Split('/').Last(), CreationCollisionOption.ReplaceExisting);
        IRandomAccessStream pictureStream = await picture.OpenAsync(FileAccessMode.ReadWrite);
        DataWriter writer = new DataWriter(pictureStream.GetOutputStreamAt(0));
        writer.WriteBytes(await response.Content.ReadAsByteArrayAsync());
        await writer.StoreAsync();
        writer.DetachStream();
        await pictureStream.FlushAsync();

        pictureStream.Dispose();
        writer.Dispose();

        Dal.Instance.UpdateContactImage(pushContent[1], pushContent[2]);
    }

相应的 XAML，它是 ListView 的 DataTemplate (duh)：

<Image Height="128" Width="128" Source="{Binding Converter={StaticResource contactImageConverter}}" />

还有我用来设置 Source 属性的转换器：

public object Convert(object value, Type targetType, object parameter, string language)
    {
        var contact = value as Contact;
        String imagePath = "ms-appx:///Assets/UnknownMan.png";
        if (contact != null)
        {
            if (contact.Image != null && contact.Image != "" && contact.Image != "Unknow_man.png")
            {
                imagePath = "ms-appdata:///local/ContactImages/" + contact.Image.Split('/').Last();                    
            }
        }

        return imagePath;
    }

非常感谢您的帮助！

【问题讨论】：

虽然有从字符串到 ImageSource 的自动类型转换：如果您的转换器返回 BitmapImage 而不仅仅是图像路径字符串，它会如何表现？类似return new BitmapImage(new Uri(imagePath));。
新的URI和旧的一样吗？如果一样，还有一点点闪烁，可能是第一个请求被缓存了。你能得到 HTTP 标头的 NETMON 或 Fiddler 跟踪吗？
如何调试：将问题分解成更小的部分。用你知道有效的东西代替行动链中的每一步。例如。嵌入位图资源或从文件加载位图以在运行时设置，看看是否可以让 that 工作。如果是，那么您可以专注于检索其他位图；如果没有，那么您可以专注于位图的设置。照原样，这里的信息太少，无法回答。见stackoverflow.com/help/mcve
谢谢大家的帮助，但问题的原因原来是我如何将文件保存到文件系统。我将发布解决方案作为这个问题的答案。

标签： c# xaml windows-runtime windows-store-apps

【解决方案1】：

事实证明，将文件保存到文件系统的方法创建了某种句柄，这将不允许应用程序加载图像。我所做的是改变保存文件的方法。

StorageFolder folder = ApplicationData.Current.LocalFolder;
StorageFolder contactImagesfolder = await folder.CreateFolderAsync("ContactImages", CreationCollisionOption.OpenIfExists);
StorageFile picture = await contactImagesfolder.CreateFileAsync(imageURL.Split('/').Last(), CreationCollisionOption.FailIfExists);

HttpClient httpClient = new HttpClient();
// Increase the max buffer size for the response so we don't get an exception with so many web sites
httpClient.MaxResponseContentBufferSize = 256000;
HttpResponseMessage response = await httpClient.GetAsync(imageURL);

var responseByteArray = await response.Content.ReadAsByteArrayAsync();
await FileIO.WriteBytesAsync(picture, responseByteArray);

Dal.Instance.UpdateContactImage(contactID, imageURL);

【讨论】：