为什么Xamarin Absolute Layout堆叠不尊重儿童订单

问题描述 投票:0回答:1

我正在尝试实现一种布局,其中内容在背景上有图像(位于左下角,垂直扩展100%,水平扩展60%)

整个内容包装在AbsoluteLayout中,然后主要内容是这个布局的子节点,由StackLayout(以及其他一些内容)组成。

Visual Studio中的预览器(Visual Studio Community 2017)正确显示了布局 - 图像位于内容之下,内容按预期放置在中间。但是,VS Emulator和Genymotion都会在内容上方显示图像。

我将代码修剪为尽可能可读(剥离样式)

...

        <Frame VerticalOptions="End" AbsoluteLayout.LayoutFlags="All" Margin="0" Padding="0" IsClippedToBounds="True" AbsoluteLayout.LayoutBounds="0,1,0.6,1">
            <Image Source="Graphic_Anna.png" />
        </Frame>

        <!-- Start: Actual Page Content -->
        <StackLayout VerticalOptions="Center" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" x:Name="ApplicationLayoutContentLevel">

            <Label Text="This is some text in main content" />

        </StackLayout>
        <!-- End: Actual Page Content -->

    </AbsoluteLayout>
</ContentPage.Content>

...

预期结果显示在此屏幕截图中(来自预览器):https://i.imgur.com/C8GBMSi.png

但是,两个模拟器的结果似乎都是这样做的:https://i.imgur.com/NvJFZan.png

不幸的是,我目前无法在实际的Android手机上测试该应用

xamarin xamarin.android absolutelayout
1个回答
0
投票

你想实现如下截图吗?我不知道你使用的是哪种尺寸,所以我从截图中剪下了图片。

enter image description here

如果是这样,有我的代码。如果你想实现覆盖效果,我使用两个stacklayout,第一个布局将被第二个布局覆盖。注意:如果你设置VerticalOptions将影响AbsoluteLayout.LayoutBounds

 <ContentPage.Content>
    <AbsoluteLayout>


        <StackLayout VerticalOptions="End" AbsoluteLayout.LayoutFlags="All" Margin="0" Padding="0" IsClippedToBounds="True" AbsoluteLayout.LayoutBounds="0,1,0.6,1">

            <Image Source="Graphic_Anna.png" />

        </StackLayout>
        <!-- Start: Actual Page Content -->
        <StackLayout AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0.8,0.7,0.5,0.5"  x:Name="ApplicationLayoutContentLevel">
            <Image Source="start.png"  Scale="0.7"/>
            <Label Text="10/10" TextColor="Black" FontSize="50" Margin="20,10,0,0"/>
            <Label Text="Great job! you got everything" TextColor="Black" Margin="0,10,0,0" />
            <Label Text="Back to games" TextColor="red"  Margin="25,20,0,0"  />
        </StackLayout>
    <!-- End: Actual Page Content -->

    </AbsoluteLayout>

</ContentPage.Content>
© www.soinside.com 2019 - 2024. All rights reserved.