I'm done coding some core functionalities of an Android app, these had to be implemented in standard native Java code. Broadly speaking, it launches a Service and reads from a local DB with a SQLiteOpenHelper, but this last component will be replaced in the future for Bluetooth communication.
Now, I'd like to implement the UI using React Native; what's my best bet to combine native code with a UI made with React Native?
I have seen some options out there, but if there's any React Native expert familiarised with this, his/her tips and guidance would be of great help!
If it is just a service which you call occasionally then you create a react-native app, define your helper as a native module and call it from react-native.
It takes some time (and frustration so be prepared) to get going but after the first native module it will be quite straight forward. Here is a guide to implement a native (java) module in android.
Launching an activity is different story.
Related
Note: I am not asking how to detect if an app uses React Native somewhere inside it (already has an answer here).
I wonder which pages (screens) inside an app is using RN and which pages are not, by examining the apk file or runtime checks etc. For instance, the Facebook app uses RN. However, it only uses RN for some seldom-used pages - that is completely a different story than using in every page.
Thanks for any ideas!
For who are interested in this: Maybe try to examine the threads, since JS engine is in a separate thread (if I remember correctly). If the page is rendered via React Native (JavaScript), the JS thread must need some CPU.
(P.S. I switch to Flutter in the end, so I no longer look at React native samples.)
I have an application developed with ReactNative but now my client wants to get rid of it and go native in Android and iOS, I got the native code that RN generates for both but it is strongly tided to RN libraries, is it a good idea to continue like this and try to re-use the code or it's better to start over from zero with native code?
You could re-use some of your code, but I would advice against this. It'll be easier to rewrite the whole app (2 times) than to try to decouple your code from react native's library.
Although, couldn't you convince your client to stay with RN? The problem that RN fix is the need to write your app twice, if you go on this path you'll take twice the time to achieve the same result, and you'll encounter some problems hard to debug if you are not comfortable working with Android and iOS' custom frameworks.
I wrote my app using native method, currently I want to use reactive native in our further development to avoid writing two copies of code for iOS and Android.
The problem is we can't completely rewrite all the code, we want to replace the project piece by piece.
So I am wondering if I can write some views of my project using reactive native and others remain native code that we have used a long time.
If this is possible, is there any existing tutorial about how to do this?
You can keep your originally written native code via native modules. You can port your current project pieces by pieces to native modules, then let React-Native have access to it.
I guess best option is, start a new React-Native project and make it access your native modules, you won't have to rewrite everything then.
Here is more info for Android and iOS
There is official documentation to this. Checkout:
https://facebook.github.io/react-native/docs/integration-with-existing-apps.html
So here's the background story:The phonegap application is an online e-store has a plugin (which my team has created) to print receipts after the orders has been completed. All is working good but the printing is taking too long on Phonegap. In fact, it is taking 5-6 seconds per print, which is not good -- the client expects a much faster process of printing, somewhere down to 1-2 seconds.However, this is not possible using Phonegap, so I had to resort to using native applications. I created a native app with the help of a sample code. Eureka! The printing took only 1-2 seconds!On a side note, both Phonegap and the Native App are using the same Printer library -- the code for printing is entirely the same, just that the Native App's performance is better than Phonegap's.Here is where the problem lies:1. The third-party native app should ONLY run in the background (Hence Android Background Services)2. Phonegap should be able to pass the order data to this third-party native app's Android Background Service so that it will be able to print the receipt.So the question is: How do I do this?What I've currently tried is that I used a phonegap plugin (Link). It works, however, it opens the third-party app, which isn't good at all. I can close it immediately after it opens, but what the client wants is that it doesn't open up at all, to avoid confusion with their customers.Any help is greatly appreciated! If there are any clarifications on what needs to be done, please add comments. Thanks!
I fear that it is not possible to create a background service in cordova/phonegap but you can implement you supporting (Native)app with BroadcastReceiver or IntentService which(Runs in backgroun without UI) gets triggered by the (explicit)intent which you call from the cordova plugin.
More on < Service (Deep Guide), IntentServices, BroadcastReceiver > (Native) and invoking intent using cordova webIntent (plugin).
I guess this tutorial may help you.
Check this article explaining js to native code calling (or plugin development).
Create one test app, which will implement all steps explained in above article. Once implemented, you will get to know how js to native code call is executed.
Now, add printer library to your code (native wrapper), then add your code for printing (in one function, again in native code). Call this function from js. That's it.
How is native code generated in Titanium ?? I have read the documentaion on the internet and from it i can only understand the high level architecture but i need more details about the in depth working. For eg. when we create a button in Titanium using Ti.UI.createButton() how is this binded with native code and how do we get the same button as we get using native code.
Is UIButton object created and returned (talking only abt iOS) or the execution flow is different ? Also where should i look in the native code to for better understanding ?
First of all, how it works is different for each platform, so it is impossible to generalize effectively since the platforms are so specific.
For iOS Titanium uses native bridge wrapper objects called a KrollObject. These proxy objects form a bridge from a Javascript object to the native object in native code. For your UIButton use-case, the UIButton is created but is not returned to the Javascript, you control it through the Kroll bridge. (As a side note, Kroll is the process of refining the material titanium, punny).
Really you dont need to know the really intrinsic details of how it works to write modules, especially since it requires a huge amount of native platform knowledge (in which case theres no reason for you to use titanium).
Here is a great video on how it all works from the last Codestrong. If you really want to know how garbage collection and lifecycle of objects works study this video.