'Listview in xamarin form not using full space of form

I am working on Xamarin forms cross platform app. I have a form where i need to show data in listview.

Data is displaying but its not using entire space resulting in keeping unwanted space at bottom.

enter image description here

my xaml is as follows

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="BMTHomesApp.Views.ImportantAppointments">
    <ContentPage.Content>
        <StackLayout VerticalOptions="StartAndExpand">
            <ListView HasUnevenRows="True" RowHeight="100" HeightRequest="-1" x:Name="ListViewAppointments" VerticalOptions="StartAndExpand">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <Grid Padding="20,0,0,0" ColumnSpacing="20">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="40"></RowDefinition>
                                    <RowDefinition Height="40"></RowDefinition>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="40"></ColumnDefinition>
                                    <ColumnDefinition Width="*"></ColumnDefinition>
                                </Grid.ColumnDefinitions>

                                <!--<BoxView Color="#f7f7f7" Grid.Column="0" Grid.RowSpan="2"/>
                                <BoxView Color="#ffffff" Grid.Column="1" Grid.RowSpan="2"/>-->
                                <Image Grid.RowSpan="2" Grid.Column="0" x:Name="ImageAppointmentIcon" Source="AppointmentsIcon.png" Aspect="AspectFit"></Image>
                                <Label TextColor="#00344e" FontAttributes="Bold" Text="{Binding Subject}" Grid.Row="0" Grid.Column="1" VerticalTextAlignment="End"></Label>
                                <Label TextColor="#0073ae" Text="{Binding StartDate}" Grid.Row="1" Grid.Column="1" VerticalTextAlignment="Start"></Label>
                            </Grid>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
            <ActivityIndicator x:Name="ActLoder"  HorizontalOptions="CenterAndExpand" Color="#ffffff" VerticalOptions="CenterAndExpand"  />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>


Solution 1:[1]

Could be the ActivityIndicator after the ListView. They are enclosed inside a StackLayout so will both take up space vertically.

If you want the ActivityIndicator to appear over the top of the ListView, replace the StackLayout with a Grid.

Not sure what the HeightRequest=-1 is there for.

Solution 2:[2]

I would guess that the StackLayout is causing your layout issue. You are stacking the Listview ontop of an ActivityIndicator

If you want the ActivityIndicator to appear in the same space as the Listview but centered then you can try the following:

<ContentPage.Content>
    <Grid>
        <ListView HasUnevenRows="True" RowHeight="100" x:Name="ListViewAppointments" VerticalOptions="StartAndExpand">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Grid Padding="20,0,0,0" ColumnSpacing="20">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="40"></RowDefinition>
                                <RowDefinition Height="40"></RowDefinition>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="40"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                            </Grid.ColumnDefinitions>

                            <!--<BoxView Color="#f7f7f7" Grid.Column="0" Grid.RowSpan="2"/>
                            <BoxView Color="#ffffff" Grid.Column="1" Grid.RowSpan="2"/>-->
                            <Image Grid.RowSpan="2" Grid.Column="0" x:Name="ImageAppointmentIcon" Source="AppointmentsIcon.png" Aspect="AspectFit"></Image>
                            <Label TextColor="#00344e" FontAttributes="Bold" Text="{Binding Subject}" Grid.Row="0" Grid.Column="1" VerticalTextAlignment="End"></Label>
                            <Label TextColor="#0073ae" Text="{Binding StartDate}" Grid.Row="1" Grid.Column="1" VerticalTextAlignment="Start"></Label>
                        </Grid>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <ActivityIndicator x:Name="ActLoder"  HorizontalOptions="CenterAndExpand" Color="#ffffff" VerticalOptions="CenterAndExpand"  />
    </Grid>
</ContentPage.Content>

Solution 3:[3]

Why dont you use BindableLayout feature? Since Xamarin Forms 3.5 you can Bind a list in a Stack Layout for example, you have much more control than using ListView like this:

<StackLayout BindableLayout.ItemsSource="{Binding MyListOfObjects}">
    <BindableLayout.ItemTemplate>
        <DataTemplate>
            <Label  Text="{Binding Description}"></Label>
            <Label Text="{Binding Status}" ></Label>
        </DataTemplate>
    </BindableLayout.ItemTemplate>
</StackLayout>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Steve Chadbourne
Solution 2 User1
Solution 3 Diogo