Friday, August 19, 2022
HomeiOS DevelopmentThe right way to not have scrollview "pull to refresh" drag all...

The right way to not have scrollview “pull to refresh” drag all the display down on iOS [React Native]


On Android pull to refresh reveals a loading circle on the display. on iOS all the contents of you display is shifted down, loading circle seem, then content material shifts again as illustrated beneath.

(left is iOS instance, proper is android instance)

enter image description here

My query is can I disable the display shifting down and again up on iOS? I nonetheless want the pull to refresh performance from scrollview however not the animation that takes place on iOS.

Mainly I’ve a high navbar that’s mounted, I’ve a climate element that’s a part of scroll view.

enter image description here

I need the climate element to vanish because the consumer scrolls and to refresh when the consumer pulls to refresh. The problem is that solely on iOS pulling to refresh drags the contents of the display and the climate element “detaches”. This isn’t a difficulty on android for the reason that pull to refresh animation does not shift the screens contents.

enter image description here

<Display unsafe>
    <ScrollView
        refreshControl={<RefreshControl refreshing={isRefreshing} onRefresh={handleRefresh} />}
        keyboardAware
      >
        <AirQuality />

        //...many different elements

    </ScrollView>
</Display>

Is there perhaps a special option to strategy this? I’d respect any insights!

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments