为什么showModal在iOS中显示全屏?

时间:2016-12-28 05:37:22

标签: javascript android ios xml nativescript

new.xml

<Page xmlns="http://www.nativescript.org/tns.xsd" 
  showingModally="onLoaded">
<StackLayout id="newUserModal" width="100%" height="auto" horizontalAlignment="center" verticalAlignment="center" backgroundColor="#F3F3F3" opacity="1">
    <StackLayout class="dialog-header">
        <label text="New User" />
    </StackLayout>
    <label class="header-line" />
    <StackLayout class="modal-row">
        <WrapLayout>
            <Label text="Name" class="modal-row-label" />
            <Label text="*" class="required-field" />
        </WrapLayout>
        <TextField id="user_Name" editable="true" text="" class="modal-row-textfield" />
    </StackLayout>
    <StackLayout class="modal-row">
        <WrapLayout>
            <Label text="Email" class="modal-row-label" />
            <Label text="*" class="required-field" />
        </WrapLayout>
        <TextField id="user_Email" editable="true" text="" class="modal-row-textfield" />
    </StackLayout>
    <StackLayout class="modal-row">
        <WrapLayout>
            <Label text="Username" class="modal-row-label" />
            <Label text="*" class="required-field" />
        </WrapLayout>
        <TextField id="user_userName" editable="true" text="" class="modal-row-textfield" />
    </StackLayout>
    <StackLayout class="modal-row">
        <WrapLayout>
            <Label text="Password" class="modal-row-label" />
            <Label text="*" class="required-field" />
        </WrapLayout>
        <TextField id="user_Password" editable="true" text="" secure="true" class="new-user-password" />
    </StackLayout>
    <GridLayout columns="*, 1, *" rows="auto">
        <label class="footer-button-cancel" text="Cancel" tap="dismiss" col="0" />
        <label class="footer-button-submit" text="Add" tap="submit" col="2"/>
    </GridLayout>
</StackLayout>
</Page>

JS

var NewUserModule = 'components/users/dialogs/new';

var context = {
    args: args
};

var fullscreen = false;

page.showModal(NewUserModule, context, function closeCallback(user_Name, user_Email, user_userName, user_Password, isChecked) {

    if (user_Name && user_Email && user_userName && user_Password) {
        updateList
            .addUser(user_Name, user_Email, user_userName, user_Password, isChecked)
            .catch(function (error) {
                // helpers.handleLoadError(error, 'Sorry, we could not add user');
            })
            .then(function () {
                loadUser();
            });
    }
}, fullscreen);

在上面的代码中,我在iOS中获得全屏模式,而在android中只是页面的大小。如何在iOS中将其修复为页面大小?

1 个答案:

答案 0 :(得分:1)

  

提示:根据iPhone设计,模态页面仅以全屏显示。

参考:https://docs.nativescript.org/core-concepts/navigation#modal-pages