I am trying to make some header to stick to the top of the SectionList but it seems like the stickyHeaderIndices={[0]}
doesn't work as expected. This is the section list:
<SectionList
ref={(ref) => (productsSectionListRef = ref)}
stickyHeaderIndices={[0]}
ListHeaderComponent={_renderHeader()}
contentContainerStyle={[style.products_container]}
sections={productListSections}
renderItem={({item, section}: {item: string; section: any}) => {
return _renderProduct(item);
}}
stickySectionHeadersEnabled={false}
renderSectionHeader={({section}) => {
return _renderProductHeader(section.title);
}}
keyExtractor={(item) => item}
showsVerticalScrollIndicator={false}
viewabilityConfig={{
itemVisiblePercentThreshold: 50,
}}
onViewableItemsChanged={_onViewableItemsChanged}
bounces={false}
scrollEventThrottle={4}
initialNumToRender={productListSections.length}
scrollEnabled={scrollEnabled}
removeClippedSubviews={true}/>
I tryed to put the header outside the section list but the header it's bigger and I cannot scroll inside of that header component.
will make first item in flatlist sticky to the top if you change to
the 4th item will stick to top after the item reached to the top when scrolled
item in
will be on top of the flatlist but not act as item inside flatlist its independent