为什么在这种情况下看不到嵌套的 FlexLayout？

Question

代码：

<?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:local="clr-namespace:FlexLayout2"
             x:Class="FlexLayout2.MainPage">

    <FlexLayout
        Direction="Column"
        JustifyContent="Start"
        AlignItems="Stretch">
        <FlexLayout
            Direction="Row"
            JustifyContent="Start"
            AlignItems="Stretch">
            <BoxView Color="Red"/>
            <BoxView Color="Black"/>
        </FlexLayout>

        <BoxView Color="Yellow"/>

    </FlexLayout>

</ContentPage>

我得到了什么： 图像

我所期望的： 图像

问题说明了一切。我缺少什么？

Xamarin 表单 3.2

Answer 1

如果您将子 Flex 布局放入其中，<ContentView>它将起作用：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:FlexLayout2"
             x:Class="FlexLayout2.MainPage">

    <FlexLayout
        Direction="Column"
        JustifyContent="Start"
        AlignItems="Stretch">
        <ContentView>
            <FlexLayout
                Direction="Row"
                JustifyContent="Start"
                AlignItems="Stretch">
                <BoxView Color="Red"/>
                <BoxView Color="Black"/>
            </FlexLayout>
        </ContentView>
        <BoxView Color="Yellow"/>
    </FlexLayout>
</ContentPage>

Answer 2

如果依赖默认值，似乎外部 FlexLayout 将内部 FlexLayout 的高度设置为零。尝试下面的代码

<?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:local="clr-namespace:FlexLayout2"
             x:Class="FlexLayout2.MainPage">    
    <FlexLayout
        Direction="Column"
        JustifyContent="Start"
        AlignItems="Stretch">
        <FlexLayout HeightRequest="40"
            Direction="Row"
            JustifyContent="Start"
            AlignItems="Stretch">
            <BoxView Color="Red"/>
            <BoxView Color="Black"/>
        </FlexLayout>    
        <BoxView Color="Yellow"/>   
    </FlexLayout>    
</ContentPage>