Xamarin.Forms.Image Does Not Appear

The Image does not appear when HorizontalOptions = LayoutOptions.CenterAndExpand

Reproduction Sample: https://github.com/brminnick/GlideX_HorizontalOptions_Repro

[jonathanpeppers]

In some layouts you should try setting HeightRequest or WidthRequest.

The problem is a conflict in how Glide and Xamarin.Forms work: https://github.com/jonathanpeppers/glidex/issues/10#issuecomment-433109852

[brminnick]

Image in StackLayout Doesn’t Appear

Here’s another example where the image doesn’t appear; this time when it’s inside of a StackLayout

public class StackLayoutPage : ContentPage
{
    const string _xamarinImageUrl = "https://raw.githubusercontent.com/github/explore/06da849e137507b144448ac2b28bc19d3b909cab/topics/xamarin/xamarin.png";

    public StackLayoutPage()
    {
        var imageLabel = new Label { Text = "This image is broken" };
        var brokenImage = new Image { Source = _xamarinImageUrl };

        var stackLayout = new StackLayout
        {
            Children = {
                imageLabel,
                brokenImage
            }
        };

        Content = stackLayout;
    }
}

Workaround

Specifying a value for HeightRequest will allow the image to appear

public class StackLayoutPage : ContentPage
{
    const string _xamarinImageUrl = "https://raw.githubusercontent.com/github/explore/06da849e137507b144448ac2b28bc19d3b909cab/topics/xamarin/xamarin.png";

    public StackLayoutPage()
    {
        var imageLabel = new Label { Text = "This image is not broken" };
        var brokenImage = new Image
        {
            HeightRequest = 100,
            Source = _xamarinImageUrl
        };

        var stackLayout = new StackLayout
        {
            Children = {
                imageLabel,
                brokenImage
            }
        };

        Content = stackLayout;
    }
}