How can I implement scroll to top in a FlatList?

How can I implement scroll to top in a FlatList?

You can achieve this by using the ref prop to create a reference to your FlatList and then calling the scrollToOffset method.

Can you show me a code example?

Sure! Here's a simple example:

import React, { useRef } from 'react';
import { FlatList, Button, View } from 'react-native';

const MyComponent = () => {
  const flatListRef = useRef(null);

  const scrollToTop = () => {
    flatListRef.current.scrollToOffset({ animated: true, offset: 0 });
  };

  return (
    <View>
      <Button title='Scroll to Top' onPress={scrollToTop} />
      <FlatList
        ref={flatListRef}
        data={data}
        renderItem={renderItem}
        keyExtractor={item => item.id}
      />
    </View>
  );
};

This will scroll the FlatList to the top when the button is pressed.

What if I want to add a button that only appears when I scroll down?

You can use the onScroll event of the FlatList to track the scroll position and conditionally render the button based on that.