How to use the react-native-navigation.Navigation.events function in react-native-navigation

// @flow

import { Navigation } from 'react-native-navigation'

import { registerScreens } from './screens'
registerScreens()

/* Silence 'unneeded' yellow box alerts. */
console.ignoredYellowBox = [
    'Remote debugger',
    'Debugger and device times',
    'Warning: componentWillMount is deprecated', // FIXME RN v.0.54.0
    'Warning: componentWillReceiveProps is deprecated', // FIXME RN v.0.54.0
]

Navigation.events().registerAppLaunchedListener(() => {
    Navigation.setDefaultOptions({
        _animations: {
            startApp: {
                y: {
                    from: 1000,
                    to: 0,
                    duration: 500,
                    interpolation: 'accelerate',
                },
                alpha: {
                    from: 0,
                    to: 1,
                    duration: 500,
                    interpolation: 'accelerate'
                }
            },

componentDidMount() {
        this.navigationEventListener = Navigation.events().bindComponent(this);
    }

setDidDisappearListener = () => {
        this.didDismissListener = Navigation.events().registerComponentDidDisappearListener(async ({componentId}) => {
            if (componentId === this.props.componentId && this.tapped) {
                await dismissAllModals();
                await popToRoot();
            }
        });
    }

to: 0,
              duration: 250,
            },
          },
        },
      } : {},
      bottomTabs: {
        translucent: false,
        barStyle: 'black',
        drawBehind: true,
        backgroundColor: '#000000',
      },
    } as Options;
  }

  private events = Navigation.events().bindComponent(this);
  private scrollY = new Animated.Value(0);

  private animatedHeroStyles = {
    transform: [{
      translateY: this.scrollY.interpolate({
        inputRange: [-(BACKDROP_HEIGHT + TOOLBAR_HEIGHT), 0, BACKDROP_HEIGHT],
        outputRange: [-(BACKDROP_HEIGHT + TOOLBAR_HEIGHT) / 2, 0, TOOLBAR_HEIGHT],
      }),
    }, {
      scale: this.scrollY.interpolate({
        extrapolate: 'clamp',
        inputRange: [-(BACKDROP_HEIGHT + TOOLBAR_HEIGHT), 0],
        outputRange: [2.5, 1],
      }),
    }],
  };

constructor(props) {
    super(props);

    Navigation.events().bindComponent(this);
  }

constructor(props) {
    super(props);
    Navigation.events().bindComponent(this);
  }

import { Navigation } from 'react-native-navigation'
import { registerScreens } from './navigation'
import { INITIALIZING_SCREEN } from './modules/Core/screens/Initializing'

registerScreens()

Navigation.events().registerAppLaunchedListener(() => {
  Navigation.setRoot({
    root: {
      component: {
        name: INITIALIZING_SCREEN.name,
      },
    },
  })
})

register(): void {
    this.listener = Navigation.events().registerComponentDidAppearListener(
      ({componentId, componentName}) => {
        if (!__DEV__ && screen && screensToIgnore.indexOf(componentName) === -1) {
          Analytics.screenview(componentName, {
            url: ''
          });
        }
      }
    );
  }

constructor(props) {
    super(props);
    this.state = {};
    this.subscription = Navigation.events().bindComponent(this);
  }

icon: require('../../assets/icons/calendar.png'),
        selectedIcon: require('../../assets/icons/calendar-filled.png'),
      },
      layout: {
        backgroundColor: '#000000',
      },
      bottomTabs: {
        translucent: false,
        barStyle: 'black',
        drawBehind: true,
        backgroundColor: '#000000',
      },
    } as Options;
  }

  events = Navigation.events().bindComponent(this);

  state = {
    insets: { top: 0, bottom: 0, calculated: false },
  };

  componentDidMount() {
    Movies.loadNewMovies();

    getInsets(this.props.componentId)
      .then(insets => this.setState({ insets }));
  }

  componentDidAppear() {
    Store.setComponentId(this.props.componentId);
  }