Xamarin.Forms-如何以编程方式将ActivityIndi​​cator叠加在StackLayout的中间 [英] Xamarin.Forms - How to overlay an ActivityIndicator in the middle of a StackLayout programmatically

问题描述

我想在表单中间覆盖我的ActivityIndi​​cator，但是我不确定我该如何处理，我想我需要将堆栈布局包装在相对布局中吗?

I want to overlay my ActivityIndicator in the middle of my form but I'm not entirely sure how I can go about this, I assume I need to wrap my stack layout in a relative layout ?

我正在用代码执行此操作，而我发现的最接近的示例是使用XAML，该XAML使用如下所示的网格:

I'm doing this in code and the closest example I have found is using XAML which uses a grid as seen below:

 <ScrollView BackgroundColor="#d3d6db">
    <RelativeLayout
        VerticalOptions="FillAndExpand"
        HorizontalOptions="FillAndExpand">
        <StackLayout Orientation="Vertical"
                     VerticalOptions="FillAndExpand"
                     Padding="10"
                     RelativeLayout.XConstraint="{ConstraintExpression Type=Constant, Constant=0}"
                     RelativeLayout.YConstraint="{ConstraintExpression Type=Constant, Constant=0}">

            <Grid x:Name="SegmentGrid"
                  RowSpacing="10"
                  ColumnSpacing="10">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
            </Grid>
            <WebView BackgroundColor="White" VerticalOptions="FillAndExpand" Source="{Binding DescriptionHtml}" />
        </StackLayout>

        <ActivityIndicator IsVisible="{Binding IsBusy}"
                           IsRunning="{Binding IsBusy}"
                           Color="Black"
                           VerticalOptions="CenterAndExpand"
                           HorizontalOptions="CenterAndExpand"
                           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,
                                    Factor=0.33}"
                           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,
                                    Factor=0.33}" />
    </RelativeLayout>
</ScrollView>

推荐答案

如果您在RelativeLayout上遇到问题，还可以使用在类似上下文中工作的AbsoluteLayout.下面的示例代码:

If you have problems with RelativeLayout, you can also use AbsoluteLayout which works in a similar context. Sample code below:

var overlay = new AbsoluteLayout();
var content = new StackLayout();
var loadingIndicator = new ActivityIndicator();
AbsoluteLayout.SetLayoutFlags(content, AbsoluteLayoutFlags.PositionProportional);
AbsoluteLayout.SetLayoutBounds(content, new Rectangle(0f, 0f, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
AbsoluteLayout.SetLayoutFlags(loadingIndicator, AbsoluteLayoutFlags.PositionProportional);
AbsoluteLayout.SetLayoutBounds(loadingIndicator, new Rectangle(0.5, 0.5, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
overlay.Children.Add(content);
overlay.Children.Add(loadingIndicator);

如果您想要一个完整的工作示例，我已经提供了一个@ @ https://github.com/teamtam/xamarin-forms-timesheet

If you would like a full working example, I have made one available @ https://github.com/teamtam/xamarin-forms-timesheet

这篇关于Xamarin.Forms-如何以编程方式将ActivityIndi​​cator叠加在StackLayout的中间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！