Xamarin表单:以编程方式添加了AbsoluteLayout,无法在iOS上呈现

时间:2018-10-04 00:38:26

标签: xamarin xamarin.forms xamarin.ios

我试图以编程方式向我的Xamarin ContentPages添加一个ActivityIndi​​cator来进行数据访问。我的Android设备(三星Galaxy Tab A)下面的所有代码都能正常工作。当我在iOS(iPhone 7)上进行测试时,它不会呈现AbsoluteLayout中包装的任何页面。我简化了该项目的仓库,以演示该问题。

完整的项目在这里: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和Label的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上找到任何设置来解决它。

谢谢。

1 个答案:

答案 0 :(得分:0)

经过一整天的尝试,我发现在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);