Xamarin.Forms - ListView change height at runtime
<p>I'm developing a cross-platform app using Xamarin.Forms. In one of the pages I've an avatar image, some info, and then a <code>ListView</code>. The thing is that I've all this wrapped in a <code>ScrollView</code>, so I'm able to scroll all over the content. The issue with this is that I'm losing the <code>ListView</code> scroll behaviour. This're some screenshots:</p>

<p><a href="https://i.stack.imgur.com/2Tigb.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2Tigb.png" alt="enter image description here"></a></p>

<p><a href="https://i.stack.imgur.com/2RMDg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2RMDg.png" alt="enter image description here"></a></p>

<p>As you can see the XAML view is basically, the avatar <code>Image</code> (the firetruck image), then the "Last check step" info, and then we've the <code>ListView</code>. I hardcoded a <code>HeightRequest</code> in the <code>ListView</code> so It has a bigger height. But the thing is that when I scroll to the bottom of the page I can't keep scrolling through the <code>ListView</code> because the <code>ScrollView</code> messes with that behaviour. I <strong>need</strong> to use a <code>ListView</code> because the list of check reports that I'm showing there is populated from a webservice, and I update that list when I enter and exit the page. This is the XAML code:</p>

<pre><code>&lt;?xml version="1.0" encoding="utf-8" ?&gt;
&lt;ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:checkReport="clr-namespace:HalliganTL.View;assembly=HalliganTL"
              xmlns:controls="clr-namespace:ImageCircle.Forms.Plugin.Abstractions;assembly=ImageCircle.Forms.Plugin.Abstractions"
             x:Class="HalliganTL.View.ApparatusDetailPage" BackgroundColor="#FFFFFFFF"&gt;
  &lt;StackLayout Orientation="Vertical" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"&gt;
    &lt;ScrollView x:Name="GeneralScrollView"  
                Orientation="Vertical" VerticalOptions="FillAndExpand"
                HorizontalOptions="FillAndExpand"&gt;
      &lt;Grid HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"&gt;
        &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition Height="180"&gt;&lt;/RowDefinition&gt;
          &lt;RowDefinition Height="40"&gt;&lt;/RowDefinition&gt;
          &lt;RowDefinition Height="80"&gt;&lt;/RowDefinition&gt;
          &lt;RowDefinition Height="40"&gt;&lt;/RowDefinition&gt;
          &lt;RowDefinition Height="360"&gt;&lt;/RowDefinition&gt;
        &lt;/Grid.RowDefinitions&gt;
        &lt;Grid.ColumnDefinitions&gt;
          &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt;
        &lt;/Grid.ColumnDefinitions&gt;

        &lt;!-- Top Image --&gt;
        &lt;ContentView Grid.Column="0" Grid.Row="0" Padding="15"&gt;
          &lt;controls:CircleImage x:Name="ApparatusImage"
            HeightRequest="150" WidthRequest="150"
            VerticalOptions="Center"
            BorderColor="#3B5685"
            BorderThickness="2"
            HorizontalOptions="Center"
            Aspect="AspectFill"&gt;
          &lt;/controls:CircleImage&gt;
        &lt;/ContentView&gt;

        &lt;!-- Last Check Separator --&gt;
        &lt;AbsoluteLayout Grid.Column="0" Grid.Row="1" x:Name="LastCheckContainerTitle" BackgroundColor="#FFE4E4E9" Padding="5,15,15,5" VerticalOptions="End" &gt;
          &lt;Label Text="LAST CHECK" Style="{StaticResource separatorLabel}" /&gt;
        &lt;/AbsoluteLayout&gt;
        &lt;!-- Last Check Detail --&gt;
        &lt;checkReport:CheckReportViewPage Grid.Column="0" Grid.Row="2" x:Name="LastCheckReportView"&gt;
          &lt;checkReport:CheckReportViewPage.GestureRecognizers&gt;
            &lt;TapGestureRecognizer Tapped="OnLastCheckReportClicked" NumberOfTapsRequired="1" /&gt;
          &lt;/checkReport:CheckReportViewPage.GestureRecognizers&gt;
        &lt;/checkReport:CheckReportViewPage&gt;

        &lt;AbsoluteLayout  Grid.Column="0" Grid.Row="3"  x:Name="CheckHistoryTitle" BackgroundColor="#FFE4E4E9" Padding="5,15,15,5" &gt;
          &lt;Label Text="CHECK HISTORY" Style="{StaticResource separatorLabel}" FontAttributes="None" VerticalOptions="End" /&gt;
        &lt;/AbsoluteLayout&gt;

        &lt;!-- Apparatus check history --&gt;
        &lt;ListView x:Name="CheckHistoryListView"
                  HeightRequest="380"
                   Grid.Column="0" Grid.Row="4"
                  HorizontalOptions="FillAndExpand"
                  HasUnevenRows="True"
                  IsPullToRefreshEnabled="False"
                  VerticalOptions="FillAndExpand" ItemTapped="OnItemTapped"&gt;
          &lt;ListView.ItemTemplate&gt;
            &lt;DataTemplate&gt;
              &lt;ViewCell&gt;
                &lt;checkReport:CheckReportViewPage/&gt;
              &lt;/ViewCell&gt;
            &lt;/DataTemplate&gt;
          &lt;/ListView.ItemTemplate&gt;
        &lt;/ListView&gt;
      &lt;/Grid&gt;
    &lt;/ScrollView&gt;

    &lt;Label Text="Start Check" HeightRequest="60"  VerticalOptions="End" BackgroundColor="#3B5685" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" FontSize="18" TextColor="White"&gt;
      &lt;Label.GestureRecognizers&gt;
        &lt;TapGestureRecognizer
                Tapped="OnStartCheckClicked"
                NumberOfTapsRequired="1" /&gt;
      &lt;/Label.GestureRecognizers&gt;
    &lt;/Label&gt;

  &lt;/StackLayout&gt;



&lt;/ContentPage&gt;
</code></pre>

<p>So basically what I'm asking is how can achieve something like a parallax effect, scrolling down and then delegate the scroll behaviour to the <code>ListView</code> that way I can scroll through every item in the <code>ListView</code>. Currently I'm just able to see the items that fit in the <code>ListView</code> HeightRequest dimension. In the example screenshot that I'm shoing for example, there are several other items in that <code>ListView</code> but I can't scroll through them because the <code>ScrollView</code> is messing with the <code>ListView</code> scroll behaviour.</p>