Xamarin Forms：以编程方式添加的 AbsoluteLayout 不在 iOS 上呈现

Question

我正在尝试以编程方式将 ActivityIndi​​cator 添加到执行数据访问的 Xamarin ContentPages。我的所有代码都在我的 Android 设备（三星 Galaxy Tab A）上运行良好。当我在我的 iOS (iPhone 7) 上对其进行测试时，它不会呈现任何包含在 AbsoluteLayout 中的页面。我将 repo 简化为演示该问题的项目。

完整的项目在这里：https://github.com/wadebaird/absoluteLayoutIssue

这是基础知识，我有下面的 ContentPage，我在 OnAppearing 期间以编程方式将按钮添加到“MainPageStackLayout”。

<?xml version="1.0" encoding="utf-8" ?>
<absolutelayoutissue:CommonContentPage
             xmlns:absolutelayoutissue="clr-namespace:AbsoluteLayoutIssue"
             xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="AbsoluteLayoutIssue.AbsoluteLayoutProgrammatic">
    <absolutelayoutissue:CommonContentPage.Content>
        <ScrollView>
            <StackLayout x:Name="MainPageStackLayout" VerticalOptions="Start" Margin="20, 20" Spacing="25">
                <Label FontSize="Large" FontAttributes="Bold" Margin="20" TextColor="Red" HorizontalTextAlignment="Center" 
                   Text="No network connection detected, please enable a connection to use this application." 
                   IsVisible="False" />
            </StackLayout>
        </ScrollView>
    </absolutelayoutissue:CommonContentPage.Content>
</absolutelayoutissue:CommonContentPage>

在构造函数期间，我调用此方法以编程方式添加包装 ActivityIndi​​cator 和标签的 AbsoluteLayout：

public void AddActivityIndicator()
{
    var content = this.Content;
    var overlay = new AbsoluteLayout
    {
        HorizontalOptions = LayoutOptions.FillAndExpand,
        VerticalOptions = LayoutOptions.FillAndExpand,
    };

    var activityIndicator = new ActivityIndicator
    {
        IsEnabled = true,
        HorizontalOptions = LayoutOptions.FillAndExpand,
        //Use the same color as the school text color as it should contrast the background the same.
        Color = Color.Black,
    };

    var activityMessage = new Label
    {
        IsEnabled = true,
        HorizontalOptions = LayoutOptions.FillAndExpand,
        TextColor = Color.Black,
        Text = "Loading...",
    };

    var stackLayout = new StackLayout();
    stackLayout.Children.Add(activityIndicator);
    stackLayout.Children.Add(activityMessage);

    activityIndicator.SetBinding(ActivityIndicator.IsVisibleProperty, nameof(ViewModel.IsBusy));
    activityIndicator.SetBinding(ActivityIndicator.IsRunningProperty, nameof(ViewModel.IsBusy));
    activityMessage.SetBinding(Label.IsVisibleProperty, nameof(ViewModel.IsBusy));

    AbsoluteLayout.SetLayoutFlags(content, AbsoluteLayoutFlags.All);
    AbsoluteLayout.SetLayoutBounds(content, new Rectangle(0f, 0f, 1, 1));
    AbsoluteLayout.SetLayoutFlags(stackLayout, AbsoluteLayoutFlags.PositionProportional);
    AbsoluteLayout.SetLayoutBounds(stackLayout, new Rectangle(0.5, 0.5, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));

    overlay.Children.Add(content);
    overlay.Children.Add(stackLayout);

    this.Content = overlay;
}

完成后，页面加载为完全空白。当我对页面进行建模与以编程方式添加 AbsoluteLayout 时，一切都很完美：

<?xml version="1.0" encoding="utf-8" ?>
<absolutelayoutissue:CommonContentPage
             xmlns:absolutelayoutissue="clr-namespace:AbsoluteLayoutIssue"
             xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="AbsoluteLayoutIssue.AbsoluteLayoutModeled">
    <absolutelayoutissue:CommonContentPage.Content>
        <AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <ScrollView AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
                <StackLayout x:Name="MainPageStackLayout" VerticalOptions="Start" Margin="20, 20" Spacing="25">
                    <Label FontSize="Large" FontAttributes="Bold" Margin="20" TextColor="Red" HorizontalTextAlignment="Center" 
                   Text="No network connection detected, please enable a connection to use this application." 
                   IsVisible="False" />
                </StackLayout>
            </ScrollView>
            <StackLayout AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="0.5,0.5,-1,-1">
                <ActivityIndicator IsEnabled="True" HorizontalOptions="FillAndExpand" Color="Black" IsVisible="{Binding IsBusy}" IsRunning="{Binding IsBusy}" />
                <Label IsEnabled="True" HorizontalOptions="FillAndExpand" TextColor="Black" Text="Loading..." IsVisible="{Binding IsBusy}"/>
            </StackLayout>
        </AbsoluteLayout>
    </absolutelayoutissue:CommonContentPage.Content>
</absolutelayoutissue:CommonContentPage>

但是我不想对其建模，因为我希望能够在我的应用程序的任何页面上动态添加此代码。

所以问题是任何人都可以看到我的建模页面和我以编程方式构建的页面之间的区别吗？如果没有，有没有人见过这个问题？我似乎在 AbsoluteLayout 上找不到任何设置来解决它。

提前谢谢你。

Answer 1

在继续尝试解决这一问题一天后，我发现切换在 Page.Content 上设置 AbsoluteLayout 的顺序，然后添加它的子项修复了呈现/布局问题：

overlay.Children.Add(content);
overlay.Children.Add(stackLayout);

this.Content = overlay;

需要是这样的：

this.Content = overlay;

overlay.Children.Add(content);
overlay.Children.Add(stackLayout);