ListView not displayed fully in Xamarin forms

370 Views Asked by At

I have a ListView with around 10 items. ListView needs to be displayed fully on the screen. But it is not showing. Tried to use a ScrollView, But all the items are not displayed, and not able to scroll to the last item in the view.

Attached my source code for reference. XAML Source Code

<?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="KFM.View.TripPage" Title="Trips" > 
    <ContentPage.Content>
        <StackLayout Orientation="Vertical" Spacing="30" VerticalOptions="FillAndExpand">
            <ScrollView VerticalOptions="FillAndExpand">
            <ListView x:Name="MenuListView" ItemsSource="{Binding Trips}"  HorizontalOptions="FillAndExpand" HasUnevenRows="True" SeparatorVisibility="None" IsEnabled="False" VerticalOptions="FillAndExpand">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <StackLayout Padding="5">
                                <Frame HasShadow="true" HeightRequest="100" BorderColor="Black">
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="10"/>
                                            <ColumnDefinition Width="*"/>
                                        </Grid.ColumnDefinitions>
                                        <StackLayout Grid.Column="0" Orientation="Vertical" VerticalOptions="FillAndExpand">
                                            <BoxView Color="Blue" VerticalOptions="FillAndExpand"/>
                                        </StackLayout>
                                        <StackLayout Grid.Column="1" Orientation="Vertical" VerticalOptions="FillAndExpand">
                                            <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
                                                <Label Text="{Binding DateFrom,StringFormat='{}{0:MMM - dd HH:mm}'}" TextColor="Black" FontSize="20"/>
                                                <Label Text=" to " TextColor="Black" FontSize="20"/>
                                                <Label Text="{Binding DateTo,StringFormat='{}{0:MMM - dd HH:mm}'}" TextColor="Black" FontSize="20"/>
                                            </StackLayout>
                                            <Label Text="Details" TextColor="Black" FontSize="16" TextDecorations="Underline"/>
                                            <Label Text="{Binding Place}" TextColor="Black" FontSize="20"/>
                                        </StackLayout>
                                    </Grid>
                                </Frame>
                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
            </ScrollView>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Backend C# code

Trips = new List<Trip>()
            {
                new Trip() { DateFrom = DateTime.Now, DateTo = DateTime.Now.AddDays(2), Place="Chennai to trichy" },
                new Trip() { DateFrom = DateTime.Now.AddDays(7), DateTo = DateTime.Now.AddDays(9), Place="Chennai to bangalore" },
                new Trip() { DateFrom = DateTime.Now.AddDays(12), DateTo = DateTime.Now.AddDays(14), Place="Local" },
                new Trip() { DateFrom = DateTime.Now.AddDays(16), DateTo = DateTime.Now.AddDays(18), Place="Chennai to Salem" },
                new Trip() { DateFrom = DateTime.Now.AddDays(18), DateTo = DateTime.Now.AddDays(22), Place="Chennai to Tirunelveli" },
                new Trip() { DateFrom = DateTime.Now.AddDays(24), DateTo = DateTime.Now.AddDays(30), Place="Chennai to Mysore" },
                new Trip() { DateFrom = DateTime.Now.AddDays(32), DateTo = DateTime.Now.AddDays(34), Place="Chennai to Tirunelveli" },
                new Trip() { DateFrom = DateTime.Now.AddDays(36), DateTo = DateTime.Now.AddDays(40), Place="Chennai to Mysore" },
            };
1

There are 1 best solutions below

2
Lucas Zhang On

That's because you put the ListView in a ScrollView . In this case the ScrollView could not get the current height of ListView in runtime . Since you had used ListView , why did you still put it in a ScrollView ?

I used the following code and it works fine

<StackLayout Orientation="Vertical"  VerticalOptions="FillAndExpand">
       
    <ListView x:Name="MenuListView"   HorizontalOptions="FillAndExpand" HasUnevenRows="True" SeparatorVisibility="None"  VerticalOptions="FillAndExpand">
               //...
    </ListView>
      
</StackLayout>