Programmatically set the Source of an Image (XAML)

Question

I am working on a Windows 8 app. I need to know how to programmatically set the Source of an Image. I assumed that the Silverlight approach would work. However, it doesn't. Does anybody know how to do this? The following will not work:

string pictureUrl = GetImageUrl();
Image image = new Image();
image.Source = new Windows.UI.Xaml.Media.Imaging.BitmapImage(new Uri(pictureUrl, UriKind.Relative));
image.Stretch = Stretch.None;
image.HorizontalAlignment = Windows.UI.Xaml.HorizontalAlignment.Left;
image.VerticalAlignment = Windows.UI.Xaml.VerticalAlignment.Center;

I get an Exception that says: "The given System.Uri cannot be converted into a Windows.Foundation.Uri."

However, I can't seem to find the Windows.Foundation.Uri type.

Answer 1

This example uses a FileOpenPicker object to obtain the storage file. You can use whatever method you need to access your file as a StorageFile object.

Logo is the name of the image control.

Reference the following code:

    var fileOpenPicker = new FileOpenPicker();
    fileOpenPicker.ViewMode = PickerViewMode.Thumbnail;
    fileOpenPicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary;
    fileOpenPicker.FileTypeFilter.Add(".png");
    fileOpenPicker.FileTypeFilter.Add(".jpg");
    fileOpenPicker.FileTypeFilter.Add(".jpeg");
    fileOpenPicker.FileTypeFilter.Add(".bmp");

    var storageFile = await fileOpenPicker.PickSingleFileAsync();

    if (storageFile != null)
    {
        // Ensure the stream is disposed once the image is loaded
        using (IRandomAccessStream fileStream = await storageFile.OpenAsync(Windows.Storage.FileAccessMode.Read))
        {
            // Set the image source to the selected bitmap
            BitmapImage bitmapImage = new BitmapImage();

            await bitmapImage.SetSourceAsync(fileStream);
            Logo.Source = bitmapImage;
        }
    }

Answer 2

Well, Windows.Foundation.Uri is documented like this:

.NET: This type appears as System.Uri.

So the tricky bit isn't converting it into a Windows.Foundation.Uri yourself - it looks like WinRT does that for you. It looks like the problem is with the URI you're using. What is it relative to in this case? I suspect you really just need to find the right format for the URI.

Answer 3

check your pictureUrl since it was what resulted in the exception.

but this should work as well

img.Source = new BitmapImage(new Uri(pictureUrl, UriKind.Absolute));

it should have nothing to do with Windows.Foundation.Uri. since winrt will handle it for you.

Answer 4

Try this format:

ms-appx:/Images/800x600/BackgroundTile.bmp

The given System.Uri cannot be converted into a Windows.Foundation.Uri

Answer 5

This is what I use:

string url = "ms-appx:///Assets/placeHolder.png";
image.Source = RandomAccessStreamReference.CreateFromUri(new Uri(url));

Answer 6

<Image Name="Img" Stretch="UniformToFill" />

var file = await KnownFolders.PicturesLibrary.GetFileAsync("2.jpg");
using(var fileStream = (await file.OpenAsync(Windows.Storage.FileAccessMode.Read))){
     var bitImg= new BitmapImage();
     bitImg.SetSource(fileStream); 
     Img.Source = bitImg;
}