Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ListHeaderComponent in SectionList is not sticky #20809

Closed
max-zu opened this issue Aug 23, 2018 · 6 comments
Closed

ListHeaderComponent in SectionList is not sticky #20809

max-zu opened this issue Aug 23, 2018 · 6 comments
Labels
Platform: Linux Building on Linux. Resolution: Locked This issue was locked by the bot.

Comments

@max-zu
Copy link

max-zu commented Aug 23, 2018

Environment

  React Native Environment Info:
    System:
      OS: Linux 4.15 Ubuntu 18.04.1 LTS (Bionic Beaver)
      CPU: x64 Intel(R) Core(TM) i3-3220 CPU @ 3.30GHz
      Memory: 153.75 MB / 15.36 GB
      Shell: 4.4.19 - /bin/bash
    Binaries:
      Node: 10.9.0 - /usr/bin/node
      Yarn: 1.9.4 - /usr/bin/yarn
      npm: 6.2.0 - /usr/bin/npm
    npmPackages:
      react: ^16.3.1 => 16.4.1 
      react-native: 0.56.0 => 0.56.0 
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1

Description

ListHeaderComponent is not sticky and it scrolls as other Section Headers. How to fix it on top of the list ?

Reproducible Demo

https://snack.expo.io/HkRGmWhIX

@react-native-bot
Copy link
Collaborator

It looks like you are using an older version of React Native. Please update to the latest release, v0.56 and verify if the issue still exists.

The ":rewind:Old Version" label will be removed automatically once you edit your original post with the results of running react-native info on a project using the latest release.

@ergunyasar
Copy link

ergunyasar commented Aug 29, 2018

ListHeaderComponent is not sticky in SectionList. Only section header is. You can put your listHeaderComponent just above the SectionList to make it sticky.

@dulmandakh
Copy link
Contributor

This is expected behavior, not a bug. So closing this issue.

@max-zu
Copy link
Author

max-zu commented Sep 3, 2018

As for me, it looks very strange if this is expected behavior. Espesially if compare SectionList with FlatList, where ListHeaderComponent is always on top and does not scroll with other list data.

@hakankaradis
Copy link

use stickyHeaderIndices={[0]} to make the ListHeaderComponent sticky

@matteocollina
Copy link

@hakankaradis it works for sections of SectionList but not for ListHeaderComponent

@facebook facebook locked as resolved and limited conversation to collaborators Aug 29, 2019
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Aug 29, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Platform: Linux Building on Linux. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

6 participants