React-native-navigation: [Android] - Unable to showModal or push screens.

Created on 13 Feb 2018  路  7Comments  路  Source: wix/react-native-navigation

Issue Description

On Android devices, and simulators I am unable to use function from Navigation or this.props.navigator.

For example I have a simple TouchableHighlightcomponent and when I press it, I want to display a modal. I tried both Navigation.showModal({}) and this.props.navigator.showModal({}), but none of them works.

I also tried so do a simple this.props.navigator.push({})with the same screen, but its does not work neither on Android.

On iOS everything works fine, so I guessed maybe my installation for Android is bad, but I can't see where.

Steps to Reproduce / Code Snippets / Screenshots

const LargeNavbar = ({ modal }) => (
  <Root>
    <Image source={logoImage} />
    <TitleContainer>
      <Title>{toUppercase('Annuaire des')}</Title>
      <TitleBold>{toUppercase('administrateurs')}</TitleBold>
    </TitleContainer>
    <TouchableOpacity
      onPress={() =>
        modal
          ? Navigation.dismissModal(onboardingModal)
          : Navigation.showModal(onboardingModal)
      }
    >
      <Image source={setIconSource(modal)} />
    </TouchableOpacity>
  </Root>
);

As you can see, my code is pretty simple, I just want to show or display a modal according to a props call modal.

This how my MainApplication.java looks like:

package com.fnbp;

import io.realm.react.RealmReactPackage;
import org.devio.rn.splashscreen.SplashScreenReactPackage;
import com.reactnativenavigation.NavigationApplication;
import com.reactnativenavigation.bridge.NavigationReactPackage;
import com.facebook.react.ReactPackage;
import com.lugg.ReactNativeConfig.ReactNativeConfigPackage;
import com.rnfs.RNFSPackage;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends NavigationApplication {
  @Override
  public boolean isDebug() {
    return BuildConfig.DEBUG;
  }

  protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
            new RNFSPackage(),
            new RealmReactPackage(),
            new SplashScreenReactPackage(),
            new ReactNativeConfigPackage(),
            new NavigationReactPackage());
  }

  @Override
  public List<ReactPackage> createAdditionalReactPackages() {
    return getPackages();
  }

  @Override
  public String getJSMainModuleName() {
    return "index";
  }
}

Is there anything I've done wrong ?


Environment

  • React Native Navigation version: 1.1.371
  • React Native version: 0.53.0
  • Platform(s) (iOS, Android, or both?): Android
  • Device info (Simulator/Device? OS version? Debug/Release?): Samsung Galaxy s4, Android 5.0.1, Debug

Most helpful comment

@flatsteve Just as you said, updating the version seems to fix this issue. Thank a lot for the tip.
Should we close this then ?

All 7 comments

Can you also post your MainActivity?

Sure sorry about that, here it is:

package com.fnbp;

import com.reactnativenavigation.controllers.SplashActivity;

public class MainActivity extends SplashActivity {

}

Ok I have some news about this. Its seems that on Android, Navigation.showModal({})actually works but the screen is not displayed. If I change my device orientation ( from portrait to landscape ), then I can see it.

Anyone has ever experienced this ?

@PeteOyable - I have the exact same issue. I call this.props.navigator.showModal(...) and it seems like nothing happens and the app loses all responsiveness (taps don't work etc). It was only by reading your comment that I tried rotating the phone, and sure enough the desired modal screen appears and is responsive!

If you make an progress with this it would be great if you could post here. I'll do the same 馃憤

P.S just noticed I received a new crash report for my app and I think one of my users just ran into this in production:

com.reactnativenavigation.screens.ScreenStack.peek
ScreenStack.java - line 240
java.util.EmptyStackException

@PeteOyable I have fixed this by updating react-native-navigation from version "1.1.371" to version "1.1.378". Not sure what changed between these versions but I hope this helps you 馃憤

@flatsteve It feels good that someone has the same issue. I will upgrade the version and let you know if this fixes the problem : )

@flatsteve Just as you said, updating the version seems to fix this issue. Thank a lot for the tip.
Should we close this then ?

Was this page helpful?
0 / 5 - 0 ratings