CODEWITHSUNDEEP
xmlnativescript
Aaron Ullal
Aaron Ullal

Reputation: 5245

Nativescript GridLayout wrapped by ScrollView

I have a nativescript xml view defined as follows :

<Page 
 xmlns="http://schemas.nativescript.org/tns.xsd"
 xmlns:menu="components/menu"
 xmlns:header="components/header" 
 loaded="loaded">
<header:header />
<StackLayout orientation="vertical">
<ScrollView>
    <GridLayout rows="auto,auto,auto,auto" cols="auto,auto" >
        <Image      row="0" colSpan="2" src="~/img/tap.png" tap="takePicture"/>
        ...
        <TextField  row="2" col="1" horizontalAlignment="right" />
        <Button     row="3" colSpan="2" text="UPLOAD" />
    </GridLayout>
</ScrollView>
<menu:menu />
</StackLayout>
</Page>

The GridLayout is too big to be contained in a single screen, so I wrapped it inside a ScrollView. This however is not working : I can not scroll the page and, as a result, the last UI elements like the TextField and the Button are not accessible. What am I doing wrong? Should I insert the ScrollView tag in a different position?

Upvotes: 4

Views: 2424

Answers (1)

Manijak
Manijak

Reputation: 732

Try wrapping your GridLayout in a StackLayout. Think the problem might be that ScrollView is having a hard time to calcualte its scroll-height due to the fact that GridLayout has "auto" cols and rows. 

<ScrollView>
    <StackLayout>
        <GridLayout rows="auto,auto,auto,auto" cols="auto,auto" >
            <Image      row="0" colSpan="2" src="~/img/tap.png" tap="takePicture"/>
            ...
            <TextField  row="2" col="1" horizontalAlignment="right" />
            <Button     row="3" colSpan="2" text="UPLOAD" />
        </GridLayout>
    </StackLayout>
</ScrollView>

Upvotes: 6

Related Questions