ScrollView Error on IOS


#1

Hello guys, I have a problem with ScrollView in IOS. As you see in example at the below I created a little list. When I launch the app from command line for IOS (device is iphone x), App starts and shows the list but I get neither respond nor scrolling. If I clicked any of the items app freezes about 2 seconds then returns the menu screen and there were no logs or output. It just crashed. In addition, I’m using Xiaomi Mi Mix 2, I tried same code at my phone, scrollView works like charm.

<StackLayout>
<ScrollView orientation="vertical">
    <StackLayout>
        <Label width="50" height="50" class="h3 m-15" col="0" text="Title 1"></Label>
        <Label width="50" height="50" class="h3 m-15" col="1" text="Title 2"></Label>
        <Label width="50" height="50" class="h3 m-15" col="2" text="Title 3"></Label>
        <Label width="50" height="50" class="h3 m-15" col="3" text="Title 4"></Label>
        <Label width="50" height="50" class="h3 m-15" col="4" text="Title 5"></Label>
        <Label width="50" height="50" class="h3 m-15" col="5" text="Title 6"></Label>
        <Label width="50" height="50" class="h3 m-15" col="6" text="Title 7"></Label>
        <Label width="50" height="50" class="h3 m-15" col="7" text="Title 8"></Label>
        <Label width="50" height="50" class="h3 m-15" col="8" text="Title 9"></Label>
        <Label width="50" height="50" class="h3 m-15" col="9" text="Title 10"></Label>
        <Label width="50" height="50" class="h3 m-15" col="10" text="Title 10"></Label>
        <Label width="50" height="50" class="h3 m-15" col="11" text="Title 11"></Label>
        <Label width="50" height="50" class="h3 m-15" col="12" text="Title 12"></Label>
        <Label width="50" height="50" class="h3 m-15" col="13" text="Title 13"></Label>
        <Label width="50" height="50" class="h3 m-15" col="14" text="Title 14"></Label>
        <Label width="50" height="50" class="h3 m-15" col="15" text="Title 15"></Label>
    </StackLayout>
</ScrollView>
</StackLayout>

#2

Were you able to reproduce this issue in Playground?

Besides, may I know why you have assigned col attribute for each label?


#3

Havent tried it in playground app.

Edit: I tried and it works like a charm. No lag, no freeze, no crash.

I copied the example from nativescript scrollview document. You can check it out from the link below.
Scroll View NativeScript

Also I encounter the same issue with nativescript-vue ScrollView example.
NativeScript Vue ScrollView


#4

personally I have an Android but I want to have an iOS but I see that there is a lot of problem


#5

Are there any solution ? The issue still persist.


#6

Sorry I’m bit confused, you had mentioned that it works in your last comment?


#7

@manojdcoder Oh I miss typed, I tried on playground app, havent encounter any of the issues in playground-preview app. If I run same code on the ios iphone X application freezes a second then returns the home screen.


#8

You haven’t copied the code exactly as the col value in each label refers to a Gridview which isn’t in your code.

<ScrollView orientation="horizontal" sdkExampleTitle sdkToggleNavButton>
    <GridLayout class="m-15" columns="auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto">
        <Label width="50" height="50" class="h3 m-15" col="0" text="Title 1"></Label>
        <Label width="50" height="50" class="h3 m-15" col="1" text="Title 2"></Label>
        <Label width="50" height="50" class="h3 m-15" col="2" text="Title 3"></Label>
        <Label width="50" height="50" class="h3 m-15" col="3" text="Title 4"></Label>
        <Label width="50" height="50" class="h3 m-15" col="4" text="Title 5"></Label>
        <Label width="50" height="50" class="h3 m-15" col="5" text="Title 6"></Label>
        <Label width="50" height="50" class="h3 m-15" col="6" text="Title 7"></Label>
        <Label width="50" height="50" class="h3 m-15" col="7" text="Title 8"></Label>
        <Label width="50" height="50" class="h3 m-15" col="8" text="Title 9"></Label>
        <Label width="50" height="50" class="h3 m-15" col="9" text="Title 10"></Label>
        <Label width="50" height="50" class="h3 m-15" col="10" text="Title 10"></Label>
        <Label width="50" height="50" class="h3 m-15" col="11" text="Title 11"></Label>
        <Label width="50" height="50" class="h3 m-15" col="12" text="Title 12"></Label>
        <Label width="50" height="50" class="h3 m-15" col="13" text="Title 13"></Label>
        <Label width="50" height="50" class="h3 m-15" col="14" text="Title 14"></Label>
        <Label width="50" height="50" class="h3 m-15" col="15" text="Title 15"></Label>
    </GridLayout>
</ScrollView>