Top Padding in Carousel View on iOS

I have a CarouselView inside of an AbsoluteLayout. It is the only element within the AbsoluteLayout. This AbsoluteLayout is the only element of a ContentPage which has NavigationPage.HasNavigationBar="false"

When the CarouselView displays in portrait orientation on the device, it is moved slightly down, seems around 10 units to me. It's definitely the CarouselView as setting the background for the Absolute layout makes this background stick out in the gap. This does not occur in landscape orientation. Does anyone know how to fix this? I've tried everything.

Here is my XAML:
<?xml version="1.0" encoding="utf-8" ?>

<ContentPage.Content>

        <cv:CarouselView x:Name="IntroCarousel"
                     ItemsSource="{Binding Path=BindingContext.Intros, Source={x:Reference IntroPage}}"
                     PositionSelected="pageChanged"                                    
                     AbsoluteLayout.LayoutBounds="0, 0, 1, 1"
                     AbsoluteLayout.LayoutFlags="All">

            <cv:CarouselView.ItemTemplate>
                <DataTemplate>
                    <StackLayout BackgroundColor="{Binding backgroundColor}"
                                HorizontalOptions="FillAndExpand"
                                VerticalOptions="FillAndExpand"
                              Orientation="Vertical"
                             Margin="0"
                             >

                        <Image Source="{Binding ImageUri}"
                           WidthRequest="250"
                             HeightRequest="150" 
                             HorizontalOptions="Center"
                             VerticalOptions="Center">
                            <Image.Margin>
                                <OnPlatform x:TypeArguments="Thickness"
                                 Android="10, 10, 10, 10"
                                 iOS="10, 30, 10, 10"
                                 WinPhone="10, 10, 10, 10" />
                            </Image.Margin>
                        </Image>

                        <Label Text="{Binding Heading}"
                           FontSize="Large" 
                           FontAttributes="Bold"
                           TextColor="White"
                           HorizontalOptions="Center"
                           VerticalOptions="Center"/>

                        <Label Text="{Binding Description}"
                           TextColor="White"
                           HorizontalOptions="Center"
                           VerticalOptions="Center"
                           Margin="10, 10, 10, 10"/>
                    </StackLayout>
                </DataTemplate>

            </cv:CarouselView.ItemTemplate>
        </cv:CarouselView>
    </AbsoluteLayout>


</ContentPage.Content>

Tagged:

Best Answer

  • EmZedEmZed ZA
    Accepted Answer

    I stopped using the CarouselView control provided by Xamarin and used the one by Alex Rainman instead. Google it, apparently I'm not here long enough to post links.

Answers

  • XasanrahXasanrah CZMember ✭✭

    Having same issue. Did you find any solution?

  • EmZedEmZed ZAMember
    Accepted Answer

    I stopped using the CarouselView control provided by Xamarin and used the one by Alex Rainman instead. Google it, apparently I'm not here long enough to post links.

Sign In or Register to comment.