Hello World no se muestra en reaccionar con Android nativo

Hola hago el programa Hello World en react-native para android. Seguí este https://facebook.github.io/react-native/docs/tutorial.html#content, pero no se muestra "Hello World" en la pantalla cuando se inicia la aplicación.

Se muestra pantalla vacía. ¿Cómo puedo solucionar este problema.

Index.android.js

 /** * Sample React Native App * https://github.com/facebook/react-native * @flow */ import React, { Component } from 'react'; import { AppRegistry, Text } from 'react-native'; export default class AwesomeProject extends Component { render() { return ( <Text>Hello World!</Text> ); } } AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);

Crear registros

 E:\React Programming\AwesomeProject>react-native run-android Starting JS server... Running C:\Users\ch-e00925\AppData\Local\Android\sdk/platform-tools/adb -s ZY223 8CX5L reverse tcp:8081 tcp:8081 Building and installing the app on the device (cd android && gradlew.bat install Debug... :app:preBuild UP-TO-DATE :app:preDebugBuild UP-TO-DATE :app:checkDebugManifest :app:preReleaseBuild UP-TO-DATE :app:prepareComAndroidSupportAppcompatV72301Library UP-TO-DATE :app:prepareComAndroidSupportRecyclerviewV72301Library UP-TO-DATE :app:prepareComAndroidSupportSupportV42321Library UP-TO-DATE :app:prepareComFacebookFrescoDrawee0110Library UP-TO-DATE :app:prepareComFacebookFrescoFbcore0110Library UP-TO-DATE :app:prepareComFacebookFrescoFresco0110Library UP-TO-DATE :app:prepareComFacebookFrescoImagepipeline0110Library UP-TO-DATE :app:prepareComFacebookFrescoImagepipelineBase0110Library UP-TO-DATE :app:prepareComFacebookFrescoImagepipelineOkhttp30110Library UP-TO-DATE :app:prepareComFacebookReactReactNative0350Library UP-TO-DATE :app:prepareComFacebookSoloaderSoloader010Library UP-TO-DATE :app:prepareOrgWebkitAndroidJscR174650Library UP-TO-DATE :app:prepareDebugDependencies :app:compileDebugAidl UP-TO-DATE :app:compileDebugRenderscript UP-TO-DATE :app:generateDebugBuildConfig UP-TO-DATE :app:generateDebugAssets UP-TO-DATE :app:mergeDebugAssets UP-TO-DATE :app:generateDebugResValues UP-TO-DATE :app:generateDebugResources UP-TO-DATE :app:mergeDebugResources UP-TO-DATE :app:bundleDebugJsAndAssets SKIPPED :app:processDebugManifest UP-TO-DATE :app:processDebugResources UP-TO-DATE :app:generateDebugSources UP-TO-DATE :app:processDebugJavaRes UP-TO-DATE :app:compileDebugJavaWithJavac UP-TO-DATE :app:compileDebugNdk UP-TO-DATE :app:compileDebugSources UP-TO-DATE :app:preDexDebug UP-TO-DATE :app:dexDebug UP-TO-DATE :app:validateDebugSigning :app:packageDebug UP-TO-DATE :app:zipalignDebug UP-TO-DATE :app:assembleDebug UP-TO-DATE :app:installDebug Installing APK 'app-debug.apk' on 'Moto G (4) - 6.0.1' Installed on 1 device. BUILD SUCCESSFUL Total time: 1 mins 9.699 secs Starting the app on ZY2238CX5L (C:\Users\ch-e00925\AppData\Local\Android\sdk/pla tform-tools/adb -s ZY2238CX5L shell am start -n com.awesomeproject/.MainActivity )... Starting: Intent { cmp=com.awesomeproject/.MainActivity }

El problema es que expo intenta agregar muchos caracteres a tu texto

 <Text>Hello World!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!</Text>

Verá que la última parte será visible en la parte superior de la pantalla. El problema es básicamente el texto es dibujar hacia fuera la pantalla. (Status var ocultar el texto!) Si usted mira usted podría ver el texto de nuevo la barra de estado.

Primero debes usar react-native start para iniciar el empaquetador en ejecución y luego usar react-native run-android para iniciar el emulador.

Tal vez su mostrar el texto, pero no se puede ver debido a los problemas de estilo. Intente algo como esto:

 import React, { Component } from 'react'; import { AppRegistry, Text, View } from 'react-native'; class HelloWorldApp extends Component { render() { return ( <View style={{ flex: 1, backgroundColor: 'red', alignItems: 'center', justifyContent: 'center' }}> <Text>Hello world!</Text> </View> ); } } AppRegistry.registerComponent('Boxit', () => HelloWorldApp);