Не могу сделать представление выше другого в StackLayout-XamarinForms

Question

У меня возникла проблема на моей странице XAML, я хочу показать изображение над пользовательским представлением, и независимо от того, что я пробую, оно всегда отображается сзади. Я уже показывал вид выше этого определенного c пользовательского представления, но в этом разделе я не могу заставить его работать, и я не вижу разницы между этой частью и той, которая действительно работает.

Мой код:

<ContentPage Title="title">
            <renderers:GradientLayout
                x:Name="page"
                ColorsList="#D81BDE,#4847FF" 
                Mode="ToBottomLeft">

                <Button 
                    BackgroundColor="Yellow"
                    HeightRequest="45"
                    WidthRequest="45"

                    Margin="0,25,25,0"
                    VerticalOptions="Start"
                    HorizontalOptions="End"

                    Command="{Binding button}">

                </Button>

                <CarouselView
                    x:Name="carousel" 

                    VerticalOptions="StartAndExpand"
                    HorizontalOptions="StartAndExpand"

                    BackgroundColor="Transparent">
                    <CarouselView.ItemTemplate>
                        <DataTemplate>
                            <StackLayout>

**This is the custom view I am trying to show below**
                                <custom:PancakeView 
                                    CornerRadius="25"
                                    HasShadow="True"
                                    BackgroundColor="Pink"

                                    Margin="35,0,65,15"
                                    HeightRequest="600"
                                    WidthRequest="300"
                                    VerticalOptions="End"
                                    HorizontalOptions="StartAndExpand"
                                    Padding="15">
                                    <StackLayout>
                                        <Label
                                            Text="124$"
                                            FontSize="20"
                                            FontAttributes="Bold"
                                            TextColor="White"

                                            VerticalOptions="Start"
                                            HorizontalOptions="End"></Label>
                                        <Label 
                                            Text="{Binding Title}"
                                            TextColor="White"
                                            FontSize="40"
                                            FontAttributes="Bold"

                                            HorizontalTextAlignment="Center"
                                            VerticalOptions="Start"
                                            HorizontalOptions="CenterAndExpand"></Label>
                                        <Label 
                                            Text="Este es un ejemplo de una descripcion, hace falta, por supuesto, hacer un binding con la descripcion real"
                                            TextColor="White"
                                            FontSize="20"
                                            HorizontalTextAlignment="Start"

                                            VerticalOptions="EndAndExpand"
                                            HorizontalOptions="Center"
                                            Margin="0,0,0,25"></Label>

**This is the custom view that is actually showing below**
                                        <custom:PancakeView
                                            BackgroundGradientStartColor="White"
                                            BackgroundGradientEndColor="Black"
                                            CornerRadius="25"
                                            Opacity="0.25"

                                            HeightRequest="60"
                                            WidthRequest="800"
                                            VerticalOptions="End"
                                            HorizontalOptions="CenterAndExpand"
                                            Padding="3"
                                            Margin="0,0,0,35">
                                            <Frame
                                                BackgroundColor="Pink"
                                                CornerRadius="25"

                                                VerticalOptions="FillAndExpand"
                                                HorizontalOptions="FillAndExpand"
                                                Padding="0"></Frame>
                                        </custom:PancakeView>


**This is the view that it is actually showing above**
                                        <Label
                                            Text="Buy now"
                                            TextColor="White"
                                            FontSize="30"
                                            FontAttributes="Bold"
                                            HorizontalTextAlignment="Start"

                                            Margin="10,-96,10,15"
                                            VerticalOptions="End"
                                            HorizontalOptions="Center"></Label>
                                    </StackLayout>
                                </custom:PancakeView>

**This is the image I am trying to show on top of the first custom view**
                                <Image
                                    Source="Burguer.png"
                                    BackgroundColor="Transparent"

                                    VerticalOptions="End"
                                    HorizontalOptions="Center"
                                    Margin="0,-500,0,0"></Image>
                            </StackLayout>
                        </DataTemplate>
                    </CarouselView.ItemTemplate>
                </CarouselView>

            </renderers:GradientLayout>
        </ContentPage>

И это все, если вам нужна дополнительная информация, я предоставлю ее, как только увижу ваш запрос, спасибо за ваше время, хорошего дня.

РЕДАКТИРОВАТЬ: Вот две картинки, первая - то, что я пытаюсь достичь, вторая - то, что происходит с этим кодом:

Answer 1

Существует простой способ перекрытия макетов с помощью Grid , и это выглядит так:

<Grid>
    <Grid x:Name="ContentBehind">
        //This Content will stay below
    </Grid>
    <Grid x:Name="ContentAbove">
        //This Content will stay on front
    </Grid>
</Grid>

Так что если вы хотите, чтобы StackLayout был выше другого StackLayout, Вы должны попробовать это:

<Grid>
    <StackLayout BackgroundColor="Green"><Label Text="I'm in the Background" /></StackLayout>
    <StackLayout BackgroundColor="Transparent"><Label Text="I'm Overlaping the other StackLayout" /></StackLayout>
</Grid>

Или вот так (это то же самое, но вы определяете, как вы хотите, чтобы высота ваших строк действовала):

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

    <StackLayout Grid.Row="0" BackgroundColor="Green"><Label Text="I'm in the Background" /></StackLayout>
    <StackLayout Grid.Row="0" BackgroundColor="Transparent"><Label Text="I'm Overlaping the other StackLayout" /></StackLayout>
</Grid>