React-native: ListHeaderComponent in SectionList is not sticky

[max-zu]

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]

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]

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

[dulmandakh]

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

[max-zu]

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]

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

[matteocollina]

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