Nativescript ScrollView 不滚动答案

【问题标题】：Nativescript ScrollView not scrollingNativescript ScrollView 不滚动
【发布时间】：2020-03-19 14:27:00
【问题描述】：

我是 Nativescript 开发的新手，我有一个由 GridLayout 包裹的 ScrollView，在 ScrollView 内我放置了各种 StackLayouts，但是滚动布局根本不起作用，其中一个堆栈布局（黄色）显示为居中，知道我的代码有什么问题吗？

<template>
<Page class="background-color:white;">
    <ActionBar class="bg_blue_marine">
    </ActionBar>
    <GridLayout rows="*,auto" columns="*" style="width:100%; height:100%;">
        <ScrollView row="0" col="1" orientation="vertical" style="width:100%; height:auto; background-color:rgb(200,200,200);">
            <StackLayout style="width:100%; height:400px; background-color:red;"></StackLayout>
            <StackLayout style="width:100%; height:400px; background-color:yellow;"></StackLayout>
        </ScrollView>
        <FlexBoxLayout row="1" col="1" style="width:100%; height:80px; align-items:center; justify-content:space-around; background-color:white;"></FlexBoxLayout>
    </GridLayout>
</Page>
</template>

【问题讨论】：

标签： javascript android ios vue.js nativescript

【解决方案1】：

<GridLayout rows="300,*" columns="*">
        <ScrollView height="300" orientation="vertical">
    <StackLayout orientation="horizontal" horizontalAlignment="center" row="0" col="0" style="background-color:rgb(200,200,200);">

            <StackLayout orientation="horizontal" horizontalAlignment="center"
                style="width:50%; height:400; background-color:red;"></StackLayout>
            <StackLayout orientation="horizontal" horizontalAlignment="left"
                style="width:50%; height:400; background-color:yellow;"></StackLayout>
    </StackLayout>
</ScrollView>

    <FlexBoxLayout row="1" col="0"
        style="width:100%; height:80; align-items:center; justify-content:space-around; background-color:white;">
    </FlexBoxLayout>
</GridLayout>

将提供以下结果[1]：https://i.stack.imgur.com/m4TAG.png

我不确定您是否可以将 ScrollView 作为 GridLayout 的一行，您应该使用任何 Layout 来代替。另外，您不能使用px 单位来表示高度和宽度。另外，每当使用 StackLayout 时，请使用“orientation”和“alignment”属性。

【讨论】：

【解决方案2】：

ScrollView（或任何 ContentView 的后代，如 Page）只能有一个子元素。

在您的示例中，当您添加第二个 StackLayout 时，ScrollView 中的第一个 StackLayout 将被替换。您必须在第一个 StackLayout 中堆叠您的项目。

【讨论】：