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.

Rico Suter · Accepted Answer · 2013-11-18T19:18:49.080

44

I just tried

Image.Source = new BitmapImage(
    new Uri("http://yourdomain.com/image.jpg", UriKind.Absolute));

And it works without problems... I'm using System.Uri here. Maybe you have a malformed URI or you have to use an absolute URI and use UriKind.Absolute instead?

edited Nov 18 '13 at 19:18

answered Jun 29 '12 at 18:48

Rico Suter

11,548
6
67
93

me also getting an exception? – Arsal Aug 21 '15 at 21:27

score 17 · Answer 2 · answered Jun 29 '12 at 19:49

17

This is what I use:

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

answered Jun 29 '12 at 19:49

avens19

179
5

What is the Build Action for the placeHolder.png. I've got it set to 'Content' and I'm not getting the image loading properly. – Mac Feb 26 '13 at 01:11
9

I'm getting an error that `RandomAccessStreamReference` cannot be converted into `ImageSource`. – Nick Heiner Apr 14 '13 at 14:39
2

Image.Source = new BitmapImage( new Uri("ms-appx:///Assets/placeHolder.png", UriKind.Absolute)); – Rahul K Mar 15 '16 at 09:18

score 6 · Answer 3 · answered Jun 29 '12 at 18:44

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.

score 5 · Answer 4 · answered May 30 '13 at 12:44

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;
        }
    }

score 4 · Answer 5 · answered Jul 02 '12 at 02:13

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.

score 3 · Answer 6 · edited May 23 '17 at 11:46

3

Try this format:

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

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

edited May 23 '17 at 11:46

Community

1
1

answered Jun 29 '12 at 18:48

walther

13,466
5
41
67

reza.cse08 · Answer 7 · 2016-01-13T12:18:20.100

0

<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;
}

edited Jan 13 '16 at 12:18

answered Dec 28 '15 at 09:14

reza.cse08

5,938
48
39

Programmatically set the Source of an Image (XAML)

7 Answers7

Linked