Multiple fullscreen in scrollview with Nativescript

Question

I would like to know how can I have multiple fullscreen in scrollview with nativescript please ?

I tried this :

<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>

But the stack aren't fullscreen.

Jérémie Chazelle · Accepted Answer · 2020-05-01 00:12:28Z

0

I fixed with this :

Template

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

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

And add this :

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

...
data() {
    return {
        screenHeight: 0
    };
},
...
created() {
    this.screenHeight = screen.mainScreen.heightDIPs
}

answered May 1, 2020 at 0:12

Jérémie Chazelle

1,8285 gold badges35 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Multiple fullscreen in scrollview with Nativescript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related