Ren'Py Where are mobile settings?

DarkLoki

Member
Game Developer
Oct 25, 2018
485
756
Sorry to have to ask and thank you in advance. I have been asked many times for a mobile version of my game and have successfully produced one EXCEPT the menu choice options in the game appear with a BLACK background when in the PC version (haven't tested on MAC) is WHITE. I know I've run across the mobile settings somewhere in some game code, but can't find it now that I need it. All Google results just say how to configure the SDK on android, not what I'm looking for. Any suggestions what to search for in my code? Again, Thanx in advance.
 

Turning Tricks

Rendering Fantasies
Game Developer
Apr 9, 2022
1,538
2,834
There's sections for Mobile devices in both your original screens.rpy and the gui.rpy files.

I think there's other mobile config variables scattered around as well, but basically anything to do with them are labeled "mobile" somewhere in their name. Do a word search for our project to find them.

Look in your screens.rpy and find the "Mobile Variants" section. I saw some textbox settings there for "small" - ie: phone.
 

peterppp

Erect Member
Donor
Mar 5, 2020
944
1,763
there are several "variants" that can be used for mobile, like mobile, small, touch, depending on the purpose
 

DarkLoki

Member
Game Developer
Oct 25, 2018
485
756
there are several "variants" that can be used for mobile, like mobile, small, touch, depending on the purpose
Thank you for the reply. I have searched the entire codebase for "android", "ios", "mobile" and "tablet", not case sensitive with no results for any of them. Am I searching for the wrong terms?
 

peterppp

Erect Member
Donor
Mar 5, 2020
944
1,763
Thank you for the reply. I have searched the entire codebase for "android", "ios", "mobile" and "tablet", not case sensitive with no results for any of them. Am I searching for the wrong terms?
as turning tricks said, there is a mobile section in game/screens.rpy called "mobile variants". other than that, i'm not the person to ask.
 
  • Like
Reactions: anne O'nymous

Spin256

Mothers and Daughters
Game Developer
Dec 16, 2019
617
1,189
I hear the TVA is good at dealing with variants, especially the Loki variety ;)
 

Spin256

Mothers and Daughters
Game Developer
Dec 16, 2019
617
1,189
Yes, just a bit of off-topic humor. I couldn't resist the responses about variants to Loki.
 

DarkLoki

Member
Game Developer
Oct 25, 2018
485
756
Don't get me wrong, I appreciate a little humor as much as the next guy. But I still haven't found a solution to my issue
 

Spin256

Mothers and Daughters
Game Developer
Dec 16, 2019
617
1,189
Have you changed the background image used for menu choices? That would be under 'game/gui'. There could be separate images under 'game/gui/phone' for android.
You could also try setting the background in code.

Code:
init python:
    if renpy.android:
        style.menu.background = "#FFFFFF"
 

79flavors

Well-Known Member
Respected User
Jun 14, 2018
1,631
2,291
Don't get me wrong, I appreciate a little humor as much as the next guy. But I still haven't found a solution to my issue

Keep in mind there aren't any mobile settings, as such.

What you have instead are the variants people have talked about. large, medium, small, pc, ios, android to name but a few.
Full list : (as peterppp) already stated.

They are not exclusive. Each is set if their criteria is met. For example, a Windows computer would likely be large AND pc. A phone might be small and android and phone, whereas a tablet might be medium and android and tablet.

These aren't settings. For your purposes, they are static values. You have no control of when or how they are set.

They are used to control which screens or values of variables are used by your script.

Perhaps you have a screen called hello_world (borrowed and simplified from the documentation).


Normally, it might be coded like:

Python:
screen hello_world():
     text "Hello, World."

The screen would display "Hello, World." using the default text size.

However, because a phone screen is much smaller - perhaps you'd want to print the same text bigger. Or perhaps move it around because once the text is bigger it overlaps with the text next to it. This is where variants come in.

Instead it might be coded like:

Python:
screen hello_world():
    text "Hello, World."

screen hello_world():
    variant "small"
    text "Hello, World." size 45

In this case, you effectively have two screens, both called hello_world. The first one is used most of the time. It is effectively the default screen used... UNLESS the "small" variant is true. In that case, the second definition for the screen is used.

It is always advisable to have one definition of the screen without a variant statement, so it becomes the default. I remember one person who'd coded a large version and a small version of a screen - then couldn't understand why things crashed when played on a tablet. Because there was no default and no medium - there effectively wasn't a screen to display. It would be normal to have the large/pc version as your default and only code overrides for small and/or medium.


You'll also see it impact the screen language definitions directly too.

For example, a phone screen being so small means that there isn't enough screen space to fit everything. Compromises need to be made.
You'll find these lines in most games, within the screens.rpy file.

Python:
    ## If there's a side image, display it above the text. Do not display on the
    ## phone variant - there's no room.
    if not renpy.variant("small"):
        add SideImage() xalign 0.0 yalign 1.0

This code basically says "side images won't be shown on small devices, where there isn't room to display them".
Even though side images are automatically scaled according to the resolution they are shown on, these images take up valuable screen space better used by something else (like the larger dialogue text).

Likewise, most advice on iOS and Android is to let the operating system handle quitting the game and not include a [QUIT] button. Also offering help about pressing "H" to hide the overlay and other keybindings doesn't really offer any help to a phone or tablet user.
So you'll find these lines too:

Python:
        if renpy.variant("pc") or (renpy.variant("web") and not renpy.variant("mobile")):
            ## Help isn't necessary or relevant to mobile devices.
            textbutton _("Help") action ShowMenu("help")

        if renpy.variant("pc"):
            ## The quit button is banned on iOS and unnecessary on Android and Web.
            textbutton _("Quit") action Quit(confirm=not main_menu)

Finally, you have the gui.rpy overrides.

Similar to the if renpy.variant("pc") type checks, the gui.rpy file usually has a section right at the end which changes the game's default GUI layout/sizing/images based on device type.

While not coded this way, its easy to think of it like:

Python:
## The size of normal dialogue text.
define gui.text_size = 22

if renpy.variant("small"):
    define gui.text_size = 30

The actual block starts more like this:

Python:
################################################################################
## Mobile devices
################################################################################

init python:

    @gui.variant
    def small():

        ## Font sizes.
        gui.text_size = 30
        # ....

All of which is just the explanation for how RenPy deals with this sort of stuff.

In your case, if I had to guess, your game has a variant "small" version of screen game_menu() which doesn't include a background image. Or your screen game_menu() has some if renpy.variant() checks related to which background to use.

There's an outside chance that the define gui.game_menu_background = "..." has been overridden somewhere too, that would affect your background image.
 
Last edited:

osanaiko

Engaged Member
Modder
Jul 4, 2017
2,822
5,284
Fascinating!

But.... Small? medium? iOs? what are these strange things....

Only sad poor people game on phones. they turn to drinking to handle their sadness and PC envy...


Caption: True picture of sad phone gamer.
1742897358015.jpeg
 

anne O'nymous

I'm not grumpy, I'm just coded that way.
Modder
Donor
Respected User
Jun 10, 2017
11,492
17,578
But.... Small? medium? iOs? what are these strange things....
An attempt to be as flexible as possible that end being more confusing than anything else.

Theoretically, it's a good idea, "small" screen and "medium" screens obviously don't offer the same surface and therefore can't have the same interface. But when you look at , it give you a headache. There's 16 of them (17 is you count the default one), and there definition isn't always really clear:
"medium
A screen where smallish text can be read, but buttons may need to grow in size so they can be comfortably pressed. This is used for tablets."

This while even diving into the code don't necessarily help you understand when and why a variant is defined.
 

79flavors

Well-Known Member
Respected User
Jun 14, 2018
1,631
2,291
Don't get me wrong, I appreciate a little humor as much as the next guy. But I still haven't found a solution to my issue

Another thing just occurred to me.

When RenPy doesn't have a background image, it displays a placeholder image instead.
When in developer mode, that placeholder image is a white background with a faint checkerboard on it.
The rest the time, it is black.

While you are developing using the SDK, developer mode is switched on for you automatically. So any play testing you do, will show a largely white checkerboard if no other image is shown.
But when you build a game for distribution, developer mode isn't included. So normal players see black. (Some developers force developer mode on, but that is usually accidental).

99.9% of the time a player will never see either black or the checkerboard, since a custom background image will always be shown instead.

I'm wondering if the game menu is missing it's background image, and RenPy is using the placeholder background instead. The result being that the mobile version of your game is a normal "built" game (black background) and your impression of the PC/Mac version is when you are still using the SDK (White/Checkerboard).
 
  • Like
Reactions: osanaiko

79flavors

Well-Known Member
Respected User
Jun 14, 2018
1,631
2,291
Okay. Problem found.

I'd overlooked styles in my explanation. Which link into the screens which I did explain.

Looking at Dawl Play... You have...

Python:
# --- screens.rpy ---

# ...

style game_menu_outer_frame:
    bottom_padding 45
    top_padding 180

    background "gui/overlay/game_menu.png"

# ...

style game_menu_outer_frame:
    variant "small"
    background "gui/phone/overlay/game_menu.png"

# ...

That's fine. The small variant doesn't need the padding and has decided to use a different set of files stored in /gui/phone/overlay instead of the default of gui/overlay.

But this is your problem.

The gui/overlay/game_menu.png is a transparent PNG file that is mostly gray. I'd guess around 20-30% transparency.

The gui/phone/overlay/game_menu.png is a transparent PNG file that is mostly black, with a blue line through it. I'd guess around 70-80% transparency.

To my mind, you've probably changed the default game_menu.png at some point, but left the /phone/ version of it alone.

So a phone's background will be "almost" black and a pc's background will be largely transparent.

Fix...
Either copy the game_menu.png from gui/overlay/ to gui/phone/overlay. Or change the style of the small variant to point to the /gui/overlay file instead.

By the way, I tested it by adding these two line to the top of your script...
Python:
init -1 python:
    config.variants = ['small', 'phone', 'android', 'touch', None]
Basically making the game think it was running on a phone.
YOU SHOULD NEVER LEAVE CODE LIKE THIS IS YOUR GAME. Add it, test it, then remove it.
 
  • Like
Reactions: anne O'nymous

DarkLoki

Member
Game Developer
Oct 25, 2018
485
756
Wow, thanx for the replies. It's gonna take me a few days to get my head around these, but I'll let you know what I find (maybe help someone else going forward?)
 

Turning Tricks

Rendering Fantasies
Game Developer
Apr 9, 2022
1,538
2,834
It's a lot easier when you design a website and the free WordPress template handles all the various devices formatting automatically :ROFLMAO: