Track ending animation of route change

Question

Is there any way to track ending animation of route change using react-native-router-flux? I want to render loading image during the animation and render my component when animation is completed

Router:

    <Router>
      <Scene key="root">
        <Scene key="login" component={Login} hideNavBar/>
        <Scene key="drawer" component={Drawer} open={false} type="replace" initial>
          <Scene key="main" initial navBar={Header}>
            <Scene key="search" component={Search} type="replace" initial />
            <Scene key="map" component={Map} />
          </Scene>
        </Scene>
      </Scene>
    </Router>

Button in search scene:

<Button buttonStyle={styles.button} title="map" onPress={Actions.map} />

Map component:

import MapView from 'react-native-maps';

export default class extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    return (
      <View style={styles.container}>
        <MapView
          style={styles.map}
          initialRegion={{
            latitude: 37.78825,
            longitude: -122.4324,
            latitudeDelta: 0.0922,
            longitudeDelta: 0.0421,
          }}
        />
      </View>
    );
  }
}

There is default left-to-right animation, and it slows down due to load map. I need to render map when the animation is finished.