How can I add a header and footer to a FlatList in React Native?

How can I add a header and footer to a FlatList in React Native?

You can use the ListHeaderComponent and ListFooterComponent props of the FlatList component to add a header and footer.

Can you show me a code example?

Sure! Here's a simple example:

<FlatList
  data={data}
  renderItem={renderItem}
  ListHeaderComponent={<HeaderComponent />}
  ListFooterComponent={<FooterComponent />}
/>

What if I want to make the header sticky?

You can achieve a sticky header by using the stickyHeaderIndices prop. Just pass an array with the index of the header.

Thanks! Is there a way to customize the header and footer styles?

Yes, you can style the header and footer components just like any other React Native component using styles.