html - 如何修复 NativeScript 中网格布局中的重叠项目？

Question

我正在使用 NativeScript 和 Angular 创建一个移动测验类型的游戏。我想从给定的数组中生成一个 3 x 8 的网格，它有 24 项长。

我尝试使用设置如下所示的行和列的代码，我也尝试将所有设置为“*”和“auto”。

<ActionBar title="Riddle #1" icon="" class="action-bar">
</ActionBar>
<StackLayout>
    <Image src="res://some_image"></Image>
    <GridLayout rows="auto, *, auto" columns="auto, *, *, *, *, *, * auto">
            <Label *ngFor="let character of riddleCharacters; let i = index" row="i/8" col="i%8" [text]="character"></Label>
    </GridLayout>
</StackLayout>

不幸的是，所有项目都放置在位置 0,0 并且它们相互重叠。我希望它们形成一个 3 x 8 网格。我很高兴在这件事上得到任何帮助。

标签： htmlangularnativescriptangular2-nativescript