Question

I need to bind images located in isolated storage –
I found one answer here and it seems my situation
Binding image in Isolated Storage

But then this person has switched to the another solution and used ClientBin for image storage. My pictures will be different all the time.
Now I use images from the server, but I need to save them to the isolated storage and bind to the listBox
code in XAML:

Image Width="110" CacheMode="BitmapCache" Source="{Binding ThumbURL}"

code behind:

public string ThumbURL
    {
        get
        {
            return String.Format("http://localhost:3041/Pictures/thumbs/{0}.jpg", _ID);
        }
        set
        {
            this.OnThumbURLChanging(value);
            this._ThumbURL = value;
            this.OnThumbURLChanged();
            this.OnPropertyChanged("ThumbURL");
        }
    }

Can anyone advice me of how to do it? I’ll be really, really grateful.

Please post some example of the code.

Answer 1

To download pictures from the web see this previous SO question – how-can-i-download-and-save-images-from-the-web.

The difference with binding an image in Isolated Storage is that you have to bind to a BitmapImage object which you initialise from your bound code object. I’ve renamed your property to “ThumbImage” from “ThumbURL” to show the difference.

So in XAML:

Image Width="110" CacheMode="BitmapCache" Source="{Binding ThumbImage}"

And in your bound object – assuming this picture doesn’t change – if it does you’ll have to raise the property changed event as appropriate. (code edited to deal with class serialization issue).

private string _thumbFileName;
public string ThumbFileName
{
    get
    {
        return _thumbFileName;
    }
    set
    {
        _thumbFileName = value;
        OnNotifyChanged("ThumbFileName");
        OnNotifyChanged("ThumbImage");
    }
}

[IgnoreDataMember]
public BitmapImage ThumbImage 
{ 
    get 
    { 
        BitmapImage image = new BitmapImage();                    
        IsolatedStorageFile isoStore = IsolatedStorageFile.GetUserStoreForApplication();
        string isoFilename = ThumbFileName;
        var stream = isoStore.OpenFile(isoFilename, System.IO.FileMode.Open);
        image.SetSource(stream);
        return image;
    }     
}

public event PropertyChangedEventHandler PropertyChanged;

private void OnNotifyChanged(string propertyChanged)
{
    var eventHander = PropertyChanged;
    if (eventHander != null)
    {
        PropertyChanged(this, new PropertyChangedEventArgs(propertyChanged));
    }
}

(Edited to add link to how to download image in the first place)