question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ListView Headers do not Stick inside ScrollView

See original GitHub issue

The desired interaction is:

  1. a list with sticky section headers
  2. pull down at the top to refresh

When a ListView with sticky headers is placed within a ScrollView, the headers lose their “stick”:

<ScrollView
  refreshControl={
    <RefreshControl
      ...
    />
>
  <ListView
    dataSource={...}
    renderRow={...}
    renderSectionHeader={...} // these renderables no longer stick!
  />
</ScrollView>

This was also called out on a separate issue a while ago, but it looks like an issue was never created. So here we go!

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
joncursicommented, Oct 31, 2016

Ah, I did not realize that ListView has access to all of the props available on ScrollView. I see that now in the documentation. I just tried setting refreshControl directly on ListView and was able to achieve the desired interaction. Thank you @brentvatne !

0reactions
nirmal3win87commented, Mar 8, 2017

Is there any solution for sticky header not working inside scroll view?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Making a middle element to get stuck in the header ...
I want to make an element that is shown in the middle of ScrollView (or ListView ) at the first and then gets...
Read more >
Lists and grids | Jetpack Compose
Caution: Experimental APIs can change in the future or may be removed entirely. The 'sticky header' pattern is helpful when displaying lists of...
Read more >
Telerik Listview Sticky Header not working correctly on iOS side
I want to use a sticky header listview. I using the following code to render the sticky header list. XML page code:.
Read more >
How to create a table with vertically sticky header and ... - MSDN
Try to create four Grid s to set the layout and use ScrollView to achieve scrolling. A Grid wraps the three others like:...
Read more >
StickyListHeaders alternatives and similar packages
If you are using a transparent action bar the following getter+setter will be very helpful. Use them to set the position of the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found