This "game" lets you play around with position, anchor, and offset attributes on displayables to understand how they alter the position of items on the screen.

The example game above uses a 100 pixel by 100 pixel square as the displayable, positioned on a 1280 pixel by 720 pixel screen.

At a high level:

  • xpos and ypos represent the position of the anchorpoint onscreen (above denoted by the gray bars)
  • xanchor and yanchor represent the position within the displayable where position is measured (above denoted by the red dot)
  • xoffset and yoffset are further modifications to the position (above denoted by the yellow and green bars)

xalign (and yalign) simply sets xpos and xanchor to the same value

xcenter (and ycenter) simply sets xpos to the value and xanchor to 0.5

Interesting thing to try: Set the width or height of the displayable equal to the screen width or height, and notice how every value of align (including negative values) don't move the displayable at all. This is why you should generally avoid using xalign and yalign.


You can play around with this yourself by downloading the script.rpy file and throwing it into a new renpy project.

If you find this useful and want to support my gamedev efforts, consider checking out my games.

StatusReleased
CategoryTool
PlatformsHTML5
Rating
Rated 5.0 out of 5 stars
(10 total ratings)
Authorbobcjunk
Made withRen'Py
TagsRen'Py, tool, Tutorial

Download

Download
script.rpy 14 kB

Install instructions

Download script.rpy, create a new renpy game, and replace script.rpy in that new game

Comments

Log in with itch.io to leave a comment.

Thank you so much for this tool! I was having a hard time positioning my images and GUI!

Can I make a suggestion to create one 1080 × 1920 project too? It will be really cool! <3