Jump to content

rotateScreen Question


Ninjadoodle
 Share

Recommended Posts

I took a dig through the code, too, and didn't spot anything like that kind of feature either.

I don't think you need a Panda function, though, you could maybe just use standard JS.

https://developer.mozilla.org/en-US/docs/Web/API/Screen/orientation

And there's also an onorientationchange event, which you'll probably want, and a lockOrientation if you want to force them to keep one orientation.

E.g. You could probably write it something like:

window.addEventListener('orientationchange', doOrientationStuff);

doOrientationStuff: function() {
    //check what the orientation is, and create pause graphics, or remove pause graphics.
}

 

Link to comment
Share on other sites

Hi @Wolfsbane

Thanks heaps for the tip! I followed your example and for some reason I can't get it to show anything but a black screen.

There is definitely a sprite being created when I change orientation, as I can't click the level sprites when changing back to portrait (if I make the message sprite interactive).

I do remember that Panda 1 had a specific setting / function for this and you just provided your own image.

Link to comment
Share on other sites

By default, Panda 2 will hide the canvas if user turns mobile device into "wrong" orientation. You can disable this by setting rotateScreen attribute in System to false.

game.config = {
    system: {
        rotateScreen: false
    }
};

There is also rotateScreenClass attribute that is name of CSS class that is set to the document body, when in wrong orientation and the canvas is hidden. This will allow you to show text or image to the user with some HTML/CSS code.

If you don't want to hide the canvas on wrong orientation, but do something else, then you will need to use the orientationchange event as suggested by @Wolfsbane

I would try something like this:

window.addEventListener('orientationchange', function() {
    if (game.scene && game.scene.orientationChange) game.scene.orientationChange();
});

Then create orientationChange function in your scene and use screen.orientation to detect the current orientation: https://developer.mozilla.org/en-US/docs/Web/API/Screen/orientation

On 9/16/2018 at 7:46 AM, Wolfsbane said:

and a lockOrientation if you want to force them to keep one orientation

AFAIK, there is no way to lock orientation in mobile browsers.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...