Posted in React Native

ListView (or perhaps ScrollView) disappears after running in background for several minutes

   July 22, 2020  8 Comments on ListView (or perhaps ScrollView) disappears after running in background for several minutes

I’m using the ScrollView as a ViewPager and placing ListView in it just like the F8 app does, and since I upgrade the RN to 0.29 and now 0.30RC0, I’m persecuted by this problem:

navigate to the detail view from the list view ,then press the home button to make the app running in background, and then wait for several minutes to wake up the app, navigate back to the list view, the ListView (or perhaps or outer ScrollView) just disappears until I scroll it vertically or horizontally ( tap has no effect )

I have no idea what happened as it’s OK before RN0.29, I’ve tested on all the 0.29 versions and the newest 0.30RC version they are all the same.

here is the demo:
listview

Author: Fantashit

8 thoughts on “ListView (or perhaps ScrollView) disappears after running in background for several minutes”

  1. I’m encountering a similar problem after migrating RN from 0.28 to 0.29. I have a ListView off-screen which gets updated (render is called) due to an action occurring in another view. When navigating back to the ListView all items are invisible until I scroll the View up or down. The items seem to re-appear from the top of the screen.

    Edit: Turning off removeClippedSubviews solves the problem for me as mentioned here.

  2. We had a similar problem with a ListView on a inactive route which did not render correctly. removeClippedSubviews={false} did the trick. But I didn’t find out what was changed between 0.25.1 and 0.29.0 that could relate to this

  4. Heads up: we’ve uncovered the linked solution (625c8cb & co.) doesn’t work well with modals, so I’ve reverted the change on master until we come up with a proper fix 😞

  5. Hi guys,

    I just upgraded to RN0.40. The issue is still present in my app. Unlike @nihgwu I’m still using the old Navigator, not NavigationExperimental.

    @majak Are there any new estimates for a solution?

    Kind regards
    Josef

  6. I am having the same issue with FlatList in 0.43 with react-navigation.

    Anyone else still having the same issue? Still looking for a solution..

    UPDATE:
    Adding the below to the FlatList solved the blank rendering until scroll to show items problem:

    removeClippedSubviews={false}

    I don’t know if it’s the most efficient solution, but it’s the only one I found. If there is a better way to go about this from a performance stand point, please let us know @sahrens

    To reproduce the issue:

    1. Scene A has a FlatList of 10 items.
    2. On press of first item, go to Scene B.
    3. Scene B also has a FlatList of some items (even just one is fine to test it though).
    4. Go back to Scene A
    5. Repeat step 2, the list will be empty on Scene B
    6. Scroll up/down in that blank empty list location, the items will show up.

  7. React Native 0.44.0 (latest) has sticky header support for both iOS and Android in SectionList.

Comments are closed.

 Posted in React Native Issues

ListView (or perhaps ScrollView) disappears after running in background for several minutes

   March 24, 2020  5 Comments on ListView (or perhaps ScrollView) disappears after running in background for several minutes

I’m using the ScrollView as a ViewPager and placing ListView in it just like the F8 app does, and since I upgrade the RN to 0.29 and now 0.30RC0, I’m persecuted by this problem:

navigate to the detail view from the list view ,then press the home button to make the app running in background, and then wait for several minutes to wake up the app, navigate back to the list view, the ListView (or perhaps or outer ScrollView) just disappears until I scroll it vertically or horizontally ( tap has no effect )

I have no idea what happened as it’s OK before RN0.29, I’ve tested on all the 0.29 versions and the newest 0.30RC version they are all the same.

here is the demo:
listview

Author: Fantashit

5 thoughts on “ListView (or perhaps ScrollView) disappears after running in background for several minutes”

  1. I’m encountering a similar problem after migrating RN from 0.28 to 0.29. I have a ListView off-screen which gets updated (render is called) due to an action occurring in another view. When navigating back to the ListView all items are invisible until I scroll the View up or down. The items seem to re-appear from the top of the screen.

    Edit: Turning off removeClippedSubviews solves the problem for me as mentioned here.

  2. We had a similar problem with a ListView on a inactive route which did not render correctly. removeClippedSubviews={false} did the trick. But I didn’t find out what was changed between 0.25.1 and 0.29.0 that could relate to this

  4. Hi guys,

    I just upgraded to RN0.40. The issue is still present in my app. Unlike @nihgwu I’m still using the old Navigator, not NavigationExperimental.

    @majak Are there any new estimates for a solution?

    Kind regards
    Josef

  5. I am having the same issue with FlatList in 0.43 with react-navigation.

    Anyone else still having the same issue? Still looking for a solution..

    UPDATE:
    Adding the below to the FlatList solved the blank rendering until scroll to show items problem:

    removeClippedSubviews={false}

    I don’t know if it’s the most efficient solution, but it’s the only one I found. If there is a better way to go about this from a performance stand point, please let us know @sahrens

    To reproduce the issue:

    1. Scene A has a FlatList of 10 items.
    2. On press of first item, go to Scene B.
    3. Scene B also has a FlatList of some items (even just one is fine to test it though).
    4. Go back to Scene A
    5. Repeat step 2, the list will be empty on Scene B
    6. Scroll up/down in that blank empty list location, the items will show up.

Comments are closed.