Simple Bridge from React Native main app from swift - ios

Trying to bubble a function I made in Swift file to the main App.tsx
HelloWorld.swift
#objc(HelloWorldModule)
class HelloWorldModule: NSObject {
#objc
func ShowMessage()->Void
{
print("hello world")
}
}
HelloWorld.m
#import <React/RCTBridgeModule.h>
#interface RCT_EXTERN_MODULE(HelloWorldModule, NSObject)
RCT_EXTERN_METHOD(ShowMessage)
#end
App.tsx. -- the main app from react native
import React, { useEffect, useRef, useState } from 'react';
import { Alert, Button, Image, NativeModules } from 'react-native';
import styled from 'styled-components/native';
console.log(NativeModules.HelloWorldModule);
NativeModules.HelloWorldModule.ShowMessage();
Goal:
Trying to get the terminal log to output "hello world" from App.tsx
Actual Output:
LOG {"ShowMessage": [Function nonPromiseMethodWrapper], "getConstants": [Function anonymous]}
WARN Module HelloWorldModule requires main queue setup since it overrides `init` but doesn't
implement `requiresMainQueueSetup`. In a future release React Native will default to initializing
all native modules on a background thread unless explicitly opted-out of.

Related

libc++abi.dylib: terminating with uncaught exception of type NSException, React Native iOS

Issue Description::
I am working on react-native-ios app, most of the times it stuck after splash. I have created a duplicate splash screen inside my react native code. When app started I am redirecting it to dummy splash screen which is exactly like a splash. Here I am loading complete required data of app from API. After loading complete data I am pushing it initial screen.
But most of the time my stuck after splash screen, or sometimes crash after loading splash(when moving from original splash to dummy splash screen where I am loading whole app required data).
There is no error inside terminal, I am getting this following mentioned error inside xcode output window, whenever my app crashed or when app stuck on splash screen.
Error::
Terminating app due to uncaught exception
'NSInternalInconsistencyException', reason: 'Application windows are
expected to have a root view controller at the end of application
launch'
libc++abi.dylib: terminating with uncaught exception of type
NSException
My iOS app working working fine if I am redirecting to login screen, but having issue whenever i am redirecting to dummy splash. I have also changes my dummy screen name to "initializer.js" but nothing happened. iOS app crashed or stuck after splash it redirecting it to screen where i am loading complete required data for app.
App Intializer Screen Code(dummy splash)::
/**
* Splash Screen
*/
import React, { useEffect } from 'react';
import { connect } from 'react-redux';
import * as Animatable from 'react-native-animatable';
import { View, Text } from 'react-native';
import { Spinner } from 'native-base';
import Toast from 'react-native-simple-toast';
import NetInfo from '#react-native-community/netinfo';
import SplashScreen from 'react-native-splash-screen';
import AsyncStorage from '#react-native-community/async-storage';
//Global Components
import { ImageView } from '../../Components/GlobalComponent';
//Form Components
import { Button } from '../../Components/FormComponent';
// APIResponseMessages
import APIResponseMessages from '../../Constants/APIResponseMessages';
// Actions
import { appInitialize, loader } from '../../Actions';
//Style
import { GlobalStyles, Colors } from '../../Styles';
//Images
import Images from '../../Assets/Images';
//Navigation Screen
import { AUTH, INITIAL_SCREEN, setRootScreen } from '../../Navigation';
import LocalStorageKeys from '../../Constants/LocalStorageKeys';
// singleton class
import APIURLServiceSingleton from '../../Services/APIURLService';
// Strings
import { en } from '../../Strings';
//Base Controller
import BaseController from '../BaseController';
const { overlayContainer, flex1, w100, mb30, h100, justifyContentCenter, alignItemsCenter, mb20, px20, px10, textWhite, textCenter } = GlobalStyles;
class Splash extends BaseController {
state = {
showTryButton: false,
};
isConnected = false;
/*
* lifecycle method called when component mount
*/
componentDidMount() {
NetInfo.isConnected.addEventListener('connectionChange', this._handleConnectionChange);
// hide splash screen
setTimeout(() => {
SplashScreen.hide();
NetInfo.isConnected.fetch().done((isConnected) => {
this._handleConnectionChange(isConnected);
this.initializeApp();
});
}, 1000);
}
/**
* Function to initialize Application
*/
async initializeApp() {
if (this.isConnected) {
//...... connection code here
} else {
Toast.showWithGravity('Please check your internet connection and try again.', Toast.LONG, Toast.CENTER);
}
}
/*
* lifecycle method called when component unmount
*/
componentWillUnmount() {
NetInfo.isConnected.removeEventListener('connectionChange', this._handleConnectionChange);
}
/**
* Function to handle connection change
*/
_handleConnectionChange = (isConnected) => {
if (isConnected) {
this.isConnected = isConnected;
} else {
this.isConnected = isConnected;
this.setState({ showTryButton: true });
}
};
/**
* Function called on try again
*/
async onTryAgain() {
if (this.isConnected) {
this.setState({ showTryButton: false });
}
await this.initializeApp();
}
// render method
render() {
const { showTryButton } = this.state;
const { serverError } = this.props;
return (
<View style={[flex1]}>
<ImageView style={[overlayContainer, w100, h100]} resizeMode="cover" source={Images.splash} />
{..... my other code here}
</View>
);
}
}
export default connect(null, { appInitialize, loader })(Splash);
My AppDelegate.m file::
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
#import "AppDelegate.h"
#import <React/RCTBridge.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import <ReactNativeNavigation/ReactNativeNavigation.h>
#import "RNSplashScreen.h"
#implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:#"index" fallbackResource:nil];
[ReactNativeNavigation bootstrap:jsCodeLocation launchOptions:launchOptions];
[RNSplashScreen show];
return YES;
}
#end
Environment Description::
"react-native": "0.61.4"
"react": "16.12.0"
"react-native-navigation": "3.5.1"
"react-native-splash-screen": "3.2.0"
xcode: 11.2.1
From the crash message, it seems you forgot to set the root view controller for the current window.
Also, as you mentioned, it is fine if it redirects to Login page. Checking the code, I saw that setRootScreen(AUTH, INITIAL_SCREEN) is only called once the user need to login. My assumption is, you might need to set the root screen once the user logged in successful as well?
If it doesn't work, then you should check how you redirect to the splash view controller. Is the react native view embedded inside another native view controller? We might need to see your native code here to troubleshoot if it doesn't work neither.
You can refer to this article to understand more about the communication.
Hope it helps.

React Native "imports"

I am trying to develop a react-native book-searching app and have found this online as a helper tool: https://www.appcoda.com/react-native-introduction/
However, the site is from 2015, so some of the syntax is not properly updated.
I've run into the following issue:
The code that they tell me to use is as follows:
'use strict';
var React = require('react-native');
var Books = require('./Books');
var Search = require('./Search');
var {
AppRegistry,
TabBarIOS,
Component
} = React;
When I used that, I arrived at an Error Message telling me to use
import React, { Component } from 'react';
instead of
import React from 'react-native';
In my attempt to update it to the latest version of React, I arrived at:
'use strict';
import React, { Component } from 'react';
var Books = require('./Books');
var Search = require('./Search');
var {
AppRegistry,
TabBarIOS
} = React;
This is still causing multiple errors. Can someone explain how to properly do what I am trying to do?
You're trying to import AppRegistry and TabBarIOS from React instead of react-native and some syntax errors. Change:
var {
AppRegistry,
TabBarIOS
} = React;
to
import {
AppRegistry,
TabBarIOS
} from 'react-native';

Warning: Native component for "<component>" does not exist

My project is giving this warning, which I found after trying to debug why my native view component was no longer showing. This is something that has been working previously, however, the Xcode project has been rebuilt recently. I'm using CocoaPods to integrate RN in my app.
I'm wondering if something has changed or if I have correct versions in my package.json:
"react": "^0.14.8",
"react-native": "^0.22.0",
The code accessing the custom native component:
import React from 'react-native'
var {
View,
StyleSheet,
NavigatorIOS,
Component,
Text,
requireNativeComponent,
} = React;
class JuceComponent extends Component {
render() {
return <ReactJuceView {...this.props} />;
}
}
JuceComponent.propTypes = {
// props to send to Juce Component
}
var ReactJuceView = requireNativeComponent('ReactJuceView', JuceComponent);

Why is session.paired unavailable?

In an iOS app, I've created a swift file named DataCoordinator with the following code:
import UIKit
import WatchConnectivity
class DataCoordinator: NSObject {
func test(session:WCSession!) {
if session.paired == true {
//...
}
}
}
When I try to build, I get this error:
'paired' is unavailable
'paired' has been explicitly marked unavailable here
This is in the iOS app and not the in the WatchOS app. It works fine if I use the above code in a ViewController class.

Flare3D FlashBuilder Mobile Error

package
{
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;
import flare.basic.Scene3D;
import flare.basic.Viewer3D;
import flare.core.Pivot3D;
import flare.basic.Scene3D;
import flare.basic.Viewer3D;
import flare.core.Pivot3D;
[SWF(frameRate = 60, width = 800, height = 450, backgroundColor = 0x000000)]
/**
* Starting the project.
*/
public class MyFirstApp extends Sprite
{
private var scene:Scene3D;
private var planet:Pivot3D;
private var astronaut:Pivot3D;
public function MyFirstApp()
{
trace("Hello Flare3D");
}
}
}
I am trying to get Flare3D to work in an ActionScript Mobile Project in Flash Builder.When I run the project I am recieving an error message that says ... " VerifyError: Error #1014: Class mx.core::ByteArrayAsset could not be found. " All I have in this code is three Vairables, I have removed all other code and still I recieve this message. I have added Flare3D into the ActionScript BulderPath. My Goal is to take the Yellow Planet Tutorial and run it on iOS Air Simulator. http://www.flare3d.com/demos/yellowplanet/.... If I dont include the 3 variables I get the trace statement to execute with no error message. How does adding three variable cause this error, or rather what am I overlooking here?
Fixed error mx.core::ByteArrayAsset by adding the Flex SDK into my Actionscript Mobile project. By using Scene3D this must be linked to the project.

Resources