Free Portrait mode GUI template

[Imperf3kt]

This project has been strewn about the forum in various forms, and its rather often requested so I thought it was time to properly present it.

So I hereby present to you, the completely free (no strings attached) Ren'Py Portrait Mode GUI (Its really free!). No attribution required.
Download it here:

Current version

v1.31 - Optimisation update

Old versions

v1.30 - Screens rework/bug fixes

v1.29 - imagebutton rework

v1.28 - Changelog addition

v1.27 - Resolution upgrade

v1.25 - Quick menu upgrade

v1.20

v1.10

v1.03

v1.02

v1.01

v1.0


The file is a 7zip compressed archive.
Simply extract it into your projects folder and edit it like your regular projects. It is designed for use with an Android smartphone, so I cannot guarantee suitability/compatibility for iOS devices, although it should work fine.
Resolution is 720x1280

Included with the GUI is a short sample of dialogue in both ADV mode and NVL mode to give you an idea of how a game will look and feel. This also serves as an example of how to structure your game and use the vibration function.
The assets used for this sample are all free to use and redistribute or edit/modify, no attribution required.
Edgy-tan is freely provided by Uncle Mugen. Thanks Uncle Mugen!
The Ren'Py Logo belongs to Tom "PyTom" Rothamel.

SAMPLES




Note: all samples taken from version 1.10

There is also a tooltip section in the settings menu that displays information when a player holds their finger on a button.

Important:
You may wish to review the following lines in options.txt

Code: Select all

## line 135 - 145
## If true, hardware video playback will be used on mobile platforms.
## This is faster, but only some formats are supported and only fullscreen video is available.
## If false, software playback will be used, but it may be too slow to be useful.

define config.hw_video = True

## If true, the mobile app will save its state when it loses focus.
## The state is saved in a way that allows it to be automatically loaded
## (and the game to resume its place) when the app starts again.

define config.save_on_mobile_background = False

Additionally, you should probably change this line to avoid potential conflicts with other games using this GUI

Code: Select all

## line 162
define config.save_directory = "AndroidGUI-1536233790"

[Scribbles]

oh this is really handy! Thank you for making this

[Imperf3kt]

Thanks for the kind words.
I've noticed a couple of things that require attention.

Android icon is missing
Size of sliders in preference menu are mismatched compared to slider thumb
The character name is slightly cut off in the history screen
NVL mode requires attention, especially with regards to the quick menu, notify screen and skip indicator
define config.save_on_mobile_background should be True by default

I'll update everything later today (currently 8AM)

[Imperf3kt]

The GUI has been updated.

Changes include:
- Reduced file size from 1.18MB to 1.12MB
- Minor changes to ensure iOS devices should behave the same as Android
(I am unable to test this)
- Added Android Icon and Android splashscreen
- Fixed slider size discrepancy
- Set define config.save_on_mobile_background to True by default
- Defaulted music, sfx and voice volumes to 100%
(Volume control is not necessary as the device controls the volume level. Allowing Players to adjust volumes separately is still possible by adding the appropriate sliders from a default GUI)
- Added gesture control, While in-game, swiping from left to right will perform a rollback, while swiping from right to left, will perform a roll forward.
- Added various config options (see options.txt)

Still to fix:
The character name is slightly cut off in the history screen
NVL mode requires attention, especially with regards to the quick menu, notify screen and skip indicator


v1.01 can be downloaded here

[trajano]

I kinda like the "quick bar" on top that you had. I think that'd be better plus if it gets covered by the "notch" it isn't as much issue. I'm thinking of making the same adjustment on my template

[Imperf3kt]

It's still there, it's just limited to the Android version.
In the screens.rpy file you'll see the quick menu has two sections, one is given a "variant" of 'touch', that's the one that looks like it does in the screenshots.

If you wish to copy it for a PC version, simply delete the first quick_menu screen and remove the variant line from the second.



I've just now noticed that I've not provided access to auto forward mode.
I'll look into this.

Im also planning to add different versions, such an an imagebutton version so people need only swap in their own graphics.

[trajano]

Curious, how'd you get the save games to be in "portrait" It looks stretched when I do it.

UPDATE: found it

## The width and height of thumbnails used by the save slots.
define config.thumbnail_width = 99
define config.thumbnail_height = 176

[xxmissarichanxx]

oh hey! this is pretty neat! i was thinking of doing something like this myself. thank you so much for sharing! Cx

[ComputerArt.Club]

Wow! This is beautiful! Always a fan of your work and contributions! Well done!

[Imperf3kt]

A button for auto mode has been added to the quick menu with minimal change to the layout.
Additionally, I removed the "PC" version of the quick menu for simplicity.
If you happened to like it, its still in the files, simply uncomment the related lines and change line 193 of gui.rpy to define gui.quick_button_text_size = 20

You can also choose where to align the quick menu by simply uncommenting line 277 of screens.rpy - if commented, the quick menu aligns to the top of the screen, if uncommented, it aligns with the top of the textbox.


The cut off name in the history screen has been resolved. This was due to an oversight on my part and poor alignment.
Additional fixes include minor padding adjustments for a cleaner overall look.

NVL mode has been overhauled.
I won't list the changes, but they were many. NVL mode is now much better looking.

There have also been general fixes to the positioning of notifiers (skip, notify)


Many more fixes and updates are planned.

This brings the gui to v1.02 and takes care of all known bugs and issues.
Additionally, filesize has been further reduced to 1.10MB - a last minute edit took us back to 1.12MB
Download:
https://mega.nz/#!gU91wSCI!iSkFvRBN3uPi ... 9B0v_V1A54

Wow! This is beautiful! Always a fan of your work and contributions! Well done!

Thanks!
To be honest, I enjoy fiddling with the gui more than I like actually making games with Ren'Py

[Imperf3kt]

There's gonna be a few updates for this rolled out as I complete them, so I apologise for the frequency of posts. They should slow down soon.

If you have any features you think I should add or modify, feel free to make a request, I'll consider all reasonable requests.

I added a help menu. Keyboard and mouse were left in as Android devices support keyboards and mice, even if seldom used.
(note to self, remove self-voicing from keyboard controls as the feature is currently unsupported on Android)

The "Touch" menu only shows when on a device with touch, based on
https://www.renpy.org/doc/html/screens. ... n-variants
Note that not all touch enabled devices appear to work with this (My laptop, for example), but all Android devices should work with this.


Download it here:
v1.03

[Imperf3kt]

Found a bug in the previous update where the "keyboard" and "mouse" screens were not accessible because I disrespected how screens work.
Basically, I changed the "device" screen variable based on the output of renpy.variant - within a screen, causing the game to constantly assign that variable, so clicking on a button worked but then the screen would redraw itself, immediately changing the variable back to "touch", no matter what a player had touched/clicked.

Also amended the keyboard entry to remove functions not currently available to Android, when on an Android device.

I have added a second layout style loosely based on another Ren'Py Android game I recently encountered.
To use this style, simply comment out / uncomment the appropriate lines in screens.rpy

Comment out lines 329-353, 415-448, uncomment lines 355-396, 451-495

The game menu is animated to slide in and out from the left.

The "close" button can be replaced with a typical ≡ in the top-right corner of the frame by commenting out lines 394-396 and uncommenting lines 402-406


To use the original style, comment out lines 355-396, 451-495, uncomment lines 329-353, 415-448

Download it here:
v1.10
Or check it out on Google Play!
https://play.google.com/store/apps/deta ... mp.and.gui

[epistellar]

Just wanted to say that this is a godsend!

I've been looking for a mobile-first template for a next game and this is an incredible help. Thanks so much!

[Imperf3kt]

Just wanted to say that this is a godsend!

I've been looking for a mobile-first template for a next game and this is an incredible help. Thanks so much!

Glad to see it helped

I have a few planned updates eventually coming that should make a few improvements.
When, is unknown at this time as I'm currently massively overworked

Off the top of my head, I wanted to increase the resolution to 1080*1920 (in addition to the 720*1280 option) and a few general tidy ups of the code, including decluttering the two styles available. They are a bit of a mess right now, or at least, not as beginner friendly as this was intended to be.
Also planned is an upgrade to the history screen that allows menu choices to be displayed, so a player can see how they got where they are.

There will also be a large overhaul of the settings screen, I've made some good updates to it that make it look less out of place and fit better with the visual aesthetic.

Following that, I'll add some optional extra screens, such as an image gallery, sound library, and other generally common Visual Novel stuff.

Eventually I want this project to be fully configurable by a simple WYSIWYG interface, but that's a different project.


Suggestions for improvements are welcomed.

[epistellar]

Oof, apologies for the delay, but your planned updates sound fantastic! Thanks so much for taking the time to write them out. I'm in the midst of outlining this next project, actually, so I'm hoping to jump into your framework in a couple of months. In the meantime, if I come across any feedback to offer after a bit of casual messing around, I'll be sure to let you know!

I've downloaded the app for my android phone and the test text plays so smoothly! Just lovely, really well done.