I would like to get something like this game:
For desktop, the game displays in landscape orientation, but for phones in portrait orientation. Is the only solution to make two versions of the game ?
Nope. There are multiple things you can do:
- For the GUI system you can use different layouts, for instance one for landscape and one for portrait
- For the rest of your game content you can detect screen size changes using
window.set_listener(). This will give you a callback when for instance the screen size has changed. - You can also use
window.get_size()to get the size of the window at any time. - You should also decide on which render projection to use for the game to make sure the game renders properly when screen aspect ratio changes.
6 Likes
@britzl I am very sorry for you, but I have a problem with this topic.
- I was making myself two separate layouts - landscape and portrait
- I detect myself whether I have a desktop platform or a mobile version of the device
- But I don’t know how to switch between layouts i.e. for desktop to display landscape layout and for phone portrait
- I understand the following code that the message comes from the device but how to change lauout ?
function on_message(self, message_id, message, sender)
if message_id == hash("layout_changed") and message.id == hash("My Landscape") then
-- switching layout to landscape
elseif message_id == hash("layout_changed") and message.id == hash("My Portrait") then
-- switching layout to portrait
end
end
The layout changes automatically when you rotate the device or resize the window.
1 Like
There is no script support to change layout.
What is your use case for changing layout manually?
Isn’t the automatic layout changes enough?
1 Like
I will test, you may be right. Maybe it won’t be needed
@Mathias_Westerdahl
See this simple example I am sending.
I have two layouts. I would like landscape to appear on the desktop
and on the phone portrait. At the moment it always appears portrait to me.
test.zip (23.6 KB)
Have you checked Dynamic Rotation in game.project? If this property isn’t checked then the phone will be in either portrait or landscape mode depending on the game.project display width and height ratio.
Edit: And with the property checked the phone will rotate the display based on phone orientation. This will trigger layout changes in your gui.
1 Like
A quick way to test that it works is to launch your game on desktop and resize the window so that it is higher than it is wide (ie having a portrait mode aspect ratio)
1 Like
I did as you wrote. It works.
However, for the HTML version it doesn’t work. It always opens vertically
You mean when tested in a mobile browser? Yeah, that’s a different story because in html5 you have a <div> with a <canvas> of a particular size. Resizing the canvas on orientation change is not handled in the default index.html if I’m not mistaken. But it can be done with a bit of effort. You can for instance take a look at Monkey Mart, a Defold game released on Poki. Run it on your phone and rotate it and notice that the canvas is resized and adapted to the new aspect ratio:
@BunBunBun is the canvas resize done by Poki or are you using a custom index.html which does this?
Yes, I wrote at the beginning that it was about HTML versions and sent an example for the HTML version.
I want to display the version horizontally on the desktop and vertically on the phone.
I use the default code for the scaling in index.html. So the changing rotation on devices - this is checked on Poki side.
3 Likes
@BunBunBun I don’t know if I understood you correctly.
…“I use the default code for the scaling in index.html” … - i.e. the standard index.html file that Defold generates, yes ?
@BunBunBun are you able to write something more about it ? I am more interested in the game distribution platform.
You mean Poki? Poki is https://poki.com/ and there is an extension for their SDK here Defold - Poki Developer Guide
1 Like
https://gamedistribution.com/ and https://onlygames.io/ Each has its own SDK, but from what I’ve read it doesn’t include reorientation. That has to be prepared before uploading the game.
Besides, such a universal mechanism would be very useful under HTML games 
Yes, the code that’s going in index.html by default. To be honest, I don’t understand your problem.
In my practice, on web portals, publishers have the option of which orientation to choose for mobile browsers. and show an image/message if it’s not correct.
If you want to have own solution, just do as @britzl said, check the aspect ratio.
2 Likes