Utilisation de setState() pour rendre fixe l'entête

App.tsx

  // Ajout de scrollOffset à l'état
  state = { text: "", scrollOffset: 0 };

  render() {
    return (
      <ScrollView
        style={{ flex: 1, backgroundColor: "white" }}
        // Mis à jour de scrollOffset sur l'évènement onScroll
        onScroll={e => this.setState({ scrollOffset: e.nativeEvent.contentOffset.y })}
        // scrollEventThrottle={1} est nécessaire afin d'être notifié
        // de tous les évènements de défilement
        scrollEventThrottle={1}
      >
        {this.renderHeader()}
        {this.renderContent()}
      </ScrollView>
    );
  }

  renderHeader() {
    const headerHeight = 240;
    return (
      <View
        style={{
          height: headerHeight,
          // Déplacement de l'entête dans la direction opposée au défilement
          transform: [{ translateY: this.state.scrollOffset }],
          // zIndex est utilisé pour que l'entête soit toujours au dessus du contenu
          zIndex: 100,
        }}
      >
        /* ... */
      </View>
    );
  }