ImageSource is not work when set Image.Source to file in external storage

Description

When I load an Android External Storage Image using the Image.Source binding ImageSrouce. Image is not displayed .

Steps to Reproduce

I want to read this image:“/storage/emulated/0/Documents/albumart9100466824972896645.jpg” and show it, I assign AlbumArt to my binding object as follows
AlbumArt = ImageSource.FromStream(() => { var b = File.ReadAllBytes("/storage/emulated/0/Documents/albumart9100466824972896645.jpg"); return new MemoryStream(b); });

AlbumArt = ImageSource.FromFile("/storage/emulated/0/Documents/albumart9100466824972896645.jpg");

the image has been readed exactly correct:

I tried using ImageSource.FromStream, and using ImageSource.FromFile, it didn’t work (no display, Image control is blank)

The only thing it is work is to use Resources/albumart_placeholder. JPG which is set to MauiImage AlbumArt = "albumart_placeholder"; //it is work

Version with bug

Preview 14

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

Android 11

Did you find any workaround?

No response

Relevant log output

No response

[NJCCJohnWatson]

Because the MAUI File api still have bugs,and the developer tell us use FilePicker to get external storage file And the file will not can be read directly(could caused by Android control) . it will be save a virual path on /data/0/[your package name] /cache/xxx/xxx/[yourimagename]. In Android devices you use blow code to get image and set it to <Image/> tag on xaml.

1.First we need a async FilePicker

public async Task<string> TakePath()
        {
            if (MediaPicker.Default.IsCaptureSupported)
            {
                FileResult photo = await MediaPicker.Default.PickPhotoAsync();

                if (photo != null)
                {
                    // save the file into local storage
                    return photo.FullPath;
                }
                else
                {
                    return "";
                }
            }
            else
            {
                return "";

            }
        }    

2.Then use a event to mount FilePicker

    private async void SetDownloadPath(object sender, EventArgs e)
    {
        FileIO fs = new FileIO();
        string path = await fs.TakePath();
        CounterLabel.Text = path;
        //get parent folder path
        FileInfo fi = new FileInfo(path);
        var realPath = fi.Directory;
        savingPath = path;
    }

3.Now we get the picture path,use blow function to set to Image

    private void LoadImageLocal(string path, Image img)
    {        
        var byteArray = File.ReadAllBytes(path);
        img.Source = ImageSource.FromStream(() => new MemoryStream(byteArray));
        //both can use, just for test
        img = new Image
        {
            Source = ImageSource.FromFile(path)
        };
    }

4.Load image from web , its more easiler too

    private void LoadImageUrl(string url, Image img)
    {
        var byteArray = new HttpClient().GetByteArrayAsync(url).Result;
        img.Source = ImageSource.FromStream(() => new MemoryStream(byteArray));
    }

Now we fixed Read issue and my problem is can not be Write to External Storage Only can write file in /data/0/[your package name] /file/ It’s so conveniently!🤣

All code above from my practicing project https://github.com/NJCCJohnWatson/BiliAvatarMAUI And about further content of Filepicker on MSDoc: https://docs.microsoft.com/en-us/dotnet/maui/platform-integration/storage/file-picker?tabs=android

[NJCCJohnWatson]

是孙燕姿欸！ I think its better way is read by stream and bind to image