ScrollView中的GridLayout-NativeScript

我不熟悉NativeScript。我有4个在我的页面图像，我想实现这一点

除了我想我的封面图像是全高的屏幕。这就是我正在尝试的代码

<ScrollView>
    <StackLayout height="100%" width="100%">
      <GridLayout columns="*, *" rows="5*, *, *">
        <StackLayout
          :row="0"
          :col="0"
          :colSpan="2"
          class="bgImage coverImage"
          :style="{backgroundImage:`url('${defaultImg}')`}"
        ></StackLayout>
        <StackLayout
          :row="calcRow(idx)"
          :col="calcCol(idx)"
          :colSpan="idx==0?2:1"
          v-for="(item,idx) in event.imgs"
          :key="idx"
          class="bgImage eventImage"
          :style="{backgroundImage:`url('${item}')`}"
        ></StackLayout>
      </GridLayout>
    </StackLayout>
  </ScrollView>

如果我没有给StackLayout设置height=“100%”，它甚至不会加载图像。如果我真的给了它，那么就没有卷轴了

---

这是游乐场链接

您可以使用

滚动视图的
布局更改事件
计算其高度，并将其用作第一幅图像的高度

操场将有助于调试。使用操场链接更新了问题。它显示的内容与问题中的照片完全相同。你想在这里得到什么？Redish Tree pic（背景中的太阳）将全屏显示，其他四个作为覆盖显示？红色图像将在滚动时全屏显示，其他图像将位于其下方。您正在寻找类似的内容吗-