...
Code Block |
---|
distributionUrl=https\\://services.gradle.org/distributions/gradle-7.5.1-all.zip |
En tu activity launcher (en el caso de la app de Diiki B2C, agregar en la clase
BaseActivityBinder
), en el métodoonCreate
agrega lo siguiente:
...
Agrega fuera del método
onCreate
lo siguiente (en el caso de la app de Diiki B2C, agregar en la claseBaseActivityBinder
):
Code Block |
---|
override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) { super.onActivityResult(requestCode, resultCode, data) if (requestCode == OVERLAY_PERMISSION_REQ_CODE) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { if (!Settings.canDrawOverlays(this)) { // SYSTEM_ALERT_WINDOW permission not granted } } } reactInstanceManager?.onActivityResult(this, requestCode, resultCode, data) } |
Agrega la siguiente configuración en tu activity launcher (algunas van dentro del método
onCreate
) (en el caso de la app de Diiki B2C, agregar en la claseBaseActivityBinder
):
Code Block |
---|
class MyReactActivity : Activity(), DefaultHardwareBackBtnHandler { private lateinit var reactRootView: ReactRootView private lateinit var reactInstanceManager: ReactInstanceManager override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) SoLoader.init(this, false) reactRootView = ReactRootView(this) val packages: List<ReactPackage> = PackageList(application).packages // Packages that cannot be autolinked yet can be added manually here, for example: // packages.add(MyReactNativePackage()) // Remember to include them in `settings.gradle` and `app/build.gradle` too. reactInstanceManager = ReactInstanceManager.builder() .setApplication(application) .setCurrentActivity(this) .setBundleAssetName("index.android.bundle") .setJSMainModulePath("index") .addPackages(packages) .setUseDeveloperSupport(BuildConfig.DEBUG) .setInitialLifecycleState(LifecycleState.RESUMED) .build() // The string here (e.g. "MyReactNativeApp") has to match // the string in AppRegistry.registerComponent() in index.js reactRootView?.startReactApplication(reactInstanceManager, "MyReactNativeApp", null) setContentView(reactRootView) } override fun invokeDefaultOnBackPressed() { super.onBackPressed() } } |
...
Agrega lo siguiente a tu activity launcher (en el caso de la app de Diiki B2C, agregar en la clase
BaseActivityBinder
):
Code Block |
---|
override fun onPause() { super.onPause() reactInstanceManager.onHostPause(this) } override fun onResume() { super.onResume() reactInstanceManager.onHostResume(this, this) } override fun onDestroy() { super.onDestroy() reactInstanceManager.onHostDestroy(this) reactRootView.unmountReactApplication() } override fun onBackPressed() { reactInstanceManager.onBackPressed() super.onBackPressed() } override fun onKeyUp(keyCode: Int, event: KeyEvent?): Boolean { if (keyCode == KeyEvent.KEYCODE_MENU && reactInstanceManager != null) { reactInstanceManager.showDevOptionsDialog() return true } return super.onKeyUp(keyCode, event) } |
...
Problema con consola de depuración Metro (React Native). No detecta los comandos “
reload (r)
", "open developer menu (d)
", da el siguiente error (ver imagen más abajo):No apps connected. Sending "reload" to all React Native apps failed. Make sure your app is running in the simulator or on a phone connected via USB
. Cabe mencionar que si detecta Metro al iniciar la app desde React Native (muestra una barra de progreso al compilar y ejecutar la app) pero esos comandos no los detecta. En la documentación oficial mencionan sobre agregar alAndroidManifest.xml
la propiedadandroid:usesCleartextTraffic="true"
para que Metro establezca esa comunicación con la app, esa propiedad se agregó pero el problema persiste.
...
...
SOLUCIÓN: Se “mueve” la lógica de integración Android del activity launcher (SplashActivity
) a la clase BaseActivityBinder
. Esta clase tiene el papel de ser la superclase o clase padre de la mayoría de las pantallas (activity) del proyecto B2C Android. Al hacer esta modificación y usar los comandos en la terminal de Metro “reload (r)
" y "open developer menu (d)
" se eliminó el error y ya muestra el menú en modo desarrollador (ver imagen abajo).
...
Referencias:
Integration with Existing Apps · React Native
...