在独立存储中绑定图像 [英] Binding image in Isolated Storage

问题描述

嘿.我有一个用户可以搜索的项目列表.搜索结果显示在列表框中.每个 animal 对象都有一个到独立存储中的图像的路径.将 listboxitem 内的 Image 控件绑定到独立存储中的图像的最快方法是什么?我见过的例子倾向于显示来自互联网的图像而不是独立存储.如果我有大约 10 张图像，它似乎占用了所有内存并崩溃.谢谢

Hey. I have a list of items that the user can search. The search results are displayed in a listbox. Each animal object has a path to an image in Isolated Storage. What's the quickest way to bind my Image control inside the listboxitem to the image in the isolated storage? Examples I've seen tend to display images from the internet rather than Isolated Storage. If I have around 10 images, it seems to take up all the memory and crash. thanks

我在我的 BitmapConverter 类中使用它(继承 IValueConverter)

I'm using this in my BitmapConverter class (inherits IValueConverter)

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value !=null)
            {
                BitmapImage bitmapImage = new BitmapImage();
                bitmapImage.SetSource(new MemoryStream((Byte[]) value));
                return bitmapImage;
            }
            else
            {
                return null;
            }
        }

我在 AppResource.xaml 文件的顶部有这个:

I have this at the top of my AppResource.xaml file:

    <ImageApp_Converter:BitmapConverter x:Key="bmpConverter" />    

In my style, within the AppResource.xaml file:

<Image  HorizontalAlignment="Left" Margin="8,8,0,4" Width="160" Height="120" Source="{Binding Converter={StaticResource bmpConverter}}"   />

我在 BitmapConverter 中设置了一个断点，但它从未被调用.我以前从未使用过 IValueConverter，所以任何帮助都会很棒.谢谢

I set a breakpoint in my BitmapConverter, but it's never called. I've never used IValueConverter before, so any help would be great. Thanks

推荐答案

显示的代码中存在一些问题.您的示例中可能缺少某些内容:

There are a few problems in the code shown. Some may just be missing from your example:

首先，您对转换器的绑定没有指定什么绑定以获得其值，因此它永远不会被调用.至少它需要一个 Path= (或简单的属性名称作为快捷方式)，否则转换器将不会被调用.您在哪里设置列表的 ItemSource?

Firstly, your binding to the converter does not specify what to bind to to get its value, so it is never called. At a minimum it needs a Path= (or simply a property name as short-cut) or the converter will not be called. Where are you setting the ItemSource of your list?

其次，传递的值是字符串文件名.您的转换器需要将它们用作文件名并根据该名称打开一个流.目前它正在尝试将名称用作字节数组.

Secondly, the values getting passed are string file names. Your converter needs to use them as filenames and open a stream based on that name. At the moment it is trying to use the names as byte arrays.

最后，如果图像是固定集，将它们存储在 ClientBin 下的图像文件夹中并使用以下路径语法/images/imagename.jpg"等简单地引用它们会更有意义.这将涉及浏览器自动缓存.您不需要转换器.(关键是前导的/".没有那个，Silverlight 假设图像在当前模块中)

Finally, if the images are a fixed set, it would make more sense to store them in an images folder under ClientBin and simply refer to them with the following path syntax "/images/imagename.jpg" etc. This will involve the browser's caching automatically. You do not need a converter for that. (The key is the leading "/". Without that Silverlight assumes the images are in the current module instead)

以下是使用 ClientBin/images 文件夹中显示的图像的完整示例，运行时如下所示:

Below is a complete example using the images shown in the ClientBin/images folder that looks like this when run:

示例 Xaml 文件:

Sample Xaml file:

<UserControl x:Class="SilverlightApplication1.IsoImages"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:ImageApp_Converter="clr-namespace:SilverlightApplication1" mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <Grid x:Name="LayoutRoot" Background="White">
        <ListBox x:Name="ImageList">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Background="AliceBlue">
                        <Image HorizontalAlignment="Left" Margin="8,8,0,4" Width="160" Height="120" Source="{Binding Path=Filename}" />
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</UserControl>

后面的示例代码是:

using System.Collections.Generic;
using System.Windows.Controls;

namespace SilverlightApplication1
{
    public partial class IsoImages : UserControl
    {
        public IsoImages()
        {
            InitializeComponent();
            List<ImageItem> images = new List<ImageItem>()
                                         {
                                             new ImageItem("/images/Image1.jpg"), 
                                             new ImageItem("/images/Image2.jpg"),
                                             new ImageItem("/images/Image3.jpg"),
                                             new ImageItem("/images/Image4.jpg")
                                         };
            this.ImageList.ItemsSource = images;
        }
    }

    public class ImageItem
    {
        public string Filename{ get; set; }
        public ImageItem( string filename )
        {
            Filename = filename;
        }
    }
}

这篇关于在独立存储中绑定图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！