Screen Pinning Plugin

Screen pinning is a great feature that would help a lot considering we still don’t have a way to control the back button. I’ve been trying my best to figure out a way to do it myself using js, but being severely code-challenged, my efforts are creating very little results.

I recently found a cordova plugin that I think offers screen pinning, I’ve been sitting almost endlessly trying to figure out how to incorporate this. Struggling very bad. Can someone please help?

Here’s the link to the plugin: GitHub - fedme/cordova-plugin-screen-pinning: Cordova plugin exposing Android's screen pinning APIs

Cordova plugin that exposes screen pinning APIs on Android (API 21+).

Acutally GDevelop we use a old version of this API. We need update this before. I guess it’s problematic for export with cordova.

For make cordova package you have this step-by-step :
http://wiki.compilgames.net/doku.php/gdevelop5/publishing/android_and_ios_with_cordova#compiling_into_a_cordova_app

Be sure to include the plugin for add it. the instructions on wiki and on github should be enough.

do we have an update on the card?

I really need some help for this… I followed the link and exported to Cordova… But how do I include this into the package… ?

I’ve never used Cordova for build my own app, i don’t know more :confused:

No worries Bouh… :slight_smile:

I think I’ll just share what I’m trying here… it might make it easier for somebody to help…

So I made a simple GDevelop File with 2 scenes - each scene having a text-sprite. Clicking/tapping the text sprite in the first scene takes you to the second scene and clicking/tapping the text-sprite on the second scene takes you to the first.

My aim: When going from scene 1 to scene 2 activate screen-pinning and deactivate it when going back.

As mentioned, the plugin I’m trying to incorporate - https://github.com/fedme/cordova-plugin-screen-pinning

I export the file using the ‘Manual’ option into a separate folder.
In the folder there is:

  • a folder named www
  • a file called config

I then build the app using build.phonegap.com, and check it on the phone. It works. It goes from one screen to another and back to the first screen on tapping the respective text.

Then in the node.js command prompt, while inside the project folder, I type the command
: cordova plugin add cordova-plugin-screen-pinning.
Now in the folder there is:

  • a folder named node_modules
  • a folder named plugins
  • a folder named www
  • a file named config
  • a JSON file named package-lock

Then going through files in folder www, I realise that files code0 and code1 are linked to scene 1 and scene 2… And going through all the code (in notepad, most of which I don’t understand), I decide to replace - in the code0 file

if (gdjs.Scene1Code.condition1IsTrue_0.val)
{{
gdjs.evtTools.runtimeScene.replaceScene(runtimeScene, “Scene2”, true);
}}

with

if (gdjs.Scene1Code.condition1IsTrue_0.val)
{{

cordova.plugins.screenPinning.enterPinnedMode(
function () {
console.log(“Pinned mode activated!”);
},
function (errorMessage) {
console.log(“Error activating pinned mode:”, errorMessage);
}
);

gdjs.evtTools.runtimeScene.replaceScene(runtimeScene, “Scene2”, true);
}}

and similarly in code1 file, I add the example code provided for deactivating screen-plugin.

I then, once again build the file using the online build service and install the app on my phone. But now tapping the text on screen does nothing. The screen is neither pinned, nor does the scene change.

I know what I’m doing is probably rubbish… But please be patient with me… Somebody help… If it’s not too much to ask for @4ian - can you lend a hand…

Regards,

Dan

1 Like

If you want to use a Cordova plugin, you have to 1) add some JavaScript code that is using the plugin in your events, 2) export to cordova, 3) Add the Cordova plugin and 4) compile by yourself using Cordova as explained here: http://wiki.compilgames.net/doku.php/gdevelop5/publishing/android_and_ios_with_cordova#compiling_into_a_cordova_app

For 1), add a JS event with the javascript code that you want. Most probably something written in the README: https://www.npmjs.com/package/cordova-plugin-screen-pinning#enterpinnedmode

For 2), export to Cordova from GDevelop.

For 3) Before building with Cordova to an app, you have to install the plugin as explained on the plugin README page: cordova-plugin-screen-pinning - npm

Basically, do “cordova plugin add cordova-plugin-screen-pinning”

For 4), launch “cordova build android” or “cordova build ios”

Note that there are tons of Cordova plugins. I can’t support all of them in GDevelop - I have more than enough work supporting GDevelop ecosystem. Any help at creating an extension for GDevelop and maintaining it is welcome, but you’ll have to explore and try to make the plugin work by yourself - unless this become something asked by tons of people (I have to prioritize things).

1 Like

Thank you for the reply @4ian