How can I go back to native view controller from react-native page? - back

I wrapped a react-native page with a UIViewController, and pushed it with a navigation controller, but how can I pop to the native page using the react-native js code?

The simplest way would be to have a property that references your UIViewController on your AppDelegate and have a React Native Module method (RCT_EXPORT) that calls dismissViewController or presentViewController, based on your situation.
I would recommend reading this post discussing combining native iOS Views and React Native here: Leverage Existing iOS Views with React Native

Related

Lottie Splash Screen with Expo - animated splash screen with Expo

I am looking for a way to create an animated Splash Screen in React Native project using Expo.
I found Lottie as a solution, but the only info I can get about it is about the animations within the app itself - is there ANY possible solution that would allow a creation of an animated splash screen with Expo? For now, I have only a static png file.
There is an example provided in the Expo docs here:
https://github.com/expo/examples/tree/master/with-splash-screen
Although it's technically not an animated splash screen, but a way to automatically hide the static splash screen (which would be the first frame of your animation) and then immediately switch to playing the animation once the app is loaded. I'm doing it this way and it works well enough.
This NPM module seems to work in a similar fashion so maybe you could use that
https://www.npmjs.com/package/react-native-animated-splash-screen
But it's still not a native animated splash screen which I don't think is possible using even vanilla React Native let alone Expo.
Here I am using this module for custom animated splash screen using expo react native project. I hope it will work for you too.
Here is the module link: click here
Let me know if you need any other help.

How to render a UINavigationController instance in react native using react-navigation and react-native-screens?

I have a setup where I have bottom navigator created via createBottomTabNavigator, and each tab rendering a native stack navigator created via createNativeStackNavigator. Now I'm trying to merge another app in written in Swift UIkit.
That app uses UITabBarController to render tabs created via UINavigationController.
Is it possible, either at tab level or screen level to get those screens to render in React Native?
I tried exposing the UINavigationController stack via the NativeModules interface, but I'm not sure how to plug that into the JS bottom navigator.
Any help would be greatly appreciated.

Can i disable hardware overview button (a recent button) on a phone in react native?

I need disable a recent button. It is possible to implement this functionality when using react native?
About disable recent button when use react native i didn't find any thing. The difficulty is that my project uses expo, therefore i don't can use native modules Image for the button which must to be disabled
As I understand your question, you want to hide android navigation bar. There are 2 ways to achieve that:
Use React Native libraries: There are some libraries supporting you to hide navigation bar.
Hide Android Navigation Bar in React Native
How to hide React Native NavigationBar
How to hide android system' s bottom navigation bar in React Native App without changing MainActivity? Maybe through AndroidManifest?
Write a simple native module to do that: First, you need to read React Native document about Native Modules for Android. If you know how to use that, you can start searching: "android hide navigation bar". For example: How to hide navigation bar permanently in android activity?
In case you have any problems about creating native modules, just provide information about them.

Get how much of a page has loaded in WebView component in React Native

Is it possible to know how much of a web-page has loaded in a React Native WebView component? I want to show a loading progress for a page loading in my WebView.
Unfortunately there isn't an easy way to do what you ask with the react native web view, you need to implement a fake progress bar yourself.
However, you can use the react native wkwebview component (https://github.com/CRAlpha/react-native-wkwebview) that offers a handy onProgress method:
<WKWebView onProgress={(progress) => console.log(progress)} />
Note that this onProgress method only works on iOs.
I personally prefer using this component instead of the react native web view as it feels much faster and offers more useful methods.

How to access UINavigationController in react native?

I have created a View where the NavigationBar comes from Obj-c(Native code) and the rest of the view comes from React Native.
Now in the react native view, i have a link which should show the content in a new screen with the navigation experience. I am able to show the content but unable to find a way to change navBar title and show back button on the navBar.
Can you please let me know how we can get access to NavigationBar(Obj-c) in ReactNative?
I don't believe React Native supports this. You cannot take an object created in one language and access it in another. It would be a better idea to create your navigation bar in your JS and use it throughout your app. That even allows you to propagate that UI to your android apps.