nativescript - StackLayout 的垂直对齐方式

Question

我试图在 StackLayout 的底部放置一个按钮，但它不起作用。我不知道我做错了什么！

这是我的模板：

<Page actionBarHidden="true">
    <GridLayout rows="*, *, *, *" columns="*">
        <StackLayout horizontalAlignment="center"
                     verticalAlignment="center">
            <Label text="My Account" id="login-label"/>
        </StackLayout>
        <CardView row="1" class="cardStyle" margin="10"
                  elevation="40"
                  radius="4"
                  verticalAlignment="center"
                  horizontalAlignment="center"
                  rowSpan="2"
                  id="login-box">
            <StackLayout id="form-container">
                <TextField hint="Login"/>
                <TextField hint="Password"/>
                <Label text="Forgot password?" horizontalAlignment="right"/>
                <Button text="Button" @tap="loginButton()" verticalAlignment="bottom"/>
            </StackLayout>
        </CardView>
    </GridLayout>
</Page>

谢谢！

Answer 1

StackLayout 的设计不支持这一点。它用于以给定的方向一个接一个地堆叠子元素，您不能混合输出 - 顶部的子元素很少，底部或中心的子元素很少。

使用 Grid / Dock 布局将元素停靠在底部。