Using 'Alt Enter' to toggle full screen when using Node Webkit

1

Stats

3,235 visits, 4,619 views

Tools

Translations

This tutorial hasn't been translated.

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 17 Oct, 2014. Last updated 19 Feb, 2019

When using Node Webkit the resulting game does not allow the user to toggle fullscreen using the traditional 'Alt + Enter' shortcut. In this tutorial I am going to show you how this functionality can be added back into your game.

Step 1: Add the Keyboard object to your project

Step 2: Add the browser object to your project

Step 3 (optional): If you want to open the application in fullscreen, add the following event to the event sheet associated with the opening layout.

Step 4: Add another Event sheet and open it. This means it can use it on all layouts in the project, without having to copy and paste the events. I am going to call the new Event sheet "altEnter"

Step 5: On the new event sheet add the following Event. This event will Exit fullscreen, only when in fullscreen.

Note: For me, when making the 'keyboard 'lt is down' condition, the key selector didn't recognise the Alt key. Using the 'ALT GR' button worked for me.(the user will be able to use the normal 'Alt' key.)

Step 6: Click on the event we just made to highlight it (Make sure you don't just highlight just one of the conditions) and then press 'x' on your keyboard to add an 'Else' event underneath.

Step 6.5: To the new event add the condition 'browser is full screen' then right-click it and press invert. this will now make sure the game is in windowed mode. Then add the action 'browser request fullscreen' Your event sheet should now look like this:

Step 7: Now we have to link the 'altEnter' event sheet to all layouts you want this to work on.

To do this, on every layout go to the associated event sheet and right click in the empty space under its events and click: 'Include event sheet' and then double-click on the 'altEnter' Event sheet.

Note: Some of you may have noticed a problem. When 'Alt+Enter' is being held, the game will flicker between fullscreen and windowed mode so quickly, it makes it impossible to use. There are probably a million different ways to tackle this issue. I am going to show 2 possible fixes. (I have tried using 'trigger once when true' but that didn't seem to help in any way)

Method 1:

In this method I only allow the user to Toggle between fullscreen and windowed mode every X seconds

To do this we will need to create a variable that prevents the toggle to occur too frequently. In the example below I allow the user to use 'Alt-Enter' every 2 seconds

This method is not perfect. If the user holds down 'Alt+Enter' the game will toggle between windowed mode and fullscreen every 2 seconds (or whatever you set the timer to).

Method 2:

This method will require the user to release both the alt and enter key in order for 'altEnter' to work again.

To do this I had to replace the 'else' condition into a 'keyboard Alt is down' and a 'keyboard Return is down' as when I pressed 'Alt+Tab' it would go into windowed mode, but upon release it would go back to fullscreen.

Exporting your project:

When exporting, make sure you select Window frame. This will not affect fullscrene, but in windowed mode you will have the standard windows boarder.

Fullscreen VS Windowed mode:

I hope this tutorial helps

Ityer :)

  • 0 Comments

Want to leave a comment? Login or Register an account!