Sticky Component inside scrollview

by

It is very simple with ScrollView component. There is already something called “stickyHeaderIndices” which takes the index of child to make sticky.In following code, content inside renderComponent2 stays sticky when you scroll.

<ScrollView
      stickyHeaderIndices={[1]}
      showsVerticalScrollIndicator={false}
 >
  {this.renderComponent1()}
  {this.renderComponent2()}
  {this.renderComponent3()}
 </ScrollView>

Refer: https://facebook.github.io/react-native/docs/scrollview.html#stickyheaderindices

Leave a Comment