CODEWITHSUNDEEP
xamlxamarinxamarin.forms
Peter Lo
Peter Lo

Reputation: 85

Xamarin Listview cannot scroll to bottm

I modify the sample https://learn.microsoft.com/zh-tw/samples/xamarin/xamarin-forms-samples/userinterface-xaminals/ ,

replace the collectionview with listview . after replacing I found the listview cannot scroll to bottom (there are total 17 items , but only show 6 items)

This error only happen on Android,but it works well on IOS.

How to solve this problem?

<?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:controls="clr-namespace:Xaminals.Controls"
             xmlns:data="clr-namespace:Xaminals.Data"
             x:Class="Xaminals.Views.MonkeysPage"
             Title="Monkeys">
     <RelativeLayout
                VerticalOptions="FillAndExpand"
                HorizontalOptions="FillAndExpand">

   
        <StackLayout Orientation="Vertical"
                               VerticalOptions="FillAndExpand"
                               Padding="10">


            <ListView     ItemsSource="{x:Static data:MonkeyData.Monkeys}"
                            x:Name="CollectionView1"  
                           
                            RowHeight="100">

                <ListView.ItemTemplate>
                    <DataTemplate>

                         <ViewCell>
                 
                            <Grid VerticalOptions="CenterAndExpand" Padding = "20, 0" >
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <Image
                                      Grid.RowSpan="2"
                                      Aspect="AspectFill"
                                      HeightRequest="60"
                                      Source="{Binding ImageUrl}"
                                      WidthRequest="60" />

                                <Label
                                      Grid.Row="0"
                                      Grid.Column="1"
                                      FontAttributes="Bold"
                                      Text="{Binding Name}" />

                                <Label
                                      Grid.Row="1"
                                      Grid.Column="1"
                                      FontAttributes="Italic"
                                      Text="{Binding Price}"
                                      VerticalOptions="End" />

                                <Image Grid.Row="2" Grid.Column="0"  Source="bear.png" HeightRequest="25" WidthRequest="25">
                                    <Image.GestureRecognizers>
                                        <TapGestureRecognizer
                                             
                                             NumberOfTapsRequired="1" />
                                    </Image.GestureRecognizers>
                                </Image>
                            </Grid>
                  
                           </ViewCell> 

                    </DataTemplate>

                </ListView.ItemTemplate>

            </ListView>


        </StackLayout>

          <ActivityIndicator x:Name="activityIndicator" Color="Red"  VerticalOptions="CenterAndExpand"  HorizontalOptions="CenterAndExpand"  RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.33}" RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height,Factor=0.33}"    />

    </RelativeLayout>

</ContentPage>

Upvotes: 0

Views: 236

Answers (1)

nevermore
nevermore

Reputation: 15786

The solution is change the RelativeLayout to Stacklayout:

<StackLayout
            VerticalOptions="FillAndExpand"
            HorizontalOptions="FillAndExpand">


    <StackLayout Orientation="Vertical"
                           VerticalOptions="FillAndExpand"
                           Padding="10">

        <ListView     ItemsSource="{x:Static data:MonkeyData.Monkeys}"
                        x:Name="CollectionView1"  
                        RowHeight="100">

            .....
        </ListView>

    </StackLayout>
</StackLayout>

If you want to use RelativeLayout, you need to use XConstraint, YConstraint,WidthConstraint,HeightConstraint to layout the child view instead of VerticalOptions="FillAndExpand", HorizontalOptions="FillAndExpand".

Upvotes: 1

Related Questions