在滚动视图中使用本机脚本的多个全屏显示

问题描述 投票:0回答:1

我想知道如何在带有本地脚本的滚动视图中具有多个全屏显示?

enter image description here

我尝试过这个:

<Page actionBarHidden="true" class="page">
    <ScrollView orientation="vertical">
        <StackLayout>
            <StackLayout height="100%" backgroundColor="red">
<Label text="Fullscreen 1"></Label>
            </StackLayout>

            <StackLayout height="100%" backgroundColor="blue">
<Label text="Fullscreen 2"></Label>
            </StackLayout>
        </StackLayout>
    </ScrollView>
</Page>

但是堆栈不是全屏的。

nativescript nativescript-vue
1个回答
0
投票

我已经解决了这个问题:

模板

<Page actionBarHidden="true">
    <ScrollView orientation="vertical">
        <StackLayout>
            <StackLayout :height="screenHeight" backgroundColor="red">
                ...
            </StackLayout>

            <StackLayout :height="screenHeight" backgroundColor="blue">
                ...
            </StackLayout>
        </StackLayout>
    </ScrollView>
</Page>

并添加此内容:

import { screen } from "tns-core-modules/platform";

...
data() {
    return {
        screenHeight: 0
    };
},
...
created() {
    this.screenHeight = screen.mainScreen.heightDIPs
}
© www.soinside.com 2019 - 2024. All rights reserved.