React-native-navigation: Blank white screen on Android, IOS working fine!

[mohdabbas]

Issue Description

I get a blank white screen on react-native run-android, can't even access CMD+M for dev menu. IOS working perfectly fine. If I run http://localhost:8081/index.android.bundle?platform=android&dev=false&hot=false&minify=false in browser, it says: "message": "Cannot find entry file index.android.js in any of the roots: ["/Projects/Mobile Applications/Project"]", even I have added
@Override public String getJSMainModuleName() { return "index"; }
in MainApplication.java,

(https://github.com/wix/react-native-navigation/issues/197)]

Steps to Reproduce / Code Snippets / Screenshots

App.js

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

import { registerScreens } from './src/screens';

registerScreens(); // this is where you register all of your app's screens

// start the app
Navigation.startTabBasedApp({
  tabs: [
    {
      label: 'One',
      screen: 'Project.SplashScreen', // this is a registered name for a screen
      title: 'Screen One'
    }
  ]
});

screens/index.js

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

import SplashScreen from './splash/splash.screen';

// register all screens of the app (including internal ones)
export function registerScreens() {
  Navigation.registerComponent('Project.SplashScreen', () => SplashScreen);
}

MainActivity.java

package com.bricofer;

import com.reactnativenavigation.controllers.SplashActivity;

public class MainActivity extends SplashActivity {

    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    protected String getMainComponentName() {
        return "Project";
    }
}

MainApplication.java

package com.project;

import android.app.Application;

import com.facebook.react.ReactApplication;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;

import java.util.Arrays;
import java.util.List;
import com.reactnativenavigation.NavigationApplication;

public class MainApplication extends NavigationApplication {

     @Override
     public boolean isDebug() {
         // Make sure you are using BuildConfig from your own application
         return BuildConfig.DEBUG;
     }

     protected List<ReactPackage> getPackages() {
         // Add additional packages you require here
         // No need to add RnnPackage and MainReactPackage
         return Arrays.<ReactPackage>asList(
             // eg. new VectorIconsPackage()
         );
     }

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

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

Kindly help!!!

Thanks

---

Environment

• React Native Navigation version: 1.1.375
• React Native version: 0.52.0
• Platform(s) (iOS, Android, or both?): Android

[mohdabbas]

Even, If I change the files to index.ios.js and index.android.js, same problem in Android. I am getting blank screen. But the URL http://localhost:8081/index.android.bundle?platform=android&dev=false&hot=false&minify=false show the data

var __DEV__=false,__BUNDLE_START_TIME__=this.nativePerformanceNow?nativePerformanceNow():Date.now(),process=this.process||{};process.env=process.env||{};process.env.NODE_ENV='production';
(function (global) {
  'use strict';

  function _toConsumableArray(arr) {
    if (Array.isArray(arr)) {
      for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) {
        arr2[i] = arr[i];
      }

      return arr2;
    } else {
      return Array.from(arr);
    }
  }
...... and so on

[andfs]

I`m facing this issue too

[andfs]

In my project the problem was with react-native-vector-icons. The RN releases greater then 0.51 is hiding the real problem. I`ve downgraded the RN version and used this guides:

https://github.com/facebook/react-native/pull/17672/files
https://github.com/oblador/react-native-vector-icons/issues/626#issuecomment-357493287

Then I`ve upgraded the RN version to 0.53 and almost everything is working fine. Now the problem is with the drawer

[FlaviooLima]

I'm having the same problem.
@mohdabbas, in the beginning, you are saying that this happens on Android only, and in the end, you are saying that it happens on both. Could you edit? it can create some confusion. :)

I get a blank white screen on react-native run-android, can't even access CMD+M for dev menu. IOS working perfectly fine.

React Native Navigation version: 1.1.375
React Native version: 0.52.0
Platform(s) (iOS, Android, or both?): both

[ibmouhssine]

In my project the problem was with the icons
when i comment this line

icon: require('./img/one.png'),

the project works fine on IOS but I get a blank white screen on android

You have to add icon so the tabulation can works on android

[arapocket]

@ibmouhssine I have this same issue, where exactly do I add icon: require('./img/one.png'), ?

[mohdabbas]

@FlaviooLima Where did I say that it happens on both?

My issue solved after deleting the virtual device and creating a new one! I faced the issue a couple of times, each time I delete the device and recreate, it solves. Strange :-).

[FlaviooLima]

@mohdabbas If I delete the app it solves my issue too. Can you try to uninstall and see if it solves for you to?
And if I have debugjs mode off it happen's a lot more this white screen.
In the bottom of your comment Where you say the environment :)

Platform(s) (iOS, Android, or both?): both

It should be

Platform(s) (iOS, Android, or both?): Android

@arapocket I believe that @ibmouhssine was trying to say the icon in here:

this.props.navigator.setTabButton({
  tabIndex: 0, // (optional) if missing, the icon will be added to this screen's tab
  icon: require('../img/one.png'), // local image asset for the tab icon unselected state (optional)
  selectedIcon: require('../img/one_selected.png'), // local image asset for the tab icon selected state (optional, iOS only)
  label: 'New Label' // tab label that appears under the icon (optional)
});

But in my case my app doens't have tabs, maybe i'm missing something? i am new to this library.

[qasimalbaqali]

Getting same exact issue. iOS works fine, it's just Android. For me the app builds fine showing 100%, can't access the dev tools and the console is just empty.

"react-native": "0.53.0",
"react-native-navigation": "^1.1.408",

I had some icons on my tab bar, but even removing them doesn't fix the issue.

Edit: Actually the debugger can't connect to the emulator WebSocket connection to 'ws://localhost:8081/debugger-proxy?role=debugger&name=Chrome' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED

[andfs]

You must have the icons in android tab bar. I followed the links that I mentioned above and loaded the icons as follow:

Icon.getImageSource('ios-pricetag-outline', 30).then((promocoes) => { 
                    promocoesIcon = promocoes;
Navigation.startTabBasedApp({
                        tabs: [{
                                label: 'Agora',
                                screen: 'agora',
                                title: 'Agora',
                                icon: promocoesIcon,
                                navigatorButtons
                            }

[Noitidart]

@andfs are you sure your problem was not related to - https://github.com/wix/react-native-navigation/issues/2180

[andfs]

@Noitidart I think not because now everything works fine

[Pastromhaug]

Same issue on Android with RN 0.54.0. The first time I open my app in the emulator it works fine, but upon subsequent restarts I get a white screen. If I uninstall the app in the emulator, then it works the first time I start the app but I just get white screens the next time.

[hugheba]

I am still unable to resolve this on Android, works fine in iOS

"native-base": "^2.3.9",
"react": "^16.3.0-alpha.1",
"react-native": "0.54.2",
"react-native-vector-icons": "^4.5.0",

I have a tabConfig.js

import { default as MaterialIcons } from 'react-native-vector-icons/MaterialIcons';
async function prepareIcons() {
    const icons = await Promise.all([
        MaterialIcons.getImageSource('some-icon', 30),
        MaterialIcons.getImageSource('another-icon', 30)
    ]);
    const [someIcon, anotherIcon] = icons;
    return { someIcon, anotherIcon };
}

export async function getTabApp() {
    const icons = await prepareIcons();
    return {
        drawer: {
            left: {
                screen: 'drawer.Main'
            }
        },
        tabs: [
            {
                label: 'Tab1',
                screen: 'tab.SomeTab', // this is a registered name for a screen
                icon: icons.someIcon,
                // selectedIcon: icons.someIcon, // iOS only
                title: 'Tab 1'
            },
            ...
        ]
    }
}

And in index.js

import { getTabApp } from 'tabConfig';
async function startApp() {
    Navigation.startTabBasedApp(await getTabApp());
}
startApp();

[fivechjr]

I am facing this issue too. It works fine on iOS, but I get blank screen on Android.
"react-native": "0.54.2"
"react-native-navigation": "^1.1.415"
"native-base": "^2.3.10"

[V3RT1AG0]

In my case the issue was that I was using a variable that I didn't import in my Screens.js file but it didn't throw that error. It simply showed me white screen. Make sure there are no such error in your file else it will show white screen instead of throwing it.

[fivechjr]

I just downgraded React Native to 0.49 and it works normally on both iOS and Android. It seems that there might be something broken in React Native 0.5+ ?

[chrmod]

Was facing the same issue while using Navigation.startTabBasedApp so decided to try Navigation.startSingleScreenApp. It worked without a problem.

My current hypothesis is missing tab icons are to blame. I have not specified any, so maybe they fallback to some defaults. (Project I work with does not use new VectorIconsPackage()).

If this would help someone I can share the code of the project that reproduce the issue.

[FlaviooLima]

From what I understand, this issue happens when an error is thrown, and because react-native activity is not initialized it breaks and don't show the error.
I believe that most of this issues can be resolved if you find the code that is causing the error in your project and not in wix itself.
But there are people here that may have found a true bug in this library.
So just before starting to write here. Try to guarantee that the bug is not in your code. :)

[hugheba]

@FlaviooLima
Even this one file app white-screens on Android, runs fine on iOS. I can't get much simpler than this.

index.js

import React from "react";
import { Text } from "react-native";
import { Navigation } from 'react-native-navigation';

class Simple extends React.Component {
    render() {
        return (<Text>Hello, I'm Simple.</Text>);
    }
}

Navigation.registerComponent('simple', () => Simple);
Navigation.startSingleScreenApp({
    screen: {
        screen: 'simple'
    }
});

No other code included, and I'm pretty sure all this is correct.

[FlaviooLima]

@hugheba Like a said, there are real bugs :)
I was just trying to warn that some are from bugs in the project code and not the library.

But there are people here that may have found a true bug in this library.
So just before starting to write here. Try to guarantee that the bug is not in your code. :)

[philvasseur]

Reinstalling and deleting devices doesn't ever get me anything other than a blank screen. It was working a month or two ago when I set it up, and have just been developing on iOS since then. Any ideas?

Can't open dev menu or anything. Just a blank screen. http://localhost:8081/index.bundle?platform=android&dev=true&hot=false&minify=false does load seemingly fine when I open it in a browser.

[KD-Dhiren]

I also face this issue I used Navigation.startSingleScreenApp
I followed everything for android from http://wix.github.io/react-native-navigation/#/installation-android and while run an android app, it run successfully but it shows white blank screen.
I don't understand what actually happens ?

[peakyDicers]

I am having a similar issue. Build is successful, but shows a blank screen on the emulator. When I press Ctrl-M, I hear the feedback sound that the emulator makes when the developer menu appears, even though it does not appear.

react-native: 0.53.3

MainActivity.java & MainApplication.java
https://gist.github.com/peakyDicers/2f78f70f1762fd5afbeb7e9c7383c806

[philvasseur]

It turns out my error seemingly wasn't with react-native navigation at all.

However, It seems past 0.51.0 (or maybe past 0.52.0) android does not show errors if they happen upon opening and instead just shows a blank screen (unclear if this is a react-native issue, or is because of something with react-native navigation). If you have android studio open, you should be able to find the error listed there. Once I fixed that error, the app then loaded.

If you are getting a white screen, I'd recommend either downgrading your RN version to be able to see what the error actually is on the screen, or trying to find the error message in android studio.

[arapocket]

To anyone who is having this issue, it is most likely caused by play-services version incompatibles.

Look through your logcat in Android Studio for an exception.

[paulrostorp]

@arapocket What would this look like? I am a bit lost when it come to android logs...

[chinmaygit]

Try this,
stop the packager.
adb reverse tcp:8081 tcp:8081
start the packager.

[paulrostorp]

@chinmaygit This does not work for RN 0.54, RNN 1.1.434

[mirsujat]

I have save issue

with
"dependencies": {
"react": "16.2.0",
"react-native": "0.52.0",
"react-native-navigation": "^1.1.436",
"react-native-vector-icons": "^4.6.0",
"react-redux": "^5.0.7",
"redux": "^3.7.2"
}

anybody help Me

[peakyDicers]

like @philvasseur said, this is not an issue with react-native navigation, but instead with the newer versions of react-native.
I downgraded my version of react-native to 0.51.0 (the minimum version required for react-native-navigation) and was able to see my start-up error.

[mirsujat]

there is a emulator warning: occured after adding react-native-nagivation

Emulator: Warning: Quick Boot / Snapshots not supported on this machine. A CPU with EPT + UG features is currently needed. We will address this in a future release.

[mirsujat]

Is there solution. thanks in advance

[mirsujat]

It's Ok. this Emulator warnig is OK

[joaqtor]

It's happening the same to me. No matter if I downgrade react-native at all.

No console errors. Nothing. Just a blank screen.

[peakyDicers]

I find that closing the application in the emulator, and then opening it up again works for me, I know it sounds dumb but it took me a long time before I tried it and it worked for me.

Get Outlook for Androidhttps://aka.ms/ghei36

---

From: Joaquín [e-mail]
Sent: Saturday, April 14, 2018 11:32:31 AM
To: wix/react-native-navigation
Cc: Ian Chui; Manual
Subject: Re: [wix/react-native-navigation] Blank white screen on Android, IOS working fine! (#2687)

It's happening the same to me. No matter if I downgrade react-native at all.

No console errors. Nothing. Just a blank screen.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHubhttps://github.com/wix/react-native-navigation/issues/2687#issuecomment-381337299, or mute the threadhttps://github.com/notifications/unsubscribe-auth/AQE0Jcxn7aTkEaBYmx73lEjaK3H4IIbFks5tohaPgaJpZM4R_10K.

[joaqtor]

I am working with a physical device, and closing and opening does nothing but crashing.

[MaheshNandam]

react - 16.0.0
react-native - 0.50.4

It was running fine but recently got the issue, did anyone solved this issue?

[xvonabur]

I've finally solved this issue by combining this solution and this one.

[qasimalbaqali]

@xvonabur Man you are a life saver... I applied the first solution first. Delete the app, rebuilt again, didn't work for the first time, but after trying again delete the app, closing the debugger and building all over again, finally the android app is running!

Edit: Alright, and now it's the same again.. :(

[joaqtor]

@qasimalbaqali don't play with my feelings like that!!

[xvonabur]

@qasimalbaqali it works in my case. I had to delete an app, restart npm server and reset caches, but after that no more blank window in emulator. Heavy multitasking, closing app by pressing back button work as expected.

For the second solution you do actually need to edit source code of react-native-navigation. Otherwise it doesn't work.

[qasimalbaqali]

@joaqtor I'm not playing with your hear this time, I promise. It worked again, I did what @xvonabur sugggested in both of his posts. I uninstalled the app, closed the npm server for bundling, closed the debugging tab, and installed it again. It was a blank screen at first, but then when I click on the the square button in the navigation bar (sorry I don't know what exactly is that button called), the one that shows you all the running apps on your phone, then clicked on my app again, WALAA it's not white again and it's running :)

[xvonabur]

@qasimalbaqali I think you have another problem with your code, because going to recent apps list and back works without fixes mentioned above.

I have the following dependencies:

"react": "16.2.0",
"react-native": "0.52.2",
"react-native-navigation": "^1.1.397"

[ericketts]

If you're having trouble getting your changes picked up, try these options:

• navigate to $TMPDIR and rm metro-cache-* and haste-map-* (essentially clearing the RN packager cache(s))
• navigate to your app's android dir, and execute ./gradlew clean (which bins the compiled Java code and deletes any generated builds)

With both those done, you're guaranteed to re-build everything from scratch, so if your changes still aren't showing up, you may need to re-examine the code you've added.

[sirawatGG]

I solved this by @ibmouhssine solution.
thank you.

I think the issue only happen with new version of react and react-native.
For example I used [email protected], [email protected], it shows blank screen unless I add icon in Navigation.startTabBasedApp.

However, it works just fine with my previous version of [email protected], [email protected].

[dungnguyen10989]

add this mothod in to MainActivity:

@Override
    public LinearLayout createSplashLayout() {
        LinearLayout view = new LinearLayout(this);
        TextView textView = new TextView(this);
        /*ImageView img = new ImageView(this);

        int w = LinearLayout.LayoutParams.MATCH_PARENT;
        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(w, w);

        img.setImageResource(R.drawable.background);
        img.setLayoutParams(layoutParams);*/
        view.setBackgroundColor(Color.parseColor("#ffffe0"));
        view.setGravity(Gravity.CENTER);

        textView.setTextColor(Color.parseColor("#319efb"));
        textView.setText("Your Project");
        textView.setGravity(Gravity.CENTER);
        textView.setTextSize(TypedValue.COMPLEX_UNIT_DIP, 40);

        view.addView(textView);
        return view;
    }

If I config react-native-navigation with redux, in first time to run app in debug mode, after I grant overlay permission, app will appear SplashScreen above, and show my screens after action ROOT_CHANGED dispatched, but if I reload app by shake device or press command + M > reload, app only show SplashScreen above, not show my screen whether action ROOT_CHANGED has been dispatched(show in debugger), this error is only on android when config navigation with redux, who can help me ?

[vijaya06]

when i am making build through react-native run-android then its working fine but when i am making signed apk so its showing white screen. what i do. please help!

[batuhansahan]

i solve this issue add "icon" in tabs

` {

  label: 'MESSAGES',

  screen: '<example>.Messages',

  icon: require('./img/MESSAGES.png'), // !! this line must be here

  title: 'Messages'

},

`

[manojkmishra]

I was facing white screen issue for past two days.

1. First I was using memu android emulator - in that case it was not moving after showing.
   Metro Bundler ready.
   Loading dependency graph, done.

1. Then I started using android studio, there also it was the same. After updating my android studio finally found the error in android studio logcat.
   In my case also it was icon issue.

05-17 17:34:08.193 6607-6640/com.appanme E/ReactNativeJS: Error while starting app: Error: No icon defined for tab appname.abcScreen
05-17 17:34:08.205 6607-6607/com.appanme E/unknown:ReactNative: Unable to launch redbox because react activity is not available, here is the error that redbox would've displayed: console.error: "Error while starting app: Error: No icon defined for tab appname.abcScreen"

As soon as I defined the icons, everything started working:

constructor() { this._initApp() }
_initApp() {
Navigation.startTabBasedApp({
tabs: [
{ label: 'Feeds', screen: 'appname.abcScreen', title: 'title1',
icon: require('./images/icon1.png'),
},
{ label: 'Explore', screen: 'appname.defScreen', title: 'title2',
icon: require('./images/icon1.png'),
},
]
})
}

[ericketts]

Its unfortunate because Android does actually have a real bug where a white screen will erroneously be shown when restoring an app, but this issue is getting cluttered with people seeing a white screen because they were either too bone headed or too impatient to read the documentation.

[Asleepace]

For me it was a glitch on my apps startup, that apparently didn't cause previous versions of react-native below 0.55.4 to crash, in this particular case it was an issue with one-signal.

[Ailton265]

I have the same issue, anyone find what is the problem? I couldn't...

[Kriskev]

After several hours of research, I was so desperate, I used the example of the doc and miraculously it work.

After that I made a ctrl z to find my original code, since he was able to launch the application for once. And there Booom, I had a lot of error but which was not displayed before.

So my conclusion, we have white screen because our code probably contains errors and react-native-navigation does not start the application with errors and for a reason that I do not know do not post them. So try to display something first with the example of the doc to launch the application and without closing, replace with your code.
sorry for my poor English

[Kriskev]

Doc usecase. 👍

[0paIescent]

Hey all, I've been following this thread for a few days now, and I had been having the same issue as @peakyDicers, even down to being able to get the sound of the dev menu, but no ui. I'll preface with the fact that everything I've been testing is stock code directly from the guides and I was using:

react: 16.3.1
react-native: 0.55.4
react-native-navigation: 1.1.468

I ran the project in Android Studio as opposed to react-native run-android and was told through Logcat that I needed an icon for my screen. I created an assets folder and put a picture in there, added it to package.json in
"rnpm": { "assets": [ "./assets" ] } }, and added icon: require('./assets/icon.png'). It still told me that I needed and icon. I tried all of the following (suggested by @ericketts):

rm /tmp/metro-cache-*
rm /tmp/haste-map-*
rm node_modules/
cd android; ./gradlew clean
watchman  watch-del /path/to/project/

and then npm install after that was done.

No dice.

I decided to try a last ditch of delete everything, reboot my computer, and start fresh. Now it works. I think that the missing icon was the main culprit here seeing as RN v0.55.4 works for me.

The steps I took were:

add to tab: icon: require("/asset_folder/icon.format")

Make sure you then add the following to your package.json:

"rnpm" : {
    "assets": [
        "/asset_folder/"
    ]
}

and run react-native link to link the assets. After doing those three things, everything was working fine for me. Hopefully this helps someone out there.

[silverfh]

double check for missing function..

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

[KiranJasvanee]

RN 0.55 getting blank white screen in iOS and Android both!

[joseramongravity]

Okay, so as some people have said, check in your logcat in android studio, the logcat is next to the build or terminal bar in the buttom left corner, error messages appear there, follow them, good luck

[tjkang]

if anyone use react-native-vector-icons, make sure you update those fonts(Octicons.ttf and etc) in assets/fonts.
i don't use react-native-navigation but i had similar problem.
it works fine on iOS but on android, whenever the app is installed then sometimes it gets blank white screen after splash, but it works fine sometimes as well. it is just randomly happened
once i updated them, it works fine

[Jakerevans]

If you're getting a blank white screen, (on a physical device at least, probably works for emulator too) and don't have the full Android Studio GUI installed like me (apparently music takes priority on my hard drive space), just type this in terminal to see the error message that you'd be able to more easily see in Studio:

adb logcat | grep ReactNativeJS

In my case, my error turned out to be an issue with react-native-camera (E ReactNativeJS: undefined is not an object (evaluating 'CameraManager.Aspect'))

[Geli25]

I am encountering the same problem. No errors on logcat, build or node.js. Currently testing on physical device on the new versions. If I exit the app and return to it it will crash and keep crashing unless I kill the app completely.
When I downgraded to 0.52 it at least shows me a "version mismatch" red screen, but will still crash if I exit and go back to it again. It shows nothing if I match the version by upgrading react native back, no red screen even if the server is disconnected.
This is driving me insane. I have built a new project as well with all my original code and without react-native-navigation, it runs fine. But once I change the code on the MainActivity and MainApplication. It is blank again.

[staklau]

Changing getJSMainModuleName in MainApplication.java from

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

to

    @Override
    protected String getJSMainModuleName() {
      return "index.android.js";
    }

was the problem for me. No error message was shown for me either.

[kientux]

I think I'm facing the same problem with v2. But in v2 you cannot override getJSMainModuleName() directly from MainApplication.java, it's placed deeply in NavigationReactNativeHost class.

So this is the solution (edit MainApplication.java):

    @Override
    protected ReactNativeHost createReactNativeHost() {
        return new MyReactNativeHost(this);
    }

    class MyReactNativeHost extends NavigationReactNativeHost {

        public MyReactNativeHost(NavigationApplication application) {
            super(application);
        }

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

[sandhyaviss]

I am using
"react-native": "~0.55.2",
"react-native-navigation": "^1.1.474" I had issue with blank screen.I resolved mine with adb "logcat".
Use this command at the terminal at your project level

adb logcat *:S ReactNative:V ReactNativeJS:V

once you find the error then you can try to solve the problem.In my case its in the Navigation.

[Nisharunnisaa]

I am Facing the same issue, i am getting a white page instead of the page i routed.
the following is my package.json:

{
"name": "jul20-BHI",
"version": "0.1.0",
"private": true,
"devDependencies": {
"react-native-scripts": "1.14.0",
"jest-expo": "~27.0.0",
"react-test-renderer": "16.3.1"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "jest"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"expo": "^27.0.1",
"react": "16.3.1",
"react-native": "~0.55.2",
"react-native-card-view": "0.0.3",
"react-native-elements": "^0.19.1",
"react-native-material-dropdown": "^0.11.1",
"react-native-material-textfield": "^0.12.0",
"react-native-simple-radio-button": "^2.7.2",
"react-native-table-component": "^1.1.8",
"react-navigation": "^2.8.0"
}
}
can someone help me with the solution ?
Thanks

[erick94isc]

@kientux Could you show me all your MainApplication.java please? Because i have the same problem with v2.

[aspisila]

I had the problem with white screen.

I was able to resolve by opening the project (./android folder) with Android Studio, and using the 'Debug App (Shift + F9)' function... and then looking at the debugging tab

In fact I had nothing wrong with my code, but what was running was still in cache.

I've also been able to see error details at http://localhost:8081/index.delta?Platform=android&dev=true&minify=false

[msureshmewara]

android/app/src/main/res/values/styles.xml
add the below code:

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowBackground">@color/splash_background</item>
</style>

[TurboCoder]

Possible solution

According to the documentation, the Icons used by the tabs are not required, but they're actually required for Android.

The example code provided by the documentation is:

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

import { registerScreens } from './screens';

registerScreens(); // this is where you register all of your app's screens

// start the app
Navigation.startTabBasedApp({
  tabs: [
    {
      label: 'One',
      screen: 'example.FirstTabScreen', // this is a registered name for a screen
      icon: require('../img/one.png'),
      selectedIcon: require('../img/one_selected.png'), // iOS only
      title: 'Screen One'
    },
    {
      label: 'Two',
      screen: 'example.SecondTabScreen',
      icon: require('../img/two.png'),
      selectedIcon: require('../img/two_selected.png'), // iOS only
      title: 'Screen Two'
    }
  ]
});

But they need to specify that these lines in particular are super important, at least for Android:

icon: require('../img/two.png'), // IMPORTANT
selectedIcon: require('../img/two_selected.png'), // IMPORTANT

Keep in mind that you must change the path used for the images, so it uses yours.

[ivan3123708]

Thank you @Jakerevans so much. After trying all these fancy solutions I executed the command and found out my app crashed because i typed "justifuContent" in one of my StyleSheets.
RN would have saved me a lot of time if it rendered the error instead of that blank screen

[codeeeee01]

I already fix this problem using this:

npm remove --save react-native && npm i --save [email protected]

[goldstar0415]

When I try to do it in Remote JS Debugging Android app works well. But If I Stop Remote JS Debugging, I am getting same issue.
My react-native version is 0.55.4

[icecreamsandwich]

I also run in to this issue (Blank screen after bundling the app) When running the latest react-native and react version (react= 0.57.3 && react-native=16.6.8) . I downgraded react to (0.55.4) which intact reverted react-native to 16.4 resolved the issue , I don't know why this happens , i have older app with react (0.57.2) and react-native version (16.5) working without any problem ...

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest Detox and report back. Thank you for your contributions.

[stale[bot]]

The issue has been closed for inactivity.

[Abdisalan]

@FlaviooLima Where did I say that it happens on both?

My issue solved after deleting the virtual device and creating a new one! I faced the issue a couple of times, each time I delete the device and recreate, it solves. Strange :-).

This was the solution for me I found. Upgrading a legacy react-native project from 0.45 to 0.51

[nugoo1]

U get a blank screen because pages havent loaded. You need to fix your app.js file and your android.app.js file should import your app.js file..

This is how I fixed it. There's nothing wro wrong with the packages, you haven't loaded the screen properly. On ios u see a splash screen thats why it seems like it only works for ios. Just keep going, add some pages and it will work.

[daxaxelrod]

What worked for me was having this be the index.js file and the core exported from a sibling file. Note that the project name must match the one in your app.json

import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('INSERT_PROJECT_NAME_HERE', () => App);

[losheredos]

Facing the same issue.. Its unbelieveably meaningless.. I thought its cuz of wix but then changed it to router-flux still same, then tried to downgrade the RN version.. STILL SAME