[Solved] How to cycle sprite image when creating a character

[kuma-sensei]

Hi there,

Been working on a character creation system with the following vision: A series of pre-drawn characters from which the player can select using left/right arrows to cycle between the available characters.

My implementation strategy: create a list of image files for each of the characters, a function to cycle between those files, left and right buttons on a screen that activate the cycle function, and wrap all of that in a loop.

Python initialization part:

Code: Select all

init python:
    # Hold all of the character images in a list
    char_list = ["dummy_char_yellow.png","dummy_char_green.png","dummy_char_orange.png","dummy_char_blue.png"]
    # As well as a position in the list that we are looking at
    char_list_pos = 0
    char = char_list[char_list_pos]
    
    # simple cycling function to move through a list without falling off
    def cycle(dir, clp, cl):
        return (clp + dir)%len(cl)

And then screen design:

Code: Select all

screen cycle_character_screen():
    frame:
        xalign 0.1 ypos 20
        vbox:
            
            text "Select a character image:"
            grid 2 1:
                textbutton "<":
                    clicked [SetVariable("char_list_pos", cycle(-1, char_list_pos, char_list)), 
                        SetVariable("char", char_list[cycle(-1, char_list_pos, char_list)]),
                        Jump("stage_1")]

                textbutton ">":
                    clicked [SetVariable("char_list_pos", cycle(1, char_list_pos, char_list)), 
                        SetVariable("char", char_list[cycle(1, char_list_pos, char_list)]), 
                        Jump("stage_1")]

And then the label with the screen and sprite show commands:

Code: Select all

label stage_1:

    image c = Image(char, xalign = 0.1)
    show c
#    if char:
#        hide c
#        with dissolve
#        show c
#        with dissolve

    show screen cycle_character_screen
    "Create your character! Begin by selecting an appearance and your preferred pronouns. currently on model [char]. \n\nWhen you are satisfied, press \"Confirm\" to proceed."

A fair amount of my work has been around convincing myself of the scope of each of these commands, including the need to print out [char] in the say screen. My goal there was to show that I was, indeed, cycling between images with the buttons.

Issue: Currently, the image does not update even though the filename saved to "char" is being updated. What am I missing? Is there a smoother way to build this?

Thanks,
Kuma-sensei

[kivik]

I'd say the smoother way is to use dynamic images: https://www.renpy.org/doc/html/changelo ... mic-images

You can set your character image with either a single or multiple variables.

Code: Select all

image c:
    "[char]" # this is probably all you need in your case
    xalign = 0.1
image d = "[char_color]-[char_outfit]-[char_mood].png" # but you can diversify!

Also I don't know if you want to set xalign at the image level - you should probably set that in transforms so you can move the image to wherever you want.

[kuma-sensei]

That's it! Dynamic images - thank you for the pointer!

Agreed on the positioning, by the way - that was simply an in-medias-res test of trying to get some movement to happen.