creating a next page function

[morg]

Hi! so I have coded this sort of clothes shop and everything is nice except one thing: the Ui is ugly. I Have a pic of a 3x3 grid and want to display 9 clothing items per page, but I don't know how to do that next page function. I've read leon's CG galleries and inventories with those systems but I didn't get a single thing, and in turn couldn't implement it. Could someone perhaps explain it to me? thanks in advance

[theCodeCat]

I would suggest something like this:

Code: Select all

screen shop(itemList,page=0):
	python:
		# Ideally the total number of pages should be calculated based off of
		# the number if items in the itemList, but to keep this simple I've hardcoded
		# the page count
		totalPages = 4
		
		# Grabs which items should be displayed on this page
		# NOTE: This list may hold less than 9 items
		itemsOnPage = itemList[9*page:9]
	
	# < Add screen code for displaying 'itemsOnPage' items in a 3x3 grid here >
	
	# The next-page button would look something like:
	if page < totalPages:
		textbutton "Next" action Show("shop",itemList,page=(page+1))
	
	# And the last-page button something like:
	if page > 0:
		textbutton "Back" action Show("shop",itemList,page=(page-1))

The screen itself just displays a particular page of the shop with the items you want, but also contains buttons that re-displays the screen with a larger or smaller page number.
To start it off you would write something like:
call screen shop([<items to display>])

(Since the "page" parameter has the default value of 0 you don't need to specify it when initially showing the screen)

[morg]

I seem to be doing something wrong, I typed this (I hope I understood you properly)

Code: Select all

screen shop(itemList,page=0):
   python:
      # Ideally the total number of pages should be calculated based off of
      # the number if items in the itemList, but to keep this simple I've hardcoded
      # the page count
      totalPages = 4
      
      # Grabs which items should be displayed on this page
      # NOTE: This list may hold less than 9 items
      itemsOnPage = itemList[9*page:9]
   grid 3 3:
       for item in chest:
           imagebutton auto item.icon action SetVariable("top", item.pic) #< Add screen code for displaying 'itemsOnPage' items in a 3x3 grid here >
   
   # The next-page button would look something like:
   if page < totalPages:
      textbutton "Next" action Show("shop",itemList,page=(page+1))
   
   # And the last-page button something like:
   if page > 0:
      textbutton "Back" action Show("shop",itemList,page=(page-1))

and it gave me this;

Code: Select all

While running game code:
  File "game/script.rpy", line 178, in script
    call screen shop([chest.items])
  File "renpy/common/000statements.rpy", line 452, in execute_call_screen
    args, kwargs = a.evaluate()
  File "game/script.rpy", line 178, in <module>
    call screen shop([chest.items])
AttributeError: 'RevertableSet' object has no attribute 'items'

I'm using a basic set to store my items in

Code: Select all

    $ chest = set()
    $ frillytop = Top("Frilly Crop Top", 25, "dressup/frillytop_icon_%s.png", "dressup/frillytop_pink.png")

so i guess there is a silly mistake there somewhere, lol. what should i do?

[theCodeCat]

I actually don't have much experience working with set objects in python, but it looks like the set class doesn't have an "items" property, so chest.items is meaningless.

At any rate, the screen code I gave assumes its been given a list and I would recommend using a list structure anyways since it allows you to specify the order in which items are displayed.

If for whatever reason you want to keep 'chest' as a set, you can convert it to a list before passing it to the screen by writing "list(chest)" instead of just "chest".

Other than that, there are 2 other mistakes I see.

1.

Code: Select all

        for item in chest:
# SHOULD BE
        for item in itemsOnPage:

because you are displaying the current page in a grid, not all of the items. The 'page' variable only affects 'itemsOnPage', so if you ignore 'itemsOnPage', then the current page value has 0 effect.

2. When calling the screen you should write

Code: Select all

#IF 'chest' is a list
call screen shop(chest)

#OR

# IF 'chest' is a set
call screen shop(list(chest))

When I wrote '[<items to display>]' I meant to indicate that you need pass in a list of items. ([] brackets get used to define lists in python)

[morg]

alright, so I edited the code a little bit;

Code: Select all

screen shop(itemList,page=0):
    add "park"
    add "girl" xalign 0.9
    python:
        totalpages = 4
        itemsOnPage = itemList[3*page:3]

    grid 1 3 xalign 0.1 yalign 0.2:    
        hbox:
            for item in itemsOnPage:
                frame:
                    imagebutton auto item.icon action SetVariable("top", item.pic)   
      
        hbox:
            text "empty"
        hbox:
            text "empty"
            
    textbutton "Done" action Return() xalign 0.1 yalign 0.9 
    if page < totalpages:
        textbutton "Next" action Show("shop",itemList,page=(page+1)) xalign 0.6 yalign 0.02
    if page > 0:
        textbutton "Back" action Show("shop",itemList,page=(page-1)) xalign 0.1 yalign 0.02
      

the screen displays properly when called but when I press the next button I get this error;

Code: Select all

While running game code:
  File "game/script.rpy", line 211, in script
    g "start game"
  File "renpy/common/000statements.rpy", line 457, in execute_call_screen
    store._return = renpy.call_screen(name, *args, **kwargs)
Exception: Required parameter itemList has no value.

not sure what this means? maybe there has been a confusion when I converted the set?

[DragoonHP]

Change Show("shop",itemList,page=(page-1)) to Show("shop", itemList=itemList, page=(page-1))

[morg]

thank you very much, the button works now.
But another problem has popped up, when I turn the page it shows me no clothes, even though I have added more than 3. (I've added five items, it shows me three on the first page but fails to show me the other two on the second)