React Native FlatList: I have ListHeader Component with 3 items. How can I make it so only 2 of those items are sticky?
I wanted renderTitle() to be the only item in the ListHeader prop to not stick when scrolling.
stickyHeaderIndices={[0]} sticks all of ListHeader, so how can I select certain items to stick?
FlatList.tsx
<FlatList data={fakeProjectData} renderItem={(item: any) => renderItem(item)} keyExtractor={(item, index: number) => `key-${index}`} // stickyHeaderIndices={[0]} ListHeaderComponent={<><>{renderTitle()}</><View style={{ backgroundColor: darkMode ? '#000000' : '#FFFFFF'}}><View style={{ paddingLeft: 7, paddingRight: 7 }}><SearchBar placeholder="Search Projects" // @ts-ignore onChangeText={(text: any) => setSearchBarText(text)} value={searchBarText} onFocus={() => setSearchBarFocused(false)} onBlur={() => setSearchBarFocused(true)} containerStyle={darkMode ? { height: 45, marginTop: 16, marginBottom: 16, backgroundColor: '#000000' } : { height: 45, marginTop: 16, marginBottom: 16, backgroundColor: '#FFFFFF' }} inputContainerStyle={darkMode ? { backgroundColor: '#0F0F0F' } : { backgroundColor: '#F2F2F7' }} inputStyle={darkMode ? {color: '#FFFFFF'} : {color: '#000000'}} platform={Platform.OS === 'ios' ? 'ios' : 'android'} round={true} /></View><View style={darkMode ? styles.segmentContainerDark : styles.segmentContainerLight}><SegmentedControl values={['All', 'Active', 'Inactive']} selectedIndex={segmentIndex} onChange={(event: any) => setSegmentIndex(event.nativeEvent.selectedSegmentIndex)} appearance={darkMode ? 'dark' : 'light'} /></View></View></> } />