Question

我正在使用Xamarin.forms，我需要在弹出视图中有一个登录表单，如下图所示：

现在我正在使用PushModalAsync，但是这会使带有表单的新页面覆盖整个屏幕，而不是只显示我想要的弹出视图。

有没有办法用xamarin.forms做到这一点？如果没有，是否已经实现了任何跨平台（Android，iOS和UWP）替代方案？

Answer 1

我的经验是说XLabs的PopupLayout doesn't work properly sometimes。但是有一个非常好的库允许创建复杂的弹出窗口：Rg.Plugins.Popup。唯一的问题：缺少UWP实现（但它是going to be released）。

Answer 2

XLabs有一个PopupLayout，您可以使用它来执行此操作。

datepart

Answer 3

我用过的常用解决方案是用来解决这个问题，即创建一个包含所有表单的StackLayout，并将其插入当前正在使用的Page的子节点，例如：

PopupPage popUp; //This will be the layout of the form

Page : ContentPage {

    var gird = new Gird();

    popUp = PopupPage();
    popUp.IsVisible = false;

    var mainContainer = new StackLayout();

    mainContainer.Children.Add(All you UI stuff..);

    var btn = new Button();
    btn.Clicked += OnButtonClicked;

    grid.Children.Add(mainContainer,0,0);
    grid.Children.Add(popUp,0,0);

}

So in order to show the popoUP you need to play with the IsVisible property, for example:

void OnButtonClicked(){

    //You can center the popup using Vertical options or whatever you need
    //and to resize the pop up you can do different calculations like
    //popUp.Width = ScreenWidth / 2 and popUp.Height = ScreenWidth / 2
    popUp.IsVisile = true;

}

这适用于所有平台，唯一的缺点是你没有透明布局，但为此可以使用：

https://github.com/gaborv/xam-forms-transparent-modal

Answer 4

我使用AbsoluteLayout模拟弹出窗口。

<AbsoluteLayout x:Name="rootLayout" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" >
        <StackLayout x:Name="mainLayout" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All">
            <!-- Put your main contents-->
        </StackLayout>
        <ContentView x:Name="popupOverlay"
                     IsVisible="{Binding IsPopupVisible}"
                     BackgroundColor="#C0808080"
                     AbsoluteLayout.LayoutBounds="0,0,1,1"
                     AbsoluteLayout.LayoutFlags="All">
            <StackLayout x:Name="popupContent"
                         VerticalOptions="Center"
                         HorizontalOptions="Center"
                         WidthRequest="200"
                         HeightRequest="200">
                <Entry Placeholder="UserName"></Entry>
                <Entry Placeholder="Password"></Entry>
            </StackLayout>
        </ContentView>
</AbsoluteLayout>

首先，将背景内容（即主要内容）放在AbsoluteLayout中
第二，添加一个ContentView（popupOverlay），它将您的表单内容作为子项保存。此外部视图应使用半透明的灰色背景色（＃ C0 808080）跨整个屏幕。
将叠加层内部的弹出元素布局（popupContent）居中放置。
我通常还会在popupContent中使用关闭按钮将其隐藏。
通过将popupOverlay的IsVisible属性分别设置为true或false，显示或隐藏弹出窗口。

如何使用xamarin.forms在弹出窗口中创建表单？

4 个答案: