9

I'm referring to this page of the official doc: https://wix.github.io/react-native-navigation/#/screen-api?id=listen-to-visibility-events-globally

After I create this class, how I tell navigator to use it?

realtebo
  • 23,922
  • 37
  • 112
  • 189
  • In you `app.js` you will instantiate this class and the call `.register()` on the same. Please see this https://github.com/InTeach/react-native-navigation-2/blob/072feac737984f918be90b6ebfa88341b25a8233/src/ScreenVisibilityListener.js and https://github.com/InTeach/react-native-navigation-2/blob/072feac737984f918be90b6ebfa88341b25a8233/example/src/app.js#L8 – Tarun Lalwani Apr 11 '18 at 06:17

1 Answers1

4

ScreenVisibilityListener listens to global events fired on the native side through react-native eventDispatcher, the navigator doesn't need to know about it.

Example usage:

import {ScreenVisibilityListener} from 'react-native-navigation';

new ScreenVisibilityListener({
  willAppear: ({screen}) => {
    console.log(`Displaying screen ${screen}`) 
  },
  didAppear: ({screen, startTime, endTime, commandType}) => {
    console.log('screenVisibility', `Screen ${screen} displayed in ${endTime - startTime} millis [${commandType}]`)
  },
  willDisappear: ({screen}) => {
    console.log(`Screen will disappear ${screen}`) 
  },
  didDisappear: ({screen}) => {
    console.log(`Screen disappeared ${screen}`)
  }
}).register();
yogevbd
  • 1,548
  • 1
  • 14
  • 18