CODEWITHSUNDEEP
javascriptandroidreact-nativewebview
Cole Mangio
Cole Mangio

Reputation: 79

WebView Local Html And Canvas?

So as for experiments, I was messing around with the WebView component and playing around with loading in local HTML files. Now what i want to figure out, is say i have a canvas element within my Local HTML file, and i'm rendering a game in the canvas. How do I communicate my React-Native code with the local HTML's canvas script? I've searched up how to communicate with HTML webview code and react-native and they say that WebView has a prop called injectedJavaScript that requires a string of code to execute to the webview. Check the docs here. https://facebook.github.io/react-native/docs/webview

But how on earth would I handle a game from the canvas code in this instance with just the injectJavaScript prop??? Is there another way of allowing communication between my react-native code and the local HTML/JS webview code???

Side note also check this website, which also enhances my explanation of what i want aswell. Although i'm still not sure how to properly do my game/canvas code with stringified js code... https://www.undefinednull.com/2015/12/27/injecting-custom-javascript-into-react-natives-webview/

Any of your guys's answers are worth so much too me right now, i've been trying to figure this thing out for a week now...

Upvotes: 0

Views: 348

Answers (1)

Rene Ferrari
Rene Ferrari

Reputation: 4216

For communication between Java or Kotlin code to Javascript in Android in a WebView the only way would be via the annotation @JavascriptInterface which basically provides the defined method to the JavaScript code.

You can also call functions defined in Javascript from your Java / Kotlin code. However, I would advise you to bind those functions to window. So you have a function in JS like: window.test().

There is also this great Article in the Android documentation which explains how to implement this.

Upvotes: 1

Related Questions