Gallery SCREEN that works? [Solved]

[OokamiKasumi]

Hi there,
-- Instead of using the old (and seriously out-dated) 2-page gallery from the cookbook, I am attempting to upgrade to the the gallery Screen.

Code: Select all

init python:

    # Step 1. Create the gallery object.
    g = Gallery()

    # Step 2. Add buttons and images to the gallery.

    # A button that contains an image that automatically unlocks.

    g.button("dawn")
    g.image("dawn1")
    g.unlock("dawn1")

    # This button has multiple images associated with it. We use unlock_image
    # so we don't have to call both .image and .unlock. We also apply a
    # transform to the first image.

    g.button("dark")
    g.unlock_image("bigbeach1")
    g.transform(slowpan)
    g.unlock_image("beach1 mary")
    g.unlock_image("beach2")
    g.unlock_image("beach3")

    # This button has a condition associated with it, allowing code
    # to choose which images unlock.

    g.button("end1")
    g.condition("persistent.unlock_1")
    g.image("transfer")
    g.image("moonpic")
    g.image("girlpic")
    g.image("nogirlpic")
    g.image("bad_ending")

    g.button("end2")
    g.condition("persistent.unlock_2")
    g.image("library")
    g.image("beach1 nomoon")
    g.image("bad_ending")

    # The last image in this button has an condition associated with it,
    # so it will only unlock if the user gets both endings.

    g.button("end3")
    g.condition("persistent.unlock_3")
    g.image("littlemary2")
    g.image("littlemary")
    g.image("good_ending")
    g.condition("persistent.unlock_3 and persistent.unlock_4")

    g.button("end4")
    g.condition("persistent.unlock_4")
    g.image("hospital1")
    g.image("hospital2")
    g.image("hospital3")
    g.image("heaven")
    g.image("white")
    g.image("good_ending")
    g.condition("persistent.unlock_3 and persistent.unlock_4")

    # The final two buttons contain images that show multiple pictures
    # at the same time. This can be used to compose character art onto
    # a background.

    g.button("dawn mary")
    g.unlock_image("dawn1", "mary dawn wistful")
    g.unlock_image("dawn1", "mary dawn smiling")
    g.unlock_image("dawn1", "mary dawn vhappy")

    g.button("dark mary")
    g.unlock_image("beach2", "mary dark wistful")
    g.unlock_image("beach2", "mary dark smiling")
    g.unlock_image("beach2", "mary dark vhappy")

    # The transition used when switching images.
    g.transition = dissolve

# Step 3. The gallery screen we use.
screen gallery:

    # Ensure this replaces the main menu.
    tag menu

    # The background.
    add "beach2"

    # A grid of buttons.
    grid 3 3:

        xfill True
        yfill True

        # Call make_button to show a particular button.

        add g.make_button("dark", "gal-dark.png", xalign=0.5, yalign=0.5)
        add g.make_button("dawn", "gal-dawn.png", xalign=0.5, yalign=0.5)
        add g.make_button("end1", "gal-end1.png", xalign=0.5, yalign=0.5)

        add g.make_button("end2", "gal-end2.png", xalign=0.5, yalign=0.5)
        add g.make_button("end3", "gal-end3.png", xalign=0.5, yalign=0.5)
        add g.make_button("end4", "gal-end4.png", xalign=0.5, yalign=0.5)

        add g.make_button("dark mary", "gal-dark_mary.png", xalign=0.5, yalign=0.5)
        add g.make_button("dawn mary", "gal-dawn_mary.png", xalign=0.5, yalign=0.5)

        # The screen is responsible for returning to the main menu. It could also
        # navigate to other gallery screens.

        textbutton "Return" action Return() xalign 0.5 yalign 0.5

Unfortunately, this code does not work for two reasons.

1) I do not have an ATL Transformation known as slowpan. (And all my attempts to make one have failed miserably.)

Code: Select all

g.button("dark")
    g.unlock_image("bigbeach1")
    g.transform(slowpan)

2) There's something wrong with the make-button code.

Code: Select all

       # Call make_button to show a particular button.
        add g.make_button("dark", "gal-dark.png", xalign=0.5, yalign=0.5)

Code: Select all

I'm sorry, but an uncaught exception occurred.

While running game code:
  File "game/screen_gallery.rpy", line 101, in python
AttributeError: 'ADVCharacter' object has no attribute 'make_button'

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

Full traceback:
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\execution.py", line 265, in run
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\ast.py", line 632, in execute
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\python.py", line 972, in py_exec_bytecode
  File "common/_layout/screen_main_menu.rpym", line 11, in <module>
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\ui.py", line 237, in interact
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 1814, in interact
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 555, in replace_transient
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 825, in remove
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 753, in hide_or_replace
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\screen.py", line 178, in _hide
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\screen.py", line 247, in update
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\screenlang.py", line 1166, in __call__
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\python.py", line 972, in py_exec_bytecode
  File "game/screen_gallery.rpy", line 101, in <module>
AttributeError: 'ADVCharacter' object has no attribute 'make_button'

Windows-7-6.1.7601-SP1
Ren'Py 6.13.12.1728
My Template 0.0

DaFool was kind enough to make the music room screen work. I'm begging you, would one of the renpy code experts please post a gallery screen that Does work?

Please, please, please, with all due respect, could you post an entire working code, not just the relevant bits? Some of us are Beginners with coding. Unless you show us, we won't know where floating bits of code need to go. Nor can we tell when a chunk of extra coding is needed somewhere else to make something work.

I apologize for my ignorance, but I did use the search function, and all queries on making a gallery Screen come back to This code; a code I can't seem to make work.

[PyTom]

IIRC, the gallery screens in homeward are open-script.

[OokamiKasumi]

IIRC, the gallery screens in homeward are open-script.

Thank you for the tip! (What does IIRC mean?)

[redeyesblackpanda]

IIRC, it's "If I recall correctly."

[OokamiKasumi]

IIRC, the gallery screens in homeward are open-script.

Okay! From the Homeward script's gallery code I put together this:

Code: Select all

init python:
       
    # Step 1. Create the gallery object.
    g = Gallery()
    
    # The transition used when switching images.
    g.transition = Dissolve(.25)

    ## Step 2. Add buttons and images to the gallery.
    # A button that contains an image that automatically unlocks.
    
    g.button("bg_park_th")
    g.image("bg_park")
    g.unlock("bg_park")

    # This button has multiple images assocated with it. We use unlock_image
    # so we don't have to call both .image and .unlock. 
    
    g.button("bg_light_th")
    g.unlock_image("bg_light")
    
    g.button("giselle_th")
    g.unlock_image("bg_park", "giselle")
    
    g.button("arthur_th")
    g.unlock_image("bg_park", "arthur")
    
    g.button("horse_th")
    g.unlock_image("bg_park", "horse")
    
## Creates a gallery button.

screen cg_button:
    $ action = g.Action(name)
    
    button:
        style "default"
        action action
        xmaximum (287 + 20)
        ymaximum (155 + 10)
        xminimum (287 + 20)
        yminimum (155 + 10)
        xmargin 10
        ymargin 5
        idle_background "g/gallerybutton_idle.png"
        hover_background "g/gallerybutton_hover.png"
        
        if action:
            add thumb xalign 0.5 yalign 0.5

screen gallery_common:
    window:
        style "gm_root"
    imagemap:
        ground "g/gallery_ground.jpg"
        idle "g/gallery_idle.jpg"
        hover "g/gallery_hover.jpg"
        selected_idle "g/gallery_selectidle.jpg"
        selected_hover "g/gallery_selecthover.jpg"
        
        alpha False

        # EDIT POINT 2 - Navigation.
        
        # Return
        hotspot (819, 410, 128, 49) action ShowMenu("bonus_menu")
        
        # Waifu picker.
        hotspot (784, 25, 201, 60) action ShowMenu("backgrounds")
        hotspot (797, 91, 176, 51) action ShowMenu("characters")

        
        # Previous, Next
        if previous:
            hotspot (800, 214, 169, 59) action ShowMenu(previous)
        if next:
            hotspot (826, 281, 118, 49) action ShowMenu(next)


# Step 3. The gallery screen we use.
screen backgrounds:  
    tag menu
    use gallery_common(previous=None, next="characters")
    
    # The grid contains up to 6 buttons. Unused buttons slots should be filled with null.
        use cg_button(name="Backgrounds", thumb="g/")
    grid 2 3:
        xpos 437
        xanchor 0.5
        ypos 210
        
        use cg_button(name="bg_park_th", thumb="g/BG_Park03_th.jpg")
        use cg_button(name="light_th", thumb="g/light_th.jpg")
        
        null
        null
        
        null
        null

        
screen characters:
    tag menu
    use gallery_common(previous="backgrounds", next=None)
    
    # The grid contains up to 6 buttons. Unused buttons slots should be filled with null.
        use cg_button(name="Characters", thumb="g/")
    grid 2 3:
        xpos 437
        xanchor 0.5
        ypos 210
        
        use cg_button(name="giselle_th", thumb="g/Giselle_th.png")
        use cg_button(name="arthur_th", thumb="g/Arthur_th.png")
        
        use cg_button(name="horse_th", thumb="g/horse_th.png")
        null
        
        null
        null
               

And ran across This error:

Code: Select all

I'm sorry, but an uncaught exception occurred.

While running game code:
  File "game/screen_gallery.rpy", line 93, in python
  File "game/screen_gallery.rpy", line 35, in python
AttributeError: 'ADVCharacter' object has no attribute 'Action'

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

Full traceback:
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\execution.py", line 265, in run
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\ast.py", line 632, in execute
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\python.py", line 972, in py_exec_bytecode
  File "common/_layout/screen_main_menu.rpym", line 11, in <module>
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\ui.py", line 237, in interact
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 1814, in interact
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 555, in replace_transient
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 825, in remove
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\core.py", line 753, in hide_or_replace
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\screen.py", line 178, in _hide
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\screen.py", line 247, in update
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\screenlang.py", line 1166, in __call__
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\python.py", line 972, in py_exec_bytecode
  File "game/screen_gallery.rpy", line 93, in <module>
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\display\screen.py", line 540, in use_screen
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\screenlang.py", line 1166, in __call__
  File "J:\!Kenetic Novels\RenPy\renpy-6.13.12\renpy\python.py", line 972, in py_exec_bytecode
  File "game/screen_gallery.rpy", line 35, in <module>
AttributeError: 'ADVCharacter' object has no attribute 'Action'

Windows-7-6.1.7601-SP1
Ren'Py 6.13.12.1728
My Template 0.0

This is line 96:

Code: Select all

        use cg_button(name="bg_park_th", thumb="g/BG_Park03_th.jpg")

This is line 35:

Code: Select all

    $ action = g.Action(name)

Anyone have a clue? Please?

[PyTom]

Do you have a character named 'g'? That's being confused with the gallery - they share a namespace.

[OokamiKasumi]

Do you have a character named 'g'? That's being confused with the gallery - they share a namespace.

That did it!

I changed the character from 'g' to 'gi' and it works.
-- Thank you PyTom! I can now upgrade to a proper gallery Screen instead of using that outdated gallery code. Bonzai!

[Atlantis]

It's so pleasant to use Ren'py because :

1 - It's powerfull, clever and easy to use

and above all, because PyTom is really reactive when a coder has a problem. (like me several times, couple weeks ago)

Thanks again PyTom for your wonderfull works !!

[OokamiKasumi]

Okay! I finally got the whole thing working smoothly.

One of the bugs that took forever to figure out was how to make the hover frames go around the image. The problem was that the frame appeared BEHIND the image. I fixed that by making the frame 6 px wider and 6 px taller, then added 3 to both the xpadding & ypadding.

Oh, and just in case you'd like to know, the gallery is accessed by way of the bonus page, so clicking Return sends you back to the bonus page.

Full working code:

Code: Select all

init python:

    # Step 1. Create the gallery object.
    g = Gallery()
    
    # The transition used when switching images.
    g.transition = dissolve
    
    # An image used as the background of the various gallery pages.
    g.background = "g/gallery_background.jpg"
    
    # The image used for locked buttons.
    g.locked_button = "g/gallerybutton_locked.png"
    
    # The background of a locked image. 
    g.locked_background = "g/gallery_background.jpg"
    

    ## Step 2. Add buttons and images to the gallery.
    # A button that contains an image that automatically unlocks.
    
    g.button("bg_park_th")
    g.image("bg_park")
    g.unlock("bg_park")

    # This button has multiple images assocated with it. We use unlock_image
    # so we don't have to call both .image and .unlock. 
    
    g.button("light_th")
    g.unlock_image("bg_light")
    
    g.button("giselle_th")
    g.unlock_image("bg_park", "giselle")
    
    g.button("arthur_th")
    g.unlock_image("bg_park", "arthur")
    
    g.button("horse_th")
    g.unlock_image("bg_park", "horse")
    
## Creates a gallery button.
screen cg_button:
    $ action = g.Action(name)
    
    button:
        # Frame Button is 161x119, that's 158 +3 in xpadding and 115 +3 in ypadding. 
        idle_background "g/gallerybutton_idle.png"
        hover_background "g/gallerybutton_hover.png"
        
        style "default"
        action action
        
        # x = Across
        # y = Up

        xmaximum (158)
        xminimum (158)
        
        ymaximum (115)
        yminimum (115)
       
        xmargin 15
        ymargin 15
        
        xpadding 3
        ypadding 3

        if action:
            add thumb xalign 0.5 yalign 0.5

screen gallery_common:
    # Ensure this replaces the main menu.
    tag menu
    
    # The background.
    add "bg_gal"

    imagemap:
        ground "g/gallery_ground.png"
        idle "g/gallery_idle.png"
        hover "g/gallery_hover.png"
        selected_idle "g/gallery_selectedidle.png"
        selected_hover "g/gallery_selectedhover.png"
        
        
        alpha False

        # EDIT POINT 2 - Navigation.
        
        # Return
        hotspot (832, 243, 106, 48) action ShowMenu("bonus_menu")
        
        # Pages
        hotspot (785, 31, 194, 56) action ShowMenu("backgrounds")
        hotspot (801, 86, 167, 44) action ShowMenu("characters")

        
        # Previous, Next
        if previous:
            hotspot (763, 194, 137, 41) action ShowMenu(previous)
        if next:
            hotspot (904, 200, 100, 35) action ShowMenu(next)


# Step 3. The gallery screen we use.
screen backgrounds:  
    tag menu
    use gallery_common(previous=None, next="characters")
    
    # The grid contains up to 9 buttons. Unused buttons slots should be filled with null.
        use cg_button(name="Backgrounds", thumb="g/")
        
    grid 3 3: # 3 image across & 3 image down 
        xpos 300
        xanchor 0.5
        ypos 100
        
        use cg_button(name="bg_park_th", thumb="g/BG_Park03_th.jpg")
        use cg_button(name="light_th", thumb="g/light_th.jpg")
        null
        
        null
        null
        null
        
        null
        null
        null

        
screen characters:
    tag menu
    use gallery_common(previous="backgrounds", next=None)
    
    # The grid contains up to 6 buttons. Unused buttons slots should be filled with null.
        use cg_button(name="Characters", thumb="g/")
    grid 3 3: # 3 image across & 3 image down 
        xpos 300
        xanchor 0.5
        ypos 100
        
        use cg_button(name="giselle_th", thumb="g/Giselle_th.png")
        null
        null
        
        use cg_button(name="arthur_th", thumb="g/Arthur_th.png")
        null
        null        
        
        use cg_button(name="horse_th", thumb="g/horse_th.png")
        null
        null