NES-era GUI

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Message
Author
User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

NES-era GUI

#1 Post by Karrion »

We want to use old-style GUI for our novel, with a kind of frame around the scene itself, and was thinking of putting a displayable that covers the screen or even make the textbox full solid and put a displayable for the mobile phone (as seen in the attached picture), but I have some problems with doing this:

- When changing scenes, everything on screen fades, the idea would be that only the background, text and characters change, while everything else stays on screen. Is there any way to do this? Is there an easier way to do the framing by tinkering with the gui.rpy file?

- I'd want to move the buttons that are by default on the bottom part of the screen (quick save, quick load, skip, menu, etc), and remove some of them and put the others on the phone and change their image, but I can't for the life of me find them on the gui.rpy file. There are options for buttons but not for those buttons specifically.

I'm relatively new to this engine and don't even know where to start looking for things like these ^^U

Thanks in advance :)
Attachments
Example of what we want
Example of what we want
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Alex
Lemma-Class Veteran
Posts: 3094
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: NES-era GUI

#2 Post by Alex »

Those buttons are in a quck_menu screen (see screens.rpy). And for making borders check these threads
viewtopic.php?f=8&t=20699&hilit=layer+clip
viewtopic.php?f=8&t=31372&hilit=layer+clip

User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

Re: NES-era GUI

#3 Post by Karrion »

EDIT 1: I changed the block to be inside a python block and the = in the if to an equals and now it spews a runtime error that ChangeOverlay() is not defined :/

So, I've encountered another problem with this but I'm not sure if I should ask this in the same thread or create a new one. Since I feel it would be kind of redundant, I'll add it in this thread.

After adding the overlay successfully, we wanted to be able to change the overlay itself with a button (let's say we want to change the Moomin phone background with another background). Since we want the change to persist after loading a game (but not if you create a new game), we wanted to create a flag that contained the default background and use a button to change it.

Therefore, I got into screens.rpy to create a method that the button can actuate to change the overlay:

def ChangeOverlay():
if imageFlag = "images/capa.png":
imageFlag = "images/caparoja.png"
else:
imageFlag = "images/capa.png"
return

However, I returns a compilation error that says

```
I'm sorry, but errors were detected in your script. Please correct the
errors listed below, and try again.


File "game/screens.rpy", line 244: expected statement.
def ChangeOverlay():
^

Ren'Py Version: Ren'Py 7.1.4.1266
Mon Nov 04 17:36:35 2019
```
As a note, imageFlag is defined in script.rpy since that's the script that accesses the "show imageFlag onlayer guilayer". Maybe I'm doing this all wrong, I don't know, right now I'm trying to learn about GUI customizing and creating menus and everything is a bit confusing.

Thanks in advance!
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Imperf3kt
Lemma-Class Veteran
Posts: 3794
Joined: Mon Dec 14, 2015 5:05 am
itch: Imperf3kt
Location: Your monitor
Contact:

Re: NES-era GUI

#4 Post by Imperf3kt »

If you like, I could create a gui in the style you want sometime later today after work. It is currently early morning for me.
For the simplistic style you've shown, I expect I could prepare something in about 30 minutes give or take.

Do you have any other requirements? Other screens or menus to meet a particular look?
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Current project: GGD Mentor

Twitter

User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

Re: NES-era GUI

#5 Post by Karrion »

Oh no no, don't worry, we already have a graphic designer on the team, the only problems right now are on my (programming) side. Thanks for the offer anyway.

Edit: More advancements! I've looked at what actions can a button do and seen that i can change the value of a variable,so i can put two buttons to change between overlays, the problem now is that the button is defined in screens.rpy (i wanted the buttons to be part of the quick menu), and the variables are at script.rpy. Is there a way to interact with variables from one script to another?
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Per K Grok
Miko-Class Veteran
Posts: 882
Joined: Fri May 18, 2018 1:02 am
Completed: the Ghost Pilot, Sea of Lost Ships, Bubbles and the Pterodactyls, Defenders of Adacan Part 1-3, the Phantom Flyer
itch: per-k-grok
Location: Sverige
Contact:

Re: NES-era GUI

#6 Post by Per K Grok »

Karrion wrote: Mon Nov 04, 2019 4:10 pm ----
Is there a way to interact with variables from one script to another?
All scripts in the game talk to each other. To split the code up in different scripts is mostly for having stuff more easily organized for us humans. For the computer it is all the same.

User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

Re: NES-era GUI

#7 Post by Karrion »

Per K Grok wrote: Mon Nov 04, 2019 5:50 pm
Karrion wrote: Mon Nov 04, 2019 4:10 pm ----
Is there a way to interact with variables from one script to another?
All scripts in the game talk to each other. To split the code up in different scripts is mostly for having stuff more easily organized for us humans. For the computer it is all the same.
Yes, I've seen that you don't need to import the other script to access its variables, but when I refer to it normaly by name, like this

Code: Select all

imagebutton idle "images/menu.png" action SetVariable(imageFlag, "images/caparoja.png")
I get an error saying that imageFlag is not defined.

The traceback shows the error is thrown after the last line on script.rpy, so it is after being defined in that script:

Code: Select all

I'm sorry, but an uncaught exception occurred.

While running game code:
  File "game/script.rpy", line 39, in script
    "Bueno, pero podría relajarse un poco fuera de las aulas. Ojalá aprendiera un poco de vuestro tutor, normal que tenga tanto éxito entre las estudiantes de la academia."
  File "renpy/common/000window.rpy", line 98, in _window_auto_callback
    _window_show()
  File "renpy/common/000window.rpy", line 60, in _window_show
    renpy.with_statement(trans)
  File "game/screens.rpy", line 244, in execute
    screen quick_menu():
  File "game/screens.rpy", line 244, in execute
    screen quick_menu():
  File "game/screens.rpy", line 249, in execute
    if quick_menu:
  File "game/screens.rpy", line 251, in execute
    hbox:
  File "game/screens.rpy", line 257, in execute
    imagebutton idle "images/menu.png" action SetVariable(imageFlag, "images/caparoja.png")
  File "game/screens.rpy", line 257, in keywords
    imagebutton idle "images/menu.png" action SetVariable(imageFlag, "images/caparoja.png")
NameError: name 'imageFlag' is not defined

-- Full Traceback ------------------------------------------------------------

Full traceback:
  File "game/script.rpy", line 39, in script
    "Bueno, pero podría relajarse un poco fuera de las aulas. Ojalá aprendiera un poco de vuestro tutor, normal que tenga tanto éxito entre las estudiantes de la academia."
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\ast.py", line 653, in execute
    statement_name("say")
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\ast.py", line 45, in statement_name
    i(name)
  File "renpy/common/000window.rpy", line 98, in _window_auto_callback
    _window_show()
  File "renpy/common/000window.rpy", line 60, in _window_show
    renpy.with_statement(trans)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\exports.py", line 1560, in with_statement
    return renpy.game.interface.do_with(trans, paired, clear=clear)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 2237, in do_with
    clear=clear)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 2687, in interact
    repeat, rv = self.interact_core(preloads=preloads, trans_pause=trans_pause, **kwargs)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 3071, in interact_core
    root_widget.visit_all(lambda i : i.per_interact())
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 531, in visit_all
    d.visit_all(callback, seen)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 531, in visit_all
    d.visit_all(callback, seen)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 531, in visit_all
    d.visit_all(callback, seen)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 531, in visit_all
    d.visit_all(callback, seen)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\screen.py", line 424, in visit_all
    callback(self)
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\core.py", line 3071, in <lambda>
    root_widget.visit_all(lambda i : i.per_interact())
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\screen.py", line 434, in per_interact
    self.update()
  File "C:\Users\karri\Downloads\renpy-7.1.0-sdk\renpy\display\screen.py", line 619, in update
    self.screen.function(**self.scope)
  File "game/screens.rpy", line 244, in execute
    screen quick_menu():
  File "game/screens.rpy", line 244, in execute
    screen quick_menu():
  File "game/screens.rpy", line 249, in execute
    if quick_menu:
  File "game/screens.rpy", line 251, in execute
    hbox:
  File "game/screens.rpy", line 257, in execute
    imagebutton idle "images/menu.png" action SetVariable(imageFlag, "images/caparoja.png")
  File "game/screens.rpy", line 257, in keywords
    imagebutton idle "images/menu.png" action SetVariable(imageFlag, "images/caparoja.png")
  File "<screen language>", line 257, in <module>
NameError: name 'imageFlag' is not defined

Windows-8-6.2.9200
Ren'Py 7.1.4.1266
Tests 1.0
Tue Nov 05 10:55:52 2019
The flag itself is defined as

Code: Select all

image imageFlag = "images/capa.png"
Maybe I'm missing some kind of special syntax to refer to that flag or I've defined the flag incorrectly? Maybe the default is missing? Maybe it is indeed a race condition?
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Per K Grok
Miko-Class Veteran
Posts: 882
Joined: Fri May 18, 2018 1:02 am
Completed: the Ghost Pilot, Sea of Lost Ships, Bubbles and the Pterodactyls, Defenders of Adacan Part 1-3, the Phantom Flyer
itch: per-k-grok
Location: Sverige
Contact:

Re: NES-era GUI

#8 Post by Per K Grok »

Karrion wrote: Tue Nov 05, 2019 6:01 am
Per K Grok wrote: Mon Nov 04, 2019 5:50 pm
Karrion wrote: Mon Nov 04, 2019 4:10 pm ----
Is there a way to interact with variables from one script to another?
All scripts in the game talk to each other. To split the code up in different scripts is mostly for having stuff more easily organized for us humans. For the computer it is all the same.
Yes, I've seen that you don't need to import the other script to access its variables, but when I refer to it normaly by name, like this

Code: Select all

imagebutton idle "images/menu.png" action SetVariable(imageFlag, "images/caparoja.png")
I get an error saying that imageFlag is not defined.

----
Maybe I'm missing some kind of special syntax to refer to that flag or I've defined the flag incorrectly? Maybe the default is missing? Maybe it is indeed a race condition?

This is how you write SetVariable

SetVariable("value", value + 1)

In the first argument the name of the variable should be in the form of a string. If you use it in the second argument you don't use the string-form.

User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

Re: NES-era GUI

#9 Post by Karrion »

I corrected that after looking at the documentation and the error is mostly the same, now it says that the variable imageFlag does not exist.
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Per K Grok
Miko-Class Veteran
Posts: 882
Joined: Fri May 18, 2018 1:02 am
Completed: the Ghost Pilot, Sea of Lost Ships, Bubbles and the Pterodactyls, Defenders of Adacan Part 1-3, the Phantom Flyer
itch: per-k-grok
Location: Sverige
Contact:

Re: NES-era GUI

#10 Post by Per K Grok »

Karrion wrote: Tue Nov 05, 2019 1:09 pm I corrected that after looking at the documentation and the error is mostly the same, now it says that the variable imageFlag does not exist.
I did not notice earlier that imageFlag was defined as an image. I assumed it was a string. Image is probably not recognized as a variable in this sense and that is probably part of your problem.

User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

Re: NES-era GUI

#11 Post by Karrion »

Per K Grok wrote: Tue Nov 05, 2019 1:36 pm
Karrion wrote: Tue Nov 05, 2019 1:09 pm I corrected that after looking at the documentation and the error is mostly the same, now it says that the variable imageFlag does not exist.
I did not notice earlier that imageFlag was defined as an image. I assumed it was a string. Image is probably not recognized as a variable in this sense and that is probably part of your problem.
Then it would be easier to make the flag a bool or an int in case i want more than two overlays, but then how can i make sure that the game checks changes in the variable to change the overlay accordingly?
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Per K Grok
Miko-Class Veteran
Posts: 882
Joined: Fri May 18, 2018 1:02 am
Completed: the Ghost Pilot, Sea of Lost Ships, Bubbles and the Pterodactyls, Defenders of Adacan Part 1-3, the Phantom Flyer
itch: per-k-grok
Location: Sverige
Contact:

Re: NES-era GUI

#12 Post by Per K Grok »

Karrion wrote: Tue Nov 05, 2019 1:45 pm --- but then how can i make sure that the game checks changes in the variable to change the overlay accordingly?
Did you not have a function for that? ChangeOverlay()?

Just changing a variable don't do anything in itself.

User avatar
Karrion
Regular
Posts: 74
Joined: Fri Jan 18, 2019 8:33 pm
Projects: Murder on the Marine Express
Organization: 1564 Studio
itch: 1564-studio
Contact:

Re: NES-era GUI

#13 Post by Karrion »

Per K Grok wrote: Tue Nov 05, 2019 2:14 pm
Karrion wrote: Tue Nov 05, 2019 1:45 pm --- but then how can i make sure that the game checks changes in the variable to change the overlay accordingly?
Did you not have a function for that? ChangeOverlay()?

Just changing a variable don't do anything in itself.
Let's recap a bit. The idea is to have the button cycle through overlays. As I've seen on documentation, I cannot call a user-created function with an imagebutton (or at least I don't know how, trying to define a function previously led me to the

File "game/screens.rpy", line 244: expected statement.
def ChangeOverlay():
^

error, so I settled for SetVariable), thing is, I would need a background loop to countinuously check the variable to see if it has changed and change the overlay accordingly (in Unity this would be done with the Update() function, but as far as i know, ren'py does not have anything similar to that), but I'm stuck on that step. Either I have a background loop that checks the variable or there is something I'm missing from previous attempts.

So, to stop confusing things a bit: Is it possible for the button to call a function I made instead of the ones predefined? Did my error come from trying to define a function wrong? And if all else fails, how would you suggest to have this functionality implemented?
1564 Studio, an indie studio dedicated to developing mystery VNs!
Follow us on Twitter for updates on our projects!

Image

Check out our current project, just released on PC, Android, Switch, XBox ONE/Series S/X and PS4/5!
Also available in Spanish, English, French and Japanese!

Image

User avatar
Alex
Lemma-Class Veteran
Posts: 3094
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: NES-era GUI

#14 Post by Alex »

Karrion wrote: Tue Nov 05, 2019 1:09 pm I corrected that after looking at the documentation and the error is mostly the same, now it says that the variable imageFlag does not exist.
As Per K Grok said, you've got an error 'cause 'image' statement is used to define images, not variables. And you need to set the default value for variable to use it in screen actions (like SetVariable). So, to set it use 'default' statement instead

Code: Select all

default my_var = 0
https://www.renpy.org/doc/html/python.h ... -statement
https://www.renpy.org/doc/html/displayi ... -statement
Karrion wrote: Tue Nov 05, 2019 1:45 pm ... Then it would be easier to make the flag a bool or an int in case i want more than two overlays, but then how can i make sure that the game checks changes in the variable to change the overlay accordingly?
You'll see the changes...))
Karrion wrote: Tue Nov 05, 2019 2:31 pm ... Is it possible for the button to call a function I made instead of the ones predefined? Did my error come from trying to define a function wrong? And if all else fails, how would you suggest to have this functionality implemented?
You need to place the code of your function in an init python block. like

Code: Select all

init python:
    def my_func():
        # code code code
To use your own function in a screen you need Function action - https://www.renpy.org/doc/html/screen_a ... l#Function

Code: Select all

textbutton "Click!" action Function(my_func)
And returning to the layer background issue, you can use a dynamic image - https://www.renpy.org/doc/html/changelo ... mic-images
Just show this image on your layer and change the variable to make image change. Try

Code: Select all

default my_var = 0
image layer_bg = "images/bg/layer_bg_[my_var].png"

screen button_scr():
    textbutton "Click!" action If(my_var<4, SetVariable("my_var", my_var+1), SetVariable("my_var" 0)) align(0.95, 0.5)
Then show image 'layer_bg' on your background layer, show the 'button_scr' screen and click some on button - it should change bg image in a loop through 'images/bg/layer_bg_0.png' ... 'images/bg/layer_bg_4.png'.

User avatar
Per K Grok
Miko-Class Veteran
Posts: 882
Joined: Fri May 18, 2018 1:02 am
Completed: the Ghost Pilot, Sea of Lost Ships, Bubbles and the Pterodactyls, Defenders of Adacan Part 1-3, the Phantom Flyer
itch: per-k-grok
Location: Sverige
Contact:

Re: NES-era GUI

#15 Post by Per K Grok »

Karrion wrote: Tue Nov 05, 2019 2:31 pm --- And if all else fails, how would you suggest to have this functionality implemented?
I'm not sure what it is you want the program to do, but I suspect you are trying to do things way more complicated than they need to be.

I have never used overlays and I am hard pressed to believe you really need that here. Before you start trying to find solutions to how to use overlays, maybe see if you really need that stuff. Maybe you can do stuff more simple.

In Ren'py you don't think in loops and update. There are of course loops and updates in the background that the program handles, but that is not how you write your scripts.

A typical Ren'py game, as I understand it (and I am not necessarily the best judge of this), is a bit like a theater scene where a character enter scene from left and speak some lines of dialog. The code is a bit like stage direction. The player can interact by making choices from menus and this drives the story forward. This, as I understand it, is what the engine is geared towards.

That does not mean that that is what it is limited to be able to do. No way. But you have to work within the framework of what the engine does.

Screens are really important when you want to do things outside the dialog driven area. You should, in my mind, start with getting a good grasp on what you can do with screens. Screens are probably a lot more than you suspect.

It looks to me like your game could be mostly be about screens.

Start simple. Don't try to do everything at once.

Post Reply

Who is online

Users browsing this forum: Google [Bot]