trowald's Recent Forum Activity

  • You do not have permission to view this post

  • I agree, this doesn't seem to be connected to Construct, but rather the webview itself. Thanks anyway! :)

  • {"type":"info","log":"Registered service worker on https://path-to-game"} {"type":"info","log":"Made with Construct 3, the game and app creator :: https://www.construct.net"} {"type":"info","log":"[C3 runtime] Hosted in DOM, rendering with WebGL 2 [Mali-G72] (standard compositing)"}

    Nothing unusual about the logging. No error messages.

    I've read something about it being an issue with Android webviews and webgl. I.e. this issue from scirra https://bugs.chromium.org/p/chromium/issues/detail?id=934823

    Can't really understand if it's fixed or not.

    Could that be the issue, that the webview in react native for android simply can't render the construct 3 game canvas?

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • I've now noticed that the game is actually loading and "playable". But it's just a blank screen with the background-color.

    I can also clarify:

    The game works on iPhone in development and build version. It also works on android in development. It's only when creating a binary of the android app that the bug appears.

  • I export the game as html5, extract it and host it on aws S3. Then I point my webview to the url of the index-file.

  • Hi,

    I have a react native app in which I've added a webview (react-native-webview@11.18.1). In developer mode everything worked fine, until a few days ago when I published the app to google play and testflight. Everything works fine on iOS, but on android the game doesn't show in the webview in build mode. Only the background color fills the screen, but no game is loaded. No error messages as far as I can tell.

    Anyone knows why this is and if there's any way to solve it?

    The game is created with construct 3 and exported as html5.

    Thanks,

    Jacob

  • Thank you Ashley!

    I've set up my domSide.js like this: 

    "use strict";
{
 const DOM_COMPONENT_ID = "test";
 const HANDLER_CLASS = class TestDOMHandler extends DOMHandler {
 constructor(iRuntime) {
 super(iRuntime, DOM_COMPONENT_ID);
 console.log("*** INFO *** domSide.js started");
 

	//Listen for highscore message
 window.addEventListener("message", (event) => {
 indata = JSON.parse(event.data);
 if (indata.highscore || indata.highscore === 0) {
 runtime.globalVars.HighScore = indata.highscore;
 }
 });
 
 _OnMessage(e) {
 globalThis.ReactNativeWebView.postMessage(
 JSON.stringify({
 type: e.callbackType,
 payload: e.payload,
 })
 );
 }
 };
 RuntimeInterface.AddDOMHandlerClass(HANDLER_CLASS);
}

    Now, in my c3Runtime/actions.js i would like to call the _OnMessage function. But I don't understand how to do that.

    actions.js example: 

    {
 self.C3.Plugins.Test.Acts = {
 CallDomSideFunction() {
 _OnMessage({callbackType: "testType", payload: "CALLBACK FROM CONSTRUCT"})
 },
 };
}

    Can you give me some guidence? I don't really understand the documentation.

    Thanks! :)

  • Hi,

    I usually have a script in my construct projects with an eventListener to be able to communicate with the host website. Looks like this: 

    	runOnStartup(async runtime =>
{	
	var indata = {}
	runtime.addEventListener("beforeprojectstart", () => OnBeforeProjectStart(runtime));
	window.addEventListener("message", (event) => {
	indata = JSON.parse(event.data);
	if (indata.highscore || indata.highscore === 0) {
		runtime.globalVars.HighScore = indata.highscore
	}
	}
	);
});

    In words: I listen for messages from the host website. If it sends a message with a highscore, I update the global highscore variable in the construct game.

    Since I use this so often, I figured I make a plugin for it instead. I'm new to addons so this is maybe the completely wrong approach, but my idea is to have it in the C3.SDKInstanceBase like this: 

    {
 self.C3.Plugins.COM_Connect.Instance = class COM_ConnectInstance extends (
 self.C3.SDKInstanceBase
 ) {
 constructor(inst, properties) {
 super(inst);

 var indata = {};

 console.log({ inst });
 window.addEventListener("message", (event) => {
 indata = JSON.parse(event.data);
 if (indata.highscore || indata.highscore === 0) {
 runtime.globalVars.HighScore = indata.highscore;
 }

 });
 }
 };

    The problem is that I can't access neither window or runtime.globalVars in here.

    So my questions are:

    1. Is this a bad approach?
    2. How do I access window?
    3. How do I access the global variables?

    Thanks!

trowald's avatar

trowald

Member since 14 Nov, 2021

None one is following trowald yet!

Trophy Case

  • 3-Year Club
  • RTFM Read the fabulous manual
  • Email Verified

Progress

5/44
How to earn trophies