React-native-navigation [V2] - Android - верхняя панель модала отображается перед открытием модала

Question

Я использую response-native-navigation v2 (из wix). Я ввел довольно простую навигацию, чтобы открыть модал.

Проблема, с которой я сталкиваюсь, заключается в том, что на Android верхняя панель моего модального окна появляется до появления модального слоя, что создает эффект мерцания (см. Рисунок ниже, сравнение между iOS и Android). Я поиграл со многими вариантами конфигурации ... но не смог добраться до плавного перехода по страницам (это та же проблема, когда я нажимаю на стек, переход на Android не плавный).

Ниже приведены мои модули:

• "native-base": "^ 2.10.0"
• "реагировать": "16,6.3"
• "реагировать родной": "0.57.8"
• «реакция-нативная навигация»: «^ 2.6.0»

В моем index.js

Navigation.events().registerAppLaunchedListener(() => {
  Navigation.setDefaultOptions({
    layout: {
      orientation: ['portrait']
    },
    topBar: {
      visible: true,
      drawBehind: false
    },
    animations: {
      push: {
        waitForRender: true,
      },
      showModal: {
        waitForRender: true
      }
    }
  });
  Promise.all([
    Icon.getImageSource("magnify", 30),
    Icon.getImageSource("account", 30),
  ]).then(source => {
    Navigation.setRoot({
      root: {
        stack: {
          children: [{
            component: {
              name: "IdeasScreen",
              options: {
                topBar: {
                  testID: "Home.TopBar",
                  background: {
                    color: themeVars.brandPrimary
                  },
                  title: {
                    text: i18n.t('Home.title'),
                    color: "white"
                  },
                  rightButtons: [{
                      id: 'viewProfile',
                      icon: source[1],
                      color: "white",
                      testID: "Home.profileButton"
                  }, {
                      id: 'searchFriends',
                      icon: source[0],
                      color: "white",
                      testID: "Home.friendsButton"
                  }],
                }
              }
            }
          }
          ]
        }
      }
    })
  })
});

Затем в моем App.js (моей домашней странице) мой Fab имеет событие onPress: onPress = {this.FabClickedHandler}

FabClickedHandler = () => {
    Promise.all([
      MaterialIcon.getImageSource("close", 30)
    ])
    .catch(err => {
      alert(err);
    })
    .then(source => {
      Navigation.showModal({
        stack: {
          children: [{
            component: {
              name: 'AddIdeaScreen',
              options: {
                topBar: {
                  testID : 'AddIdeaScreen.title',
                  background: {
                    color: themeVars.brandPrimary
                  },
                  leftButtons: [{
                    id: 'cancelButton',
                    testID: 'AddIdeaScreen.cancelButton',
                    ...Platform.select({
                      ios: { text: i18n.t('AddIdeaScreen.cancelButton'), },
                      android: { icon: source[0], }
                    }),
                    color: "white"
                  }],
                  rightButtons: [{
                    id: 'saveButton',
                    testID : 'AddIdeaScreen.saveButton',
                    text: i18n.t('AddIdeaScreen.saveButton'),
                    enabled: false,
                    color: "white"
                  }],
                  title: {
                    text: i18n.t('AddIdeaScreen.title'),
                    color: "white"
                  }
                }
              }
            }
          }]
        }
      })
    })
  }

Спасибо за вашу помощь!