Xamarin - lower half of view cut off

Question

Some times when loading a View, it does not fully load on Iphone.. see the screenshot.. (Images are blurred on purpose..) At least, it does not load with proper dimensions. it is usually fixed by rotating the phone to landscape and back.. is there a way to avoid this?

here is my view:

     <?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:vm="clr-namespace:GalShare.ViewModel"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
             xmlns:forms="clr-namespace:RedCorners.Forms;assembly=RedCorners.Forms"
             mc:Ignorable="d"
             x:Class="GalShare.Views.Gallery">

    <NavigationPage.TitleView>
        <Grid Padding="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="180"/>
                <ColumnDefinition Width="10"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="45"/>
            </Grid.RowDefinitions>
            <Button Grid.Row="0" Grid.Column="0" Text="Back" x:Name="Backbutton" Clicked="Backbutton_Clicked"></Button>
            <Button Grid.Row="0" Grid.Column="2" Text="Ph. contact info" x:Name="PhInfo" Clicked="PhInfo_Clicked"></Button>
        </Grid>
    </NavigationPage.TitleView>

    <ContentPage.Content>
    <AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <StackLayout
                 AbsoluteLayout.LayoutFlags="All"
                 AbsoluteLayout.LayoutBounds="0,0,1,1">
                <ContentView x:Name="Messagecontainer" Padding="5">
                    <forms:Frame2 CornerRadius="8"  
                               HasShadow="True"
                               ShadowRadius="8"    
                               ShadowColor="Black"
                               Padding="5"                               
                               BackgroundColor="LightGray">

                        <Label x:Name="Messagefield"></Label>
                    </forms:Frame2>
                </ContentView>
                <CollectionView ItemsSource="{Binding Galleries}" Margin="0" x:Name="MyCollection" SelectionMode="Single" SelectionChanged="CollectionView_SelectionChanged">
                    <CollectionView.ItemsLayout>
                        <GridItemsLayout Orientation="Vertical"                                 
                                Span="2" />

                    </CollectionView.ItemsLayout>
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                            <ContentView Padding="8">
                                <forms:Frame2 CornerRadius="15"  
                                       HasShadow="True"
                                       ShadowRadius="5"   
                                       HeightRequest="190"
                                       BackgroundColor="LightGray"
                                       Padding="1">
                                    <StackLayout HorizontalOptions="Start" VerticalOptions="Start" Padding="2">
                                        <Grid>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="140"/>
                                                <RowDefinition Height="*"/>
                                            </Grid.RowDefinitions>
                                            <ffimageloading:CachedImage Grid.Row="0" Grid.Column="0" x:Name="myImage" Source="{Binding ThumbUrl}" Aspect="AspectFit" CacheDuration="1" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" DownsampleToViewSize="False"></ffimageloading:CachedImage>
                                            <StackLayout Padding="0"  Margin="0"  Spacing="0" Grid.Column="0" Grid.Row="1">
                                                <StackLayout Spacing="0" Margin="0" Padding="5,0,5,0">
                                                    <ImageButton HorizontalOptions="Center" Padding="0" WidthRequest="28" Aspect="AspectFit" HeightRequest="28" Margin="0" Source="{Binding likeImg}" x:Name="Favoriteimage" Clicked="LikeButton_Clicked" ></ImageButton>
                                                 <!--   <Button CharacterSpacing="0"  HorizontalOptions="Center" Padding="0" WidthRequest="50" HeightRequest="28" Margin="0" Text="Like" x:Name="Favoriteimage" Clicked="Button_Clicked" ></Button>-->
                                                </StackLayout>
                                                    <Label x:Name="Picname" Text="{Binding ImageName}" IsVisible="{Binding showname}" FontSize="Micro" VerticalOptions="End" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" ></Label>
                                            </StackLayout>
                                        </Grid>
                                    </StackLayout>
                                </forms:Frame2>
                            </ContentView>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
            </StackLayout>
            <StackLayout IsVisible="{Binding isBusy}" x:Name="LoadingLayout" Padding="12"
                 AbsoluteLayout.LayoutFlags="PositionProportional"
                 AbsoluteLayout.LayoutBounds="0.5,0.5,-1,-1">
                <ActivityIndicator IsVisible="{Binding IsBusy}" 
                               IsRunning="{Binding IsBusy}" />
                <Label Text="Loading gallery..." IsVisible="{Binding IsBusy}" HorizontalOptions="Center" TextColor="Black"/>
            </StackLayout>
        </AbsoluteLayout>

    </ContentPage.Content>
</ContentPage>

Answer 1

Because you used AbsoluteLayout as root layout of the ContentPage . If you want to put the ActivityIndicator on the CollectionView , you could use Grid and put them in the same cell .

<Grid VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>

        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>


        <StackLayout  Grid.Row="0" Grid.Column="0" BackgroundColor="Red"  x:Name="LoadingLayout" Padding="12">

           //...
        </StackLayout>

        <StackLayout Grid.Row="0" Grid.Column="0" IsVisible="{Binding isBusy}" x:Name="LoadingLayout" Padding="12" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand">
                <ActivityIndicator IsVisible="{Binding IsBusy}" 
                               IsRunning="{Binding IsBusy}" />
                <Label Text="Loading gallery..." IsVisible="{Binding IsBusy}" HorizontalOptions="Center" TextColor="Black"/>
        </StackLayout>

</Grid>

If the problem still exists, you could share your sample so that I can test it on my side .