Xamarin表单（Xaml）ListView不显示图像

Question

My XAML looks like this:

<?xml version="1.0" encoding="utf-8" ?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:d="http://xamarin.com/schemas/2014/forms/design"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         mc:Ignorable="d"
         x:Class="MyApp.Mobile.MyPage">
<ContentPage.Content>
    <StackLayout>
        <Image Source="http://MyUrl/MyImage.png" />  <!-- WORKS -->
        <ListView ItemsSource="{Binding Cells}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Orientation="Vertical">
                            <Label Text="{Binding RowName}" />
                            <Label Text="{Binding ColumnName}" />
                            <Image Source="http://MyUrl/MyImage.png" /> <!-- DOES NOT WORK-->
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>
</ContentPage.Content>

Xamarin Forms (testing on Android) The first image displays fine. The very same image in the ListView does not display. Ultimately I will using a Binding like the Labels (which work), but I have hard coded the URL as I diagnose the issue.

Does anyone know why the Image is not displaying in the ListView?

Answer 1

Try like below,

<ListView 
            HasUnevenRows="True"
            ItemsSource="{Binding Cells}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Orientation="Vertical">
                            <Label Text="{Binding RowName}" />
                            <Label Text="{Binding ColumnName}" />
                            <Image Source="http://xamarin.com/content/images/pages/index/hero.jpg" />
                            <!-- DOES NOT WORK-->
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

It is working checked at my end.

Happy Coding..

Kishore Kumar Vangala.

Answer 2

I higly suggest to use FFImageLoading when dealing with images in listview. The performance gain and optimized memory consumption is huge! Github | Nuget

Then in listview, in order to avoid issues with cell sizing, is better to specify HeightRequest and WidthRequest to your Image , then use an Aspect that fits your need ( AspectFit , AspectFill , ecc...)

Just tested now and everything is working without issues.