[SOLVED]How do grids work?

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.
Post Reply
Message
Author
User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

[SOLVED]How do grids work?

#1 Post by bonnie_641 »

I don't know how to apply to this case: I want the image to run through the sector marked by arrows per event (example: when rolling the dice, the player advances "X" steps).
tablero.jpg
EDIT:

The operation of cell-based motion is fully functional (it detects the keyboard, moves through cells, detects events per cell, and can modify the most "smoothed" type of motion thanks to a function called "offset".
For these reasons, I consider this issue to be solved.
I am very grateful for all the help given by Kia and especially to Alex (who guided me with a lot of patience and very good disposition to answer many doubts that I had).
I'm still waiting for the dice to work, but for now I'm satisfied with all the help I received.

I'm sorry if my handwriting is sometimes misunderstood. My native language is Spanish and I am writing in English thanks to a translator (Deepl).
Last edited by bonnie_641 on Tue Aug 13, 2019 7:04 pm, edited 2 times in total.
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

User avatar
Kia
Eileen-Class Veteran
Posts: 1040
Joined: Fri Aug 01, 2014 7:49 am
Deviantart: KiaAzad
Discord: Kia#6810
Contact:

Re: How do grids work?

#2 Post by Kia »

you need a nested list(array) to keep track of your tiles and the player position.

Code: Select all

default stage = [
    [1,1,1,1,1,1,1,1,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,1,1,1,1,1,1,1,1],
    ]
it might not make much sense like this, but you can store the tile related data on their position and track the index to position your character on the screen.
if you have time to wait, I'm going open source with all of my code soon and I'll be sharing my tile "engine" I've wrote for renpy that is ideal for minigames like this.

a simpler workaround would be creating a list of (x, y) positions and change the player position according to the number it is standing on, in fact, this is what I should've suggest from the beginning, but hey, I already wrote that one so, I'll let it remain as an alternative

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#3 Post by bonnie_641 »

Kia wrote: Sat Aug 03, 2019 3:44 am you need a nested list(array) to keep track of your tiles and the player position.

Code: Select all

default stage = [
    [1,1,1,1,1,1,1,1,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,1,1,1,1,1,1,1,1],
    ]
it might not make much sense like this, but you can store the tile related data on their position and track the index to position your character on the screen.
if you have time to wait, I'm going open source with all of my code soon and I'll be sharing my tile "engine" I've wrote for renpy that is ideal for minigames like this.

a simpler workaround would be creating a list of (x, y) positions and change the player position according to the number it is standing on, in fact, this is what I should've suggest from the beginning, but hey, I already wrote that one so, I'll let it remain as an alternative
Thank you very much for answering.
I'll wait for the code you wrote so I can analyze how it works.

I will try to write what I understood in order to apply the logic of the mini-game.
1.- Start the grid

Code: Select all

default stage = [
    [1,1,1,1,1,1,1,1,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,0,0,0,0,0,0,0,1],
    [1,1,1,1,1,1,1,1,1],
    ]
2.- Default player position

Code: Select all

default x = 0
default y = 0
3.- Winning Coordinate

Code: Select all

#The goal is the same starting point
default new_x = 0
default new_y = 0
4.- Create a return counter.

Code: Select all

default counter = 0
5.- Images of player and tiles.

Code: Select all

image player = "images/player.png"
image tile_0 = "images/tile_0.png"
image tile_1 = "images/tile_1.png"
6.- Create a screen (where is the logic of the minigame)

Code: Select all

screen board_minigame():
    # if player at the winning position
    if x ==new_x and y == new_y and counter==1:
        Jump("win_label")
        
    # Player Control 
    #If you don't reach the goal, you can move the character
    else:
        key "focus_left" action SetVariable("x", ???) #<-----------------------lack of equation of motion
        key "focus_right" action SetVariable("x", ???) #<-----------------------lack of equation of motion
        key "focus_up" action SetVariable("y", ???) #<-----------------------lack of equation of motion
        key "focus_down" action SetVariable("y", ???) #<-----------------------lack of equation of motion
    
        # Other buttons are not applied, so they are disabled
        key "dismiss" action NullAction()
7.- Create a "for" cycle to cycle through the grids

Code: Select all

    #They're inside the board_minigame screen.
    grid ??? spacing 3: #<----What should I put here?       
        for row in stage:
            for tile in row:
                if tile == 1:
                    add "tile_1"
                if tile == 0:
                    add "tile_0"
                else:
                    null
                    
    # Player's place
    grid ??? spacing 3: #<-----What should I put here?   
      
        for py in range(8):
            for px in range(5):
                if py == y and px == x:
                    add "player"
                else:
                    null
                    
        if new_x==0 and new_y==0:
            counter+=1
         


    
# The game starts here.

label start:
    "..."
    show  screen board_minigame()
    "Use the arrow keys to move the character"
    


    
label win_label:
    "You won! Congratulations!"
    hide screen board_minigame

    return
When incorporating the dice, I assume that they will depend on the movement equation of the player's grid, but I don't know how to incorporate into the code
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

User avatar
Kia
Eileen-Class Veteran
Posts: 1040
Joined: Fri Aug 01, 2014 7:49 am
Deviantart: KiaAzad
Discord: Kia#6810
Contact:

Re: How do grids work?

#4 Post by Kia »

I don't think the code should start this complicated, you need a screen, list of positions, an index for the players position and a player:

Code: Select all

screen board_game:
    default xy = [(100,100), (200,200), (200,300)]
    default position = 0
    frame:
        xysize 100,100
        pos xy[position]
you change the index, the player moves (untested)
for the dice a renpy.random.randint(1, 6) to generate a dice throw
I'm sure you can put two and two together

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#5 Post by bonnie_641 »

Kia wrote: Sun Aug 04, 2019 8:37 am I don't think the code should start this complicated, you need a screen, list of positions, an index for the players position and a player
(...)
for the dice a renpy.random.randint(1, 6) to generate a dice throw
I'm sure you can put two and two together
I appreciate your help. Although you explain very well, I have trouble understanding logic. :oops:
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

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

Re: How do grids work?

#6 Post by Alex »

bonnie_641 wrote: Fri Aug 02, 2019 10:01 pm...
There's a kind of sample - viewtopic.php?f=8&t=55947&p=514658#p514658

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#7 Post by bonnie_641 »

Alex wrote: Mon Aug 05, 2019 12:41 pm
bonnie_641 wrote: Fri Aug 02, 2019 10:01 pm...
There's a kind of sample - viewtopic.php?f=8&t=55947&p=514658#p514658
tableroo.jpg
Thank you very much :D

I modified the script, although a part is missing...
How do I tell the character to move only by the grey tiles? (The character also moves through the red zone :oops: )

Code: Select all

# game field
default gf = [ 
    #0 1 2 3 4 5 6 7 8 9
    [1,1,1,1,1,1,1,1,1,1],  #0
    [1,0,0,0,0,0,0,0,0,1],  #1
    [1,0,0,0,0,0,0,0,0,1],  #2
    [1,0,0,0,0,0,0,0,0,1],  #3 
    [1,0,0,0,0,0,0,0,0,1],  #4
    [1,0,0,0,0,0,0,0,0,1],  #5
    [1,1,1,1,1,1,1,1,1,1] ]#6

# player's positions
default x = 0
default y = 0

default x_win = 2
default y_win = 3

# game field position and transform
default gf_align = (0.5, -0.4)

transform my_tr():
    zoom 1.2
    rotate 0

# images
image tile_1:
    Solid("#888")
    size(50, 50)

image tile_0:
    Solid("#000")
    size(50, 50)
    
image token:
    Solid("#333")
    size(50, 50)
    
# game screen
screen game_field():
   
    # if player at the winning position
    if x == x_win and y == y_win:
        timer 0.01 action Jump("win_label") repeat False  

    
         

    # if not yet - let him/her move the token
    else:
        key "focus_left" action SetVariable("x", max(x-1, 0))
        key "focus_right" action SetVariable("x", min(x+1, 9))
        key "focus_up" action SetVariable("y", max(y-1, 0))
        key "focus_down" action SetVariable("y", min(y+1, 6))
    
        # disallow further progress in game
        key "dismiss" action NullAction()
    
    # game field
    grid 10 7 spacing 1:
        align gf_align
        at my_tr
        
        for row in gf:
            for tile in row:
                if tile == 1:
                    add "tile_1"
                else:
                    null
                    
    # player's token
    grid 10 7 spacing 1:
        align gf_align
        at my_tr
       
        for py in range(7):
            for px in range(10):
                if py == y and px == x:
                    add "token"
         
                else:
                    null


    
# The game starts here.

label start:
    "..."
    show screen game_field with dissolve
    "Use arrow keys to move."
    "?!"
    
label win_label:
    "Well done!"
    hide screen game_field with dissolve
    "... ..."
    return
I tried several ways:

1.- Using the NullAction() function

Code: Select all

# Example;
if x ==0 and y==1:
    key "focus_right" action NullAction()
2.- Modifying the SetVariable() function

Code: Select all

# Example;
if x ==1 and y==0:
    key "focus_down" action SetVariable("y", 0)
etc...

Any modification I made to the code gives the following error:
Exception: Grid overfull.
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

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

Re: How do grids work?

#8 Post by Alex »

bonnie_641 wrote: Mon Aug 05, 2019 8:31 pm...

Code: Select all

    # if not yet - let him/her move the token
    else:
        key "focus_left" action SetVariable("x", max(x-1, 0))
        key "focus_right" action SetVariable("x", min(x+1, 9))
        key "focus_up" action SetVariable("y", max(y-1, 0))
        key "focus_down" action SetVariable("y", min(y+1, 6))
This part sets the actions for keys. So you can add some conditions to check if action can be made.
Like this not tested code (set the proper indentation)

Code: Select all

# for moving left
if x>0: # check if player is not at the left side of field
    if gf[y][x-1] != 0: # check if tile at left is not 0
        key "focus_left" action SetVariable("x", max(x-1, 0))
else:
    key "focus_left" action NullAction()

# for moving right
if x<9: # check if player is not at the right side of field
    if gf[y][x+1] != 0: # check if tile at right is not 0
        key "focus_right" action SetVariable("x", min(x+1, 9))
else:
    key "focus_right" action NullAction()

# for moving up
if y>0: # check if player is not at the top side of field
    if gf[y-1][x] != 0: # check if tile above is not 0
        key "focus_up" action SetVariable("y", max(y-1, 0))
else:
    key "focus_up" action NullAction()

# for moving down
if y<6: # check if player is not at the bottom side of field
    if gf[y+1][x] != 0: # check if tile under is not 0
        key "focus_down" action SetVariable("y", min(y+1, 6))
else:
    key "focus_down" action NullAction()

Also, your winning coordinates will be

Code: Select all

default x_win = 9
default y_win = 6

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#9 Post by bonnie_641 »

Alex wrote: Tue Aug 06, 2019 7:14 am
This part sets the actions for keys. So you can add some conditions to check if action can be made.
Like this not tested code (set the proper indentation)

Code: Select all

# for moving left
if x>0: # check if player is not at the left side of field
    if gf[y][x-1] != 0: # check if tile at left is not 0
        key "focus_left" action SetVariable("x", max(x-1, 0))
else:
    key "focus_left" action NullAction()

# (...)

Also, your winning coordinates will be

Code: Select all

default x_win = 9
default y_win = 6
Thank you very much :D
It works perfectly.
I edited the code "a little" (based on the answer you gave me).

Code: Select all

# game field
default gf = [ 
    #0 1 2 3 4 5 6 7 8 9
    [1,1,1,1,1,1,1,1,1,1],  #0
    [1,0,0,0,0,0,0,0,0,1],  #1
    [1,0,0,0,0,0,0,0,0,1],  #2
    [1,0,0,0,0,0,0,0,0,1],  #3 
    [1,0,0,0,0,0,0,0,0,1],  #4
    [1,0,0,0,0,0,0,0,0,1],  #5
    [1,1,1,1,1,1,1,1,1,1] ] 

# player's positions
default x = 0
default y = 0

default x_win = 9
default y_win = 6

# game field position and transform
default gf_align = (0.5, -0.4)

transform my_tr():
    zoom 1.2
    rotate 0

# images
image tile_1:
    Solid("#888")
    size(50, 50)

image tile_0:
    Solid("#000")
    size(50, 50)
    
image token:
    Solid("#333")
    size(50, 50)
    
# game screen
screen game_field():
    key "focus_left" action SetVariable("x", max(x-1, 0))
    key "focus_right" action SetVariable("x", min(x+1, 9))
    key "focus_up" action SetVariable("y", max(y-1, 0))
    key "focus_down" action SetVariable("y", min(y+1, 6))

    # if player at the winning position
    if x == x_win and y == y_win:
        timer 0.01 action Jump("win_label") repeat False  

    # for moving left
    if x>0: # check if player is not at the left side of field
        if gf[y][x-1] != 0: # check if tile at left is not 0
            key "focus_left" action SetVariable("x", max(x-1, 0))
        else:
            key "focus_left" action NullAction()

    # for moving right
    if x<9: # check if player is not at the right side of field
        if gf[y][x+1] != 0: # check if tile at right is not 0
            key "focus_right" action SetVariable("x", min(x+1, 9))
        else:
            key "focus_right" action NullAction()

    # for moving up
    if y>0: # check if player is not at the top side of field
        if gf[y-1][x] != 0: # check if tile above is not 0
            key "focus_up" action SetVariable("y", max(y-1, 0))
        else:
            key "focus_up" action NullAction()

    # for moving down
    if y<6: # check if player is not at the bottom side of field
        if gf[y+1][x] != 0: # check if tile under is not 0
            key "focus_down" action SetVariable("y", min(y+1, 6))
        else:
            key "focus_down" action NullAction()   
         
    ####################################################################
    # DELETED AND ADDING THE KEYS IN THE TOP OF SCREEN (WITHOUT "ELSE")
    #------------------------------------------------------------------
    # if not yet - let him/her move the token
    #else:
        # key "focus_left" action SetVariable("x", max(x-1, 0))
        # key "focus_right" action SetVariable("x", min(x+1, 9))
        # key "focus_up" action SetVariable("y", max(y-1, 0))
        # key "focus_down" action SetVariable("y", min(y+1, 6))
    
        # disallow further progress in game
        #key "dismiss" action NullAction()
    #####################################################################
    
    # game field
    grid 10 7 spacing 1:
        align gf_align
        at my_tr
        
        for row in gf:
            for tile in row:
                if tile == 1:
                    add "tile_1"
                else:
                    null
                    
    # player's token
    grid 10 7 spacing 1:
        align gf_align
        at my_tr
       
        for py in range(7):
            for px in range(10):

                if py == y and px == x:
                    add "token"

                else:
                    null

######################################
# The game starts here.

label start:
    "..."
    show screen game_field with dissolve
    "Use arrow keys to move."
    "?!"

    
label win_label:
    "Well done!"
    hide screen game_field with dissolve
    "... ..."
    return
Just add the dice and this minigame will be ready. However, that will remain a task for me.
When I incorporate the dice, I'll put it on this topic and take it for "solved". :D

I am very happy because I will be able to add this code to my game.
I heartily thank you for what you did for me, Alex.
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#10 Post by bonnie_641 »

When reviewing other games, I realized that I didn't consider another factor: How can I calculate the displacement of the character when there are cells that are halved?
help.png
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

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

Re: How do grids work?

#11 Post by Alex »

Try to add an 'offset' when showing player's token, like

Code: Select all

                if py == y and px == x:
                    add "token" offset(20, -20) # that is 20 pxls to the right and 20 pxls up
How to tell the game that there is an offset - it's up to you...))

For example, you can set such a tile as 2 in your 'gf', and later check the tile where player's token placed, like

Code: Select all

                if py == y and px == x:
                    add "token":
                        if gf[y][x] == 2:
                            offset (20, -20)

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#12 Post by bonnie_641 »

That's very kind of you, Alex. It works very well. :D :wink:

The further I go, the more problems arise. But I'm happy, because I was able to incorporate an "extra" (it took me 5 days, but it works on the side).
When my character walks, it changes the image thanks to "DynamicImage" and SetVariable (which can incorporate more than one in the same line. :lol: )

Code: Select all

# Two components that are initialized to incorporate image changes depending on the situation
default avatar = 1
image token:
    DynamicImage("token[avatar]" ) 
    size (50,50)

Code: Select all

# If it moves to the left, it changes the avatar state (by default, I defined "avatar"=1)
# for moving left
        if x>0: # check if player is not at the left side of field
     
            if gf[y][x-1] == 1: # check if tile at left is not 0
                
                key "focus_left" action [SetVariable("x", max(x-1, 0)), SetVariable("avatar", 1)]] # <-------added a SetVariable for avatar 
            else:
                key "focus_left" action NullAction()
Something similar is done during the other movements, but when I get to the "standing" state... it doesn't work.

Code: Select all

########### The "standing" state doesn't work. Does not generate any error message, but ignores that state #############
        else:
            if not event.key: 
                timer 2.0 action SetVariable("avatar", 5)
            else:
                key "dismiss" action SetVariable("avatar", 5)
Y finally:

Code: Select all

            for py in range(12):
                for px in range(22):
                    if py == y and px == x:
                        add "token[avatar]" # <----- is linked to the variable composed by DynamicImage("token[avatar]" ) 
The algorithm I want to put is: if no button is pressed (up, down, left, right) in 2.0 seconds, change the avatar to 5
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

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

Re: How do grids work?

#13 Post by Alex »

Try to add another variable...

Code: Select all

# game screen
screen game_field():
    default my_var = 0
    if my_var == 0:
        timer 0.01 action [SetScreenVariable("my_var", 1)] # need some time to hide next timer and show it again
    if my_var == 1:
        timer 2.0 action [SetVariable("avatar", 5), SetScreenVariable("my_var", 2)]
    else:
        pass
And set 'my_var' on a key press to 0

Code: Select all

key "focus_left" action [SetVariable("x", max(x-1, 0)), SetVariable("avatar", 1), SetScreenVariable("my_var", 0)] # <-------added a SetVariable for avatar 

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#14 Post by bonnie_641 »

Thank you, Alex :D
It's working! :wink: I really appreciate your help. :D

With all the code you shared, it's almost ready to have the mini-game (I still have to implement the dice to make it look like a board game).
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

User avatar
bonnie_641
Regular
Posts: 133
Joined: Sat Jan 13, 2018 10:57 pm
Projects: Código C.O.C.I.N.A.
Deviantart: rubymoonlily
Contact:

Re: How do grids work?

#15 Post by bonnie_641 »

According to all of Alex's help, I'll take this matter for solved.

When I have the dice incorporated into the game I will add it.
I speak and write in Spanish. I use an English-Spanish translator to express myself in this forum. If I make any mistakes, please forgive me.
I try my best to give an answer according to your question. :wink:

Post Reply

Who is online

Users browsing this forum: Google [Bot]