Setting sketch size when using Py5Graphics?

[kresdjan]

If I set the py5.size() method in the setup() to something like py5.size(400, 400) I get thrown a runtime error.

    4    def setup():
 (...)
    10   
    11       canvas_width = 500
    12       canvas_height = int(canvas_width * 1.41421)
    13   
--> 14       py5.size(canvas_width, canvas_height)
    15   
    ..................................................
     canvas_width = 500
     canvas_height = 707
    ..................................................

RuntimeError: Cannot call the size() method here. Either move it to a settings() function or move it to closer to the start of setup().

But how I am supposed to set a canvas size? In the Processing example they do set the size() https://processing.org/reference/PGraphics.html but not so on py5 documentation http://py5coding.org/reference/py5graphics.html,

example code

import py5


def setup():
    global canvas_width
    global canvas_height
    global pg1
    global pg2
    global pg3

    canvas_width = 500
    canvas_height = int(canvas_width * 1.41421)

    py5.size(canvas_width, canvas_height)

    pg1 = py5.create_graphics(canvas_width, int(canvas_height / 3))
    pg2 = py5.create_graphics(canvas_width, int(canvas_height / 3))
    pg3 = py5.create_graphics(canvas_width, int(canvas_height / 3))


def draw():
    pg1.begin_draw()
    pg1.background("#00ff00")
    pg1.end_draw()

    pg2.begin_draw()
    pg2.background(0)
    pg2.fill("#ff00ff")
    pg2.circle(0, 0, 100)
    pg2.end_draw()
    
    pg3.begin_draw()
    pg3.background("#0000ff")
    pg3.rect(0, 0, 200, 200)
    pg3.end_draw()

    py5.image(pg1, 0, 0)
    py5.image(pg2, 0, canvas_height)
    py5.image(pg3, 0, canvas_height * 2)


py5.run_sketch()

And if I set the render to P2D I get thrown an error that createGraphics() requires size().

    4    def setup():
 (...)
    12       canvas_height = int(canvas_width * 1.41421)
    13   
    14       # py5.size(canvas_width, canvas_height)
    15   
--> 16       pg1 = py5.create_graphics(canvas_width, int(canvas_height / 3), py5.P2D)
    17       pg2 = py5.create_graphics(canvas_width, int(canvas_height / 3), py5.P2D)
    ..................................................
     canvas_width = 500
     canvas_height = 707
     py5.P2D = 'processing.opengl.PGraphics2D'
    ..................................................

java.lang.RuntimeException: java.lang.RuntimeException: createGraphics() with P2D requires size() to use P2D or P3D

[hx2A]

Hi @kresdjan ! Thanks for giving py5 a try.

Can you move the call to py5.size() to the beginning of the setup() function? You can have it after the global statements and comments but not after anything else. Like this:

canvas_width = 500
canvas_height = int(canvas_width * 1.41421)

def setup():
    global pg1, pg2, pg3
    py5.size(canvas_width, canvas_height)

    pg1 = py5.create_graphics(canvas_width, int(canvas_height / 3))
    pg2 = py5.create_graphics(canvas_width, int(canvas_height / 3))
    pg3 = py5.create_graphics(canvas_width, int(canvas_height / 3))

py5, like Processing, requires you to call size() at the beginning of setup(). The reason for this is that both py5 and Processing do some magic to partition the setup() function into two functions: settings() and setup(). The call to size() goes into settings(). The other stuff goes into setup().

I see you wanted to define the two canvas_width and canvas_height variables and use them later to access the width and height. You can also use py5.width and py5.height for that. Your program can be like this:

def setup():
    global pg1, pg2, pg3
    py5.size(500, int(500 * 1.41421))

    pg1 = py5.create_graphics(py5.width, int(py5.height / 3))
    pg2 = py5.create_graphics(py5.width, int(py5.height / 3))
    pg3 = py5.create_graphics(py5.width, int(py5.height / 3))


def draw():
    pg1.begin_draw()
    pg1.background("#00ff00")
    pg1.end_draw()

    pg2.begin_draw()
    pg2.background(0)
    pg2.fill("#ff00ff")
    pg2.circle(0, 0, 100)
    pg2.end_draw()
    
    pg3.begin_draw()
    pg3.background("#0000ff")
    pg3.rect(0, 0, 200, 200)
    pg3.end_draw()

    py5.image(pg1, 0, 0)
    py5.image(pg2, 0, py5.height)
    py5.image(pg3, 0, py5.height * 2)

I also see you did get a bit tripped up by this page:

http://py5coding.org/reference/py5graphics.html

In py5, like Processing, there is in implicit call to py5.size(100, 100) if you don't make your own call to py5.size(). Perhaps it is not the best choice for the py5 documentation to not call py5.size() explicitly. @villares , what do you think?

[kresdjan]

@hx2A Haha. I thought I had moved it to the top, but no 😆. Thanks.

Perhaps it is not the best choice for the py5 documentation to not call py5.size() explicitly. @villares , what do you think?

It is properly not necessary. I think most people get it, except me.

[hx2A]

It is properly not necessary. I think most people get it, except me.

Usually if one person is confused about something, there are also others whom I never hear from.

Part of the reason why the size(100, 100) calls are omitted from the documentation is because the example images are all 100x100, which is what Processing had for their documentation when I started working on py5. Now their example images are 200x200, and as a result they must include the call to size() everywhere. I do think the py5 documentation could be improved by also increasing the size of the example images to 200x200, and maybe also including some animated GIFs. This is something I couldn't have done before but can do now.

[villares]

Yeah, maybe it is a good idea... "explicit is better than implicit" from the Zen of Python :D

I'm glad it worked out in the end @kresdjan !

[hx2A]

Yeah, maybe it is a good idea... "explicit is better than implicit" from the Zen of Python :D

Yes, the Zen of Python can guide us here.

I'd like to upgrade the examples to be 200x200 and to support animated GIFs. This enhancement would eliminate the implicit py5.size(100, 100) call.