How to Xamarin.forms Scroll work with AbsoluteLayout

Question

I have this .XAML page and Scroll doesn't work Its working fine when I have remove AbsoluteLayout and take stacklayout.

<ScrollView>
    <AbsoluteLayout>
        <ListView x:Name="lstView" ItemsSource="{Binding Items}" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1"
       ItemSelected="lstView_ItemSelected">

            <ListView.Header>
                <Label Text="Store Allocation" BackgroundColor="White" TextColor="Black" FontAttributes="Bold" HorizontalOptions="Fill" HorizontalTextAlignment="Center"  />

            </ListView.Header>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding Title}"  Height="200" Detail="{Binding Detail}" DetailColor="Black" TextColor="Red"  />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <BoxView AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1" BackgroundColor="LightGray" Opacity="0.7" InputTransparent="False" IsVisible="{Binding Path=IsBusy, Source={x:Reference Page}}" />
        <ActivityIndicator IsRunning="{Binding Path=IsBusy, Source={x:Reference Page}}" AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds=".5,.5,-1,-1" />
    </AbsoluteLayout>
</ScrollView>

Answer 1

Your XAML basically "says" put a ScrollView on the page, with an AbsoluteLayout filling that ScrollView . Since the inner layout perfectly fits the ScrollView there is no need to scroll. Moreover the ListView and the BoxView are set to take the whole AbsoluteLayout ( AbsoluteLayout.LAyoutBounds="0,0,1,1" ), no more no less. Why should the ScrollView scroll?

Furthermore, if it worked that way, you'd scroll the ActivityIndicator with everything else, which is supposedly not what you want. I'd assume that you'd like to keep the ActivityIndicator in place, on top of the ListView .

What you could try (I'm not 100% sure, but it should work) is wrapping the ListView only with the ScrollView and put the ScrollView in the AbsoluteLayout this way, the ScrollView will recognize the ListView being too large for the screen and enable scrolling, while everything else stays in place:

<AbsoluteLayout>
    <ScrollView AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
        <ListView x:Name="lstView" ItemsSource="{Binding Items}"
            ItemSelected="lstView_ItemSelected">
            <ListView.Header>
                <Label Text="Store Allocation" BackgroundColor="White" TextColor="Black" FontAttributes="Bold" HorizontalOptions="Fill" HorizontalTextAlignment="Center"  />
            </ListView.Header>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding Title}"  Height="200" Detail="{Binding Detail}" DetailColor="Black" TextColor="Red"  />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </ScrollView>
    <BoxView AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1" BackgroundColor="LightGray" Opacity="0.7" InputTransparent="False" IsVisible="{Binding Path=IsBusy, Source={x:Reference Page}}" />
    <ActivityIndicator IsRunning="{Binding Path=IsBusy, Source={x:Reference Page}}" AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds=".5,.5,-1,-1" />
</AbsoluteLayout>

Answer 2

You can also manually set the height of your AbsoluteLayout.

<ScrollView>
<AbsoluteLayout HeightRequest="800">
      <!--Page Contents-->
</AbsoluteLayout>
</ScrollView>