React-native-navigation: Android Install Readme Incomplete

[AdamBrodzinski]

First I want to say thanks for making this library. It's working awesome on iOS!!

I'm struggling to make it work for Android though. It seems like the readme for Android breaks down half way and assumes knowledge of the Android ecosystem.

I'm also happy to PR fixes to the readme once I can figure out what's missing.

React Native 0.30
React 15.2.0
react-native-navigation 2.0.0-experimental.71

Firstly the readme says to run npm install react-native-navigation --save but that installs version 1.X. This works for iOS but fails on Android with a missing Splash module.

An hour later I figured out that I needed the 2.0 beta and installed that. Steps 1 and 2 and great and didn't have any issues with that.

Step 3 assumes you know where to locate MainActivity. Then after extending the class I hit a missing symbol error and guessed at importing the missing file (and also later confirmed by looking at the redux example).

Step 4 completely loses me but i've figured out how to at least make the compiler work... though the app launches with "Foo stopped running" so I must be doing something wrong here.

My fresh app had a MainApplication.java file which I commented out and added an App.java file like your examples. I added in the custom class (with name of App instead of MyApplication) and changed the xml file. The instructions for changing the XML is not enough for a non Android dev. I guessed by looking at the example.

Ultimately I still can't get the app to work on an upgraded RN 0.30 install (and used react-native upgrade).

Here are my changed Android files:

added android:name=".App" to config

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.badger">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
      android:name=".App"
      android:allowBackup="true"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>

</manifest>

package com.badger;

import com.reactnativenavigation.controllers.SplashActivity;

public class MainActivity extends SplashActivity {

}

// ..../com/badger/App.java
package com.badger;

import android.support.annotation.NonNull;

import com.facebook.react.ReactPackage;
import com.reactnativenavigation.NavigationApplication;

import java.util.Collections;
import java.util.List;

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

    @NonNull
    @Override
    public List<ReactPackage> createAdditionalReactPackages() {
        return Collections.emptyList();
    }
}

// ..../com/badger/MainApplication.java
/*
package com.badger;

import android.app.Application;
import android.util.Log;

import com.facebook.react.ReactApplication;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;

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

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    protected boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage()
      );
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
      return mReactNativeHost;
  }
}
*/

With the logger running I get this once starting up:

08-21 16:28:57.672  2577  2577 E AndroidRuntime: FATAL EXCEPTION: main
08-21 16:28:57.672  2577  2577 E AndroidRuntime: Process: com.badger, PID: 2577
08-21 16:28:57.672  2577  2577 E AndroidRuntime: java.lang.RuntimeException: Unable to instantiate application com.badger.App: java.lang.ClassNotFoundException: Didn't find class "com.badger.App" on path: DexPathList[[zip file "/data/app/com.badger-2/base.apk"],nativeLibraryDirectories=[/data/app/com.badger-2/lib/x86, /data/app/com.badger-2/base.apk!/lib/x86, /vendor/lib, /system/lib]]
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.LoadedApk.makeApplication(LoadedApk.java:578)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.ActivityThread.handleBindApplication(ActivityThread.java:4680)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.ActivityThread.-wrap1(ActivityThread.java)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1405)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.os.Handler.dispatchMessage(Handler.java:102)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.os.Looper.loop(Looper.java:148)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.ActivityThread.main(ActivityThread.java:5417)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at java.lang.reflect.Method.invoke(Native Method)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
08-21 16:28:57.672  2577  2577 E AndroidRuntime: Caused by: java.lang.ClassNotFoundException: Didn't find class "com.badger.App" on path: DexPathList[[zip file "/data/app/com.badger-2/base.apk"],nativeLibraryDirectories=[/data/app/com.badger-2/lib/x86, /data/app/com.badger-2/base.apk!/lib/x86, /vendor/lib, /system/lib]]
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:56)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at java.lang.ClassLoader.loadClass(ClassLoader.java:469)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.Instrumentation.newApplication(Instrumentation.java:981)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    at android.app.LoadedApk.makeApplication(LoadedApk.java:573)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    ... 9 more
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    Suppressed: java.lang.ClassNotFoundException: com.badger.App
08-21 16:28:57.672  2577  2577 E AndroidRuntime:        at java.lang.Class.classForName(Native Method)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:        at java.lang.BootClassLoader.findClass(ClassLoader.java:781)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:        at java.lang.BootClassLoader.loadClass(ClassLoader.java:841)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:        at java.lang.ClassLoader.loadClass(ClassLoader.java:504)
08-21 16:28:57.672  2577  2577 E AndroidRuntime:        ... 12 more
08-21 16:28:57.672  2577  2577 E AndroidRuntime:    Caused by: java.lang.NoClassDefFoundError: Class not found using the boot class loader; no stack trace available

Very confused... any help would be appreciated!!

[AdamBrodzinski]

Just to be more thorough I made a fresh 0.25.1 project and followed the same steps. I'm getting a similar error:

08-21 16:57:27.908  3400  3421 I ReactNativeJS: Running application "routetest" with appParams: {"initialProps":{},"rootTag":1}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF
08-21 17:07:12.802  3515  3515 E AndroidRuntime: FATAL EXCEPTION: main
08-21 17:07:12.802  3515  3515 E AndroidRuntime: Process: com.routetest, PID: 3515
08-21 17:07:12.802  3515  3515 E AndroidRuntime: java.lang.RuntimeException: Unable to instantiate application com.routetest.App: java.lang.ClassNotFoundException: Didn't find class "com.routetest.App" on path: DexPathList[[zip file "/data/app/com.routetest-1/base.apk"],nativeLibraryDirectories=[/data/app/com.routetest-1/lib/x86, /data/app/com.routetest-1/base.apk!/lib/x86, /vendor/lib, /system/lib]]
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.LoadedApk.makeApplication(LoadedApk.java:578)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.ActivityThread.handleBindApplication(ActivityThread.java:4680)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.ActivityThread.-wrap1(ActivityThread.java)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1405)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.os.Handler.dispatchMessage(Handler.java:102)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.os.Looper.loop(Looper.java:148)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.ActivityThread.main(ActivityThread.java:5417)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at java.lang.reflect.Method.invoke(Native Method)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
08-21 17:07:12.802  3515  3515 E AndroidRuntime: Caused by: java.lang.ClassNotFoundException: Didn't find class "com.routetest.App" on path: DexPathList[[zip file "/data/app/com.routetest-1/base.apk"],nativeLibraryDirectories=[/data/app/com.routetest-1/lib/x86, /data/app/com.routetest-1/base.apk!/lib/x86, /vendor/lib, /system/lib]]
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:56)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at java.lang.ClassLoader.loadClass(ClassLoader.java:469)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.Instrumentation.newApplication(Instrumentation.java:981)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    at android.app.LoadedApk.makeApplication(LoadedApk.java:573)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    ... 9 more
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    Suppressed: java.lang.ClassNotFoundException: com.routetest.App
08-21 17:07:12.802  3515  3515 E AndroidRuntime:        at java.lang.Class.classForName(Native Method)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:        at java.lang.BootClassLoader.findClass(ClassLoader.java:781)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:        at java.lang.BootClassLoader.loadClass(ClassLoader.java:841)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:        at java.lang.ClassLoader.loadClass(ClassLoader.java:504)
08-21 17:07:12.802  3515  3515 E AndroidRuntime:        ... 12 more
08-21 17:07:12.802  3515  3515 E AndroidRuntime:    Caused by: java.lang.NoClassDefFoundError: Class not found using the boot class loader; no stack trace available

[smooJitter]

Side note, is this for your refactor project? 😀

[guyca]

@AdamBrodzinski Sorry for the late response. Did you manage to get your project working?

[AdamBrodzinski]

@guyca No worries and thanks for getting back 😃 In the mean time I did try to tweak the project to match the screenshot of #208 so that I don't have an App.java file but instead modified MainApplication like below. I think I might be close but i'm thinking it's how i'm returning the last method (as they where using VectorIcon so it was a bit diff.)

package com.badger;

import android.app.Application;
import android.util.Log;

import com.facebook.react.ReactApplication;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;

import com.reactnativenavigation.NavigationApplication;

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

public class MainApplication extends NavigationApplication {

  @Override
  public boolean isDebug() {
    return BuildConfig.DEBUG;
  }

  @Override
  public List<ReactPackage> createAdditionalReactPackages() {
    // Add the packages you require here.
    // No need to add RnnPackage and MainReactPackage
    //return Arrays.<ReactPackage>asList();  // also tried this.. no dice
    return null;
  }
}

and that gets me close. builds but when it launches I get a redbox with:

Didn't find class "com.facebook.jni.IteratorHelper" on path: DexPathList[[zip file "/data/app/com.badger-1/base.apk"],nativeLibraryDirectories=[/data/app/com.badger-1/lib/x86, /data/app/com.badger-1/base.apk!/lib/x86, /vendor/lib, /system/lib]]
findClass
    BaseDexClassLoader.java:56
loadClass
    ClassLoader.java:511
loadClass

[DanielZlotin]

@AdamBrodzinski jeez, sorry about all that. Makes me think that we need to provide a clean template or something. Do you have a clean-ish project I can clone and PR the fixes? This way I think will be the fastest, and shouldn't take more than a few mintues...

[AdamBrodzinski]

@DanielZlotin No worries, luckily i'm a professional Yak Shaver™ 😆. I've also been plugging away on the iOS simulator so I can keep busy.

I just created a fresh RN 0.30 project and installed the latest beta (i think? .71) as well as transferring the src and img folders over from the example project. This project is currently runs in Genymotion.
https://github.com/AdamBrodzinski/react-native-navigation-android-example

Thanks for the help!

[DanielZlotin]

@AdamBrodzinski ah I thought you're trying to run on RN0.25.1; 30 isn't supported yet (there are breaking changes in the android native code interface) - not something big but we must do it along a bunch of other libraries to keep the production working. This upgrade is planned for 2.0.0.
I can do a PR for you with 0.25.1 if you want.

[AdamBrodzinski]

@DanielZlotin Oh ok. From all of the other issues it seemed like I could go past that and up to 0.30 without much trouble (i'm already on 0.30, mainly for ActivityIndicator but can I go backwards just to ship). Do you have a ballpark on when 0.30 will be supported?

Here's another repo with 0.25.1. I also could not get it working from the readme.

https://github.com/AdamBrodzinski/android-example2

Thanks!

[DanielZlotin]

@AdamBrodzinski hopefully in 2 weeks. hopefully. It really depends on the compatibility of a bunch of other libraries we use in production..

Now that I got your project working, please create a PR with the change you think should be in the README 😄

[AdamBrodzinski]

@DanielZlotin Thanks! I'll make a PR this weekend! 🍻

[agumack]

Hi all,

I have problem when release app (using this tutorial)
Then i installed the release using gradlew installRelease and the installation was successful but when i run the apk it says : "unfortunately, application has stopped"
but when i install and tun it using react-native run-android command it will work perfectly .

Do any one have any idea what i'm doing wrong?

Logs:

Could not find class 'android.graphics.drawable.RippleDrawable', referenced from method android.support.v7.widget.AppCompatImageHelper.hasOverlappingRendering

[AdamBrodzinski]

@agumack have you tried following along with these commits?
https://github.com/AdamBrodzinski/android-example2

Also you need to use 0.25.1 for those. I used rninit to install a fresh older version.

[agumack]

thanks @AdamBrodzinski I'll try it now

[agumack]

@AdamBrodzinski i get an error when react-native run-android

E/AndroidRuntime(26807): java.lang.RuntimeException: Unable to start activity ComponentInfo{com.example/com.reactnativenavigation.controllers.NavigationActivity}: java.lang.NullPointerException
E/AndroidRuntime(26807): at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2192)
E/AndroidRuntime(26807): at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2241)
E/AndroidRuntime(26807): at android.app.ActivityThread.access$800(ActivityThread.java:141)
E/AndroidRuntime(26807): at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1204)
E/AndroidRuntime(26807): at android.os.Handler.dispatchMessage(Handler.java:102)
E/AndroidRuntime(26807): at android.os.Looper.loop(Looper.java:136)
E/AndroidRuntime(26807): at android.app.ActivityThread.main(ActivityThread.java:5049)
E/AndroidRuntime(26807): at java.lang.reflect.Method.invokeNative(Native Method)
E/AndroidRuntime(26807): at java.lang.reflect.Method.invoke(Method.java:515)
E/AndroidRuntime(26807): at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:793)
E/AndroidRuntime(26807): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:609)
E/AndroidRuntime(26807): at dalvik.system.NativeStart.main(Native Method)
E/AndroidRuntime(26807): Caused by: java.lang.NullPointerException
E/AndroidRuntime(26807): at com.reactnativenavigation.views.BottomTabs.setStyle(BottomTabs.java:85)
E/AndroidRuntime(26807): at com.reactnativenavigation.views.BottomTabs.(BottomTabs.java:25)
E/AndroidRuntime(26807): at com.reactnativenavigation.layouts.BottomTabsLayout.createBottomTabs(BottomTabsLayout.java:87)
E/AndroidRuntime(26807): at com.reactnativenavigation.layouts.BottomTabsLayout.createLayout(BottomTabsLayout.java:45)
E/AndroidRuntime(26807): at com.reactnativenavigation.layouts.BottomTabsLayout.(BottomTabsLayout.java:40)
E/AndroidRuntime(26807): at com.reactnativenavigation.layouts.LayoutFactory.createBottomTabsScreenLayout(LayoutFactory.java:27)
E/AndroidRuntime(26807): at com.reactnativenavigation.layouts.LayoutFactory.create(LayoutFactory.java:12)
E/AndroidRuntime(26807): at com.reactnativenavigation.controllers.NavigationActivity.createLayout(NavigationActivity.java:69)
E/AndroidRuntime(26807): at com.reactnativenavigation.controllers.NavigationActivity.onCreate(NavigationActivity.java:54)
E/AndroidRuntime(26807): at android.app.Activity.performCreate(Activity.java:5249)
E/AndroidRuntime(26807): at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1087)
E/AndroidRuntime(26807): at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2156)

[AdamBrodzinski]

@agumack What about running:
./node_modules/react-native/local-cli/cli.js run-android ? also is this the example2 repo or your own that's erroring? You might want to try that one since it's known to work to narrow down the problem.

If it is that repo perhaps trying the scripts in the package.json... npm run install and npm run start.

[DanielZlotin]

@AdamBrodzinski I don't trust run-android, I just use the ./gradlew (run from the android dir) scripts installDebug or installRelease together with npm run start.
In any case, we should start the upgrade to RN31 soon. iOS is upgraded, Android will probably break due to the upgrade so we do it cautiously.

[AdamBrodzinski]

@DanielZlotin sounds great. I'll try using that instead 👍

[tylerclark]

Anybody found any instructions that get you from start to finish? I've tried everything and still cant figure out how to make a clean app run using RN0.25.1 and [email protected]. Help!

[monder]

The instructions at https://github.com/wix/react-native-navigation/wiki/Installation---Android worked for me, but the react version has to be > 30 as stated in Migrating-to-version-2.0 if you want to use 2.x version of react-native-navigation

@DanielZlotin could you please update the version in wiki, and maybe remove (or copy to a single page in wiki) all 1.x mentions because as I understood, even though 2.x is still experimental, v1 is not supported.

[guyca]

@tylerclark Please try using v2 (set react-native-navgation: 'next' in package.json) and follow the short migration guide @monder linked to. Let me know if you still have any issues. Thanks and sorry for the confusion..

[DanielZlotin]

@drorbiran this is a good idea -https://github.com/wix/react-native-navigation/issues/223#issuecomment-246588068 - separate it to 2 installation guides one for each version, and in v1.3 specify it's not in active development, but it's stable with RN0.25

[liuzhen2008]

I pulled the repo.
cd into ./example/android
ran ./gradlew

Got error > Cannot evaluate module react-native-navigation : Configuration with name 'libraryDebug' not found.

Where can I specify a configuration with that name?

[beast]

@liuzhen2008 put the following line in your build.gradle:

dependencies {
    debugCompile project(path: ':react-native-navigation', configuration: 'libraryDebug')
    releaseCompile project(path: ':react-native-navigation', configuration: 'libraryRelease')
}

@DanielZlotin Was this removed from readme somehow? I remember before the readme was re-organized, these lines were part of installation instructions.

[DanielZlotin]

That's actually incorrect. I forgot to update the example project. I'll fix
it.

On Sep 15, 2016 07:40, "Yang" [email protected] wrote:

@liuzhen2008 https://github.com/liuzhen2008 put the following line in
your build.gradle:

dependencies {
debugCompile project(path: ':react-native-navigation', configuration:
'libraryDebug')
releaseCompile project(path: ':react-native-navigation', configuration:
'libraryRelease')
}

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/wix/react-native-navigation/issues/223#issuecomment-247233104,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGWgj1AUhSp8I-vQBt0mt1uExBBhUzUSks5qqMw4gaJpZM4JpYgD
.

[beast]

@DanielZlotin You mean the new version example should have these removed? We've been using the older version since version 2.0 is WIP. So I haven't been following the changes :]

[guyca]

@beast He means it's enough to specify compile project(':react-native-navigation') since there are no differences between release and debug versions.

[beast]

@guyca I see. Thanks.

[dgobaud]

+1 for adding import android.support.annotation.NonNull; to MainApplication.java setup instructions I was stuck on that

[guyca]

hmm.. I think we should add a recommendation to edit java filed in Android Studio, which automatically handles imports for you.