maui: Setting images in code (still) doesn't work on Android

Description

It has been said this would have been fixed but its not. Its broken in RC2 and still broken in RC3. Setting an image from an URL (or from a stream doesn’t matter) in code does not show up in Android. Could test it on iOS and its broken there too.

Steps to Reproduce

public partial class MyPage : ContentPage
{
    public MyPage()
    {
        InitializeComponent();
        MyImageControl = new Image
        {
        	Source = ImageSource.FromStream(() => new MemoryStream(Convert.FromBase64String("your image base64 string here")))
        // OR:
        //	Source = ImageSource.FromUri(new Uri("your image URL here"))
        };
    }
}

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
		<Image x:Name="MyImageControl" />
</ContentPage>

Version with bug

Release Candidate 3 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android, iOS

Affected platform versions

Android 11, Pixel 5, Android Simulator on Windows, iOS 15

Did you find any workaround?

See https://github.com/dotnet/maui/issues/7074#issuecomment-1182933173

Relevant log output

No response

About this issue

Original URL
State: closed
Created 2 years ago
Reactions: 2
Comments: 19 (6 by maintainers)

Most upvoted comments

@mattleibow Ah okay that makes sense. Then I’ll try it like @jsuarezruiz did. If it still doesn’t work that way (which I assume is not the case) I will create a new issue. Thanks for the explanation.

Symbai on Oct 6, 2022

This seems to be broken on Windows too, not just Android and iOS.

Saving to filesystem and using ImageSource.FromFile works as a workaround.

joosera on Aug 3, 2022

Same here. Looks like it works with this work-around, but I would love to see it working from stream. Thanks for the help!

mgwojciech on Jul 13, 2022

I can confirm that writing the image to disk first and then load it via ImageSource.FromFile works. @NonameMissingNo Thanks for that! (But next time please edit your reply to append more information instead of creating triple posts 🤗).

<Image Source="{Binding BindableImage}"/>

public byte[] Image { get; set; }

public ImageSource BindableImage
{
	get
	{
		string cacheDir = FileSystem.Current.CacheDirectory;
		string imageFile = $"{cacheDir}image.jpg";

		File.WriteAllBytes(imageFile, Image);
		return ImageSource.FromFile(imageFile);
	}
}

However this workaround also ends up with spamming the user’s file system, depending on how many different images you’re loading this way. I would still appreciate if this issue is getting addressed soon.

//edit: Also it seems to always load the original image. For example I have a picture of a dog, use the code above and a dog image is displayed. So far so good. Now I close my mobile app, use the same code above but for a picture of a cat but instead of seeing a picture of a cat, I still see the dog picture. That means that for each image I have to use a unique file path, that makes the workaround even less attractive.

Symbai on Jul 13, 2022

+1 on this one. I would consider it a critical issue as You cannot render any image that is stored in a container that requires authentication.

mgwojciech on Jul 13, 2022

Any update on this one? Its broken since two Maui releases and my app depends on it so I cannot release it until its fixed. FYI: Meanwhile I was able to test this on iOS and its broken there too.

Symbai on Jun 9, 2022