NativeScript：带有文本叠加的图像 | GridLayout 不适合内容

Question

我在使用 NativeScript 布局时遇到问题。

我不想要这个样子，只是在图片上叠加了文字。

上面的图片是用 StackLayout 中的图片制作的，但是当我添加标签时，它会放在下面。我尝试在 css 中使用 position: absolute 但这行不通。

当我这样使用 GridLayout 时：

    <CardView class="cardStyle" shadowRadius="10" margin="10" elevation="50" radius="10">
        <GridLayout rows="*">
            <GridLayout rows="*" columns="*">
                <Image class="card-img" stretch="aspectFit" src="~/app/assets/pull.jpg"></Image>
                <GridLayout verticalAlignment="bottom">
                    <Label text="hallo" class="card-header"></Label>
                </GridLayout>
            </GridLayout>
        </GridLayout>
    </CardView>

Layout 没有像上图那样包裹 Image 的高度。

我能做什么？

Answer 1

尝试 rows="auto" 而不是 rows="*"

NativeScript：带有文本叠加的图像 | GridLayout 不适合内容

NativeScript: Image with Text Overlay | GridLayout won't fit content

nativescript

angular2-nativescript