为什么在这种情况下嵌套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>

我得到了什么： Image

我期望的是： Image

问题说明了一切。 我想念什么？

Xamarin表格3.2

Answer 1

如果您依赖默认值，则外部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>

Answer 2

我遇到了与您相同的问题。如果您想自动设置FlexLayout的高度，请将第一个FlexLayout更改为StackLayout，这样您的代码将如下所示：

<StackLayout Orientation="Vertical" Spacing="0">
    <FlexLayout Direction="Row" JustifyContent="Start" AlignItems="Stretch">
        <BoxView Color="Red"/>
        <BoxView Color="Black"/>
    </FlexLayout>
    <BoxView Color="Yellow"/>
</StackLayout>

除非您指定内部FlexLayout的高度，否则我不知道为什么当FlexLayout位于另一个|Employee Id | Name | FirstReviewDate | SecondReviewDate|ThirdReviewDate| +------------+----------+-----------------+-----------------+---------------+ | 32018685A |Alan Smith| 6/8/2000 | 9/15/2000 | 9/27/2000 | 内时，它为什么不起作用。可能是一个错误。

Answer 3

如果您将子级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>