Page 1 of 1

How to have an Imagebutton in Viewport? [Solved]

Posted: Wed May 20, 2020 11:57 am
by AJFLink
I'm trying to have inventory system that can be viewed any time in the story to view obtained items and objects.

This is what it is right now with static images:

Code: Select all

screen inventory():

	tag menu
	
	use game_menu(_("Inventory"),scroll="viewport"):
	
		style_prefix "about"
		
		vbox:
			text "Some descriptive text here for item 1."
			image "inv_item_1.png"
			
			text "Some descriptive text here for item 2."
			image "inv_item_2.png"
			
			text "Some descriptive text here for item 3."
			image "inv_item_3.png"
			
			text "Some descriptive text here for item 4."
			image "inv_item_4.png"
How do I convert this so that instead of a viewable and scrollable list of text and static images it is a viewable and scrollable list of text and selectable images?

The main purpose behind this is so that when the image is selected/clicked it merely displays an enlarged version of selected image.

Re: How to have an Imagebutton in Viewport?

Posted: Wed May 20, 2020 2:24 pm
by Alex
AJFLink wrote:
Wed May 20, 2020 11:57 am
...How do I convert this so that instead of a viewable and scrollable list of text and static images it is a viewable and scrollable list of text and selectable images? ...
Just replace text and image with the imagebutton.
Since you making an inventory, I suppose you have a list of items, so you could iterate through it to create buttons.
So, it might looks like

Code: Select all

default my_inventory = [
    {"name":"apple", "img":"apple.pg", "description":"An apple"},
    {"name":"lemon", "img":"lemon.pg", "description":"A lemon"},
    {"name":"plum", "img":"plum.pg", "description":"A plum"},
]

screen description_scr(txt):
    text txt align(0.5, 0.5)

screen inventory():

    tag menu
	
    use game_menu(_("Inventory"),scroll="viewport"):
	
        style_prefix "about"
		
        vbox:
            for item in my_inventory:
                imagebutton:
                    idle item["img"]
                    hover item["img"]
                    action NullAction() # change it to desirable action
                    hovered Show("description_scr", txt=item["description"])
                    unhovered Hide("description_scr")
https://www.renpy.org/doc/html/screen_actions.html#Show
https://www.renpy.org/doc/html/screen_actions.html#Hide
https://docs.python.org/release/2.6/tut ... ctionaries

Re: How to have an Imagebutton in Viewport?

Posted: Thu May 21, 2020 10:18 am
by AJFLink
Alex wrote:
Wed May 20, 2020 2:24 pm
AJFLink wrote:
Wed May 20, 2020 11:57 am
...How do I convert this so that instead of a viewable and scrollable list of text and static images it is a viewable and scrollable list of text and selectable images? ...
Just replace text and image with the imagebutton.
Since you making an inventory, I suppose you have a list of items, so you could iterate through it to create buttons.
So, it might looks like

Code: Select all

default my_inventory = [
    {"name":"apple", "img":"apple.pg", "description":"An apple"},
    {"name":"lemon", "img":"lemon.pg", "description":"A lemon"},
    {"name":"plum", "img":"plum.pg", "description":"A plum"},
]

screen description_scr(txt):
    text txt align(0.5, 0.5)

screen inventory():

    tag menu
	
    use game_menu(_("Inventory"),scroll="viewport"):
	
        style_prefix "about"
		
        vbox:
            for item in my_inventory:
                imagebutton:
                    idle item["img"]
                    hover item["img"]
                    action NullAction() # change it to desirable action
                    hovered Show("description_scr", txt=item["description"])
                    unhovered Hide("description_scr")
https://www.renpy.org/doc/html/screen_actions.html#Show
https://www.renpy.org/doc/html/screen_actions.html#Hide
https://docs.python.org/release/2.6/tut ... ctionaries
Thanks! That helps out a lot!