Xamarin Forms: Remote Images don't load on Android

Question

I've been playing with Xamarin Forms, I create a simple app that consumes themoviedb api it shows the a movie list in a ListView control, pretty straightforward. I left it for some weeks, yesterday I gave it a try and I notice the images in Android Simulator never show up, the same with a physical device, the only variance I had was I created the project with VS2017 and now I open it with VS2019 (Community Edition both), googling I see some posts (very few though) that point out the problem was the https images and the HttpClient config, I checked and everything looked fine out-of-box

I tested many other things such creating a brand new project with a simple image, try with a different image in the same app and no luck, I test the app in iOS and everything looks correct.\

The App only has 1 page, this is the XAML of it: https://github.com/olman21/xamarin-movies/blob/master/Xamarin.Movies/Xamarin.Movies/Views/SearchMoviePage.xaml

Image XAML

<Image Source="{Binding BackdropPath, Converter={StaticResource movieDbImageConverter}}"
                               Aspect="AspectFill"
                               HeightRequest="160"
                               Grid.Row="0"/>

movieDbImageConverter

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var imageName = value as string;
        if (imageName == null) return string.Empty;

        return ImageSource.FromUri(new Uri($"{internalSettings.MovieDbImageBaseUrl}/{imageName}"));
    }

And this is the full Repo: https://github.com/olman21/xamarin-movies

Any help will be appreciated!

Is it only on Android? Can you please post the problematic XAML here? Did you update Xamarin nuget packages before trying? — Morse
do you have internet permissions enabled in the Android manifest? — Jason
Try to debug MovieDbImageConverter.cs, out breakpoint into Convert function. — Oleg

Morse Morse · Accepted Answer · 2019-10-21T01:12:40

Here is the issue, I figured it out.

Change new Uri($"{internalSettings.MovieDbImageBaseUrl}/{imageName}"); to

new Uri($"{internalSettings.MovieDbImageBaseUrl}{imageName}");

ex URL is https://image.tmdb.org/t/p/w500/nRXO2SnOA75OsWhNhXstHB8ZmI3.jpg not https://image.tmdb.org/t/p/w500//nRXO2SnOA75OsWhNhXstHB8ZmI3.jpg

Browsers understand that Android OS wont apprently.

Xamarin Forms: Remote Images don't load on Android

1 Answers