Call JavaScript function from native in Titanium - titanium

How to call a JavaScript function from native Android module in Titanium. I want to register a JavaScript function in application view to listen for some events in native module and call back that function from native when that event happens.

The ModDevGuide by Appcelerator is a great place to learn how to do things like this. It's available here for both iOS and Android:
https://github.com/appcelerator/titanium_modules/tree/master/moddevguide/mobile
The "KrollDemoProxy" is what you want to look closer at.
On Android, the native side is here:
https://github.com/appcelerator/titanium_modules/blob/master/moddevguide/mobile/android/src/ti/moddevguide/KrollDemoProxy.java
On iOS, the native side is here:
https://github.com/appcelerator/titanium_modules/blob/master/moddevguide/mobile/ios/Classes/TiModdevguideKrollDemoProxy.m
And this is consumed by JavaScript like this, for both platforms:
https://github.com/appcelerator/titanium_modules/blob/master/moddevguide/mobile/android/example/demos/krollCallbacksAndEventsDemo.js
Search for the word "success" in those files, and you'll be able to figure out how it's firing that "success" event back to JavaScript-land.
Hope this helps.

Related

How to call react-native function from IOS native module(Plugins)

I want to call react-native function from native module.
I have created one barcode-scanner plugins for my react-native app, barcode-scanner SDK is available in native IOS & Android so, i extract those native code and create one plugins(NPM) for react-native app.
Now my problems is, Once barcode-scanner scan a data and send to native IOS, how can i get those scanning data in my react-native app ?(I got scanned data in IOS native)
I want to call react-native app function once native module scanned a data and send those data in react-native
Please give example or proper document so i can try and implement.
Thanks in advance.
You'll find your answer well described here:
https://facebook.github.io/react-native/docs/communication-ios#passing-properties-from-native-to-react-native
I have used "RCTDeviceEventEmitter" & "NativeEventEmitter" and add listener for received event
more detail

How can I do Signature Capture in React Native?

I'm trying to understand how I can do a signature capture in React Native. My App is created with create-react-native-app and Expo and I'd prefer to not have to eject the app to get this functionality to work.
Would it be possible to wrap something like this in a webview? https://github.com/szimek/signature_pad
I've also looked at this project, https://github.com/RepairShopr/react-native-signature-capture but it requires me to eject the app and use react-native link.
Looking for any advice or suggestions on how to implement this feature while keeping my project as straightforward as possible (ideally, using create-react-native-app, but if this isn't possible could someone please explain to me why?)
The way React Native works is that each component available in React Native maps to a native component in the underlying platform.
ie. a <Image /> is an ImageView in Android and a UIImageView.h in iOS.
The Javascript code itself runs in a Javascript thread on each platform and as you use Components in React Native, there's a translation layer that passes information from JS into the React Native bridge that then results in corresponding native components being created.
By default, React Native has included the following components: https://facebook.github.io/react-native/docs/components-and-apis.html#basic-components which means that only those components come out-of-the-box in React Native. If you want other components, then you have 2 options, either create a "composite" component in which your JS component is written into other JS components or, if your feature needs a native component not yet exposed by React Native, write your own "native" component to expose certain native functionality to your React Native code.
The way Expo works is that they have wrapped React Native and a handful of 3rd party components and built it within their application. The reason why you can't use a 3rd party native component they don't support is because when that component is used, the app itself doesn't have translation code to go from JS to a native Android/iOS view.
So, to do what you're asking, you'd need to find either a "native" drawing component that Expo has included in their platform/app. OR you need to find a "composite" drawing component that is built with other default React Native components (or other components Expo supports).
ie. On Android, I might build this with a Canvas view, but from what I can tell React Native doesn't support that object natively, so I would probably write this myself, etc.
It's hard for Expo to support every 3rd party "native" component out there because React Native is open source and it iterates so fast that most community-built components aren't always up to date or they might conflict with one another.
I am using react-native-signature-capture.
Working properly on both Android and iOS.
I know it's been a while, but there is an interesting article here: https://blog.expo.io/drawing-signatures-with-expo-25d1629ca1ac
Wait, but how?
Using “expo-pixi”, you can add a component that lets you choose your brush’s color, thickness, and opacity. Then when your user lifts her finger, you get a callback. From there you can take a screenshot of the transparent view or get the raw point data if that’s what you’re looking for.

How can I write to console.log from Java in React Native

I'm building a React Native native module (aka 'bridge') for iOS and Android and need to log to the JS console in native code (Objective C and Java). This is done easily in iOS using RCTLog but I can't figure out how to do it in Java.
I tried Log.i but those messages aren't forwarded to Javascript.
The only thing I can think of at this point is to emit a JS event from the Java module and have a handler on the JS side just call console.log with the message but that's a pretty roundabout way of doing it.
I would expect to be able to do something like this.getReactApplicationContext().log("see me in the JS console") but no dice. Anyone know how to do this?
It looks like as of upcoming react native 0.63 we may be getting the equivalent of iOS's RCTLog in Android: https://github.com/facebook/react-native/commit/52b3105f652eca72892f200923e1687f1d995486
The files are in master: https://github.com/facebook/react-native/tree/master/ReactAndroid/src/main/java/com/facebook/react/util
public void logEvent(String text) {
System.out.print(String.format("logEvent: %s ", text));
}
or just
System.out.print("Hello");

pass a javascript function onto native

Is it possible to pass a javascript function from React Native onto iOS Native components such as a UIButton and execute there?
It is possible, but using events and not by sending JS to native components. Check out react-native docs for detailed information, but generally:
React Native enables you to perform cross-language function calls. You
can execute custom native code from JS and vice versa. Unfortunately,
depending on the side we are working on, we achieve the same goal in
different ways. For native - we use events mechanism to schedule an
execution of a handler function in JS, while for React Native we
directly call methods exported by native modules.

AIR Native Extension for accessing native UI controls on IOS

Does anyone have a clear idea about or a sample of air native extension that helps me use alert view of apple touch devices.
I tried a lot for the same but ended up getting no success.
Thanks in advance.
I am not tried this library anyhow please try with NativeAlert.
(OR)
This for alternative for access native UI.
You can try with ios-theme-for-flex-mobile-projects link.
This link shows like iOS Alert view.
Please find mobiletheme_ios_usage.fxp link you can download that project then workout.You can see iOS alert view(Not Native UI).