由 ScrollView 包装的 Nativescript GridLayout

Question

我有一个定义如下的 nativescript xml 视图：

<Page 
 xmlns="http://schemas.nativescript.org/tns.xsd"
 xmlns:menu="components/menu"
 xmlns:header="components/header" 
 loaded="loaded">
<header:header />
<StackLayout orientation="vertical">
<ScrollView>
    <GridLayout rows="auto,auto,auto,auto" cols="auto,auto" >
        <Image      row="0" colSpan="2" src="~/img/tap.png" tap="takePicture"/>
        ...
        <TextField  row="2" col="1" horizontalAlignment="right" />
        <Button     row="3" colSpan="2" text="UPLOAD" />
    </GridLayout>
</ScrollView>
<menu:menu />
</StackLayout>
</Page>

GridLayout 太大而无法包含在单个屏幕中，因此我将其包裹在 ScrollView 中。然而，这不起作用：我无法滚动页面，因此无法访问最后的 UI 元素，如 TextField 和 Button。我究竟做错了什么？我应该在不同的位置插入 ScrollView 标签吗？

Answer 1

尝试将您的 GridLayout 包装在 StackLayout 中。认为问题可能在于 ScrollView 很难计算其滚动高度，因为 GridLayout 具有“自动”列和行。

<ScrollView>
    <StackLayout>
        <GridLayout rows="auto,auto,auto,auto" cols="auto,auto" >
            <Image      row="0" colSpan="2" src="~/img/tap.png" tap="takePicture"/>
            ...
            <TextField  row="2" col="1" horizontalAlignment="right" />
            <Button     row="3" colSpan="2" text="UPLOAD" />
        </GridLayout>
    </StackLayout>
</ScrollView>