Add an image to another image

I have a sprite which has an image of a box, and I want to put images on the box image so the box can be shown containing various things, and the box will need to move around.

So, what I need to do is take the box image, and draw other images on it (so I don't have to create sprites for each of those things and move them around together).

It seems all of the image drawing methods go to the screen. Is there a way to draw images on an existing image?

Here is a function that redirects all drawing from the screen to an image: Inside Playdate

1 Like

Looks like playdate.graphics.lockFocus(image) is what I am looking for. Thanks @Benzalo

1 Like

Also consider `pushContext' which works very similarly.

The difference is that lockFocus/unlockFocus only alternate between drawing on the screen vs. drawing to a specific destination image. Whereas pushContext/popContext are more flexible: they still redirect drawing to an image, but when you "pop" back at the end, you are returned to drawing WHEREVER you were drawing before. Doesn't have to be the screen itself.

So you can have drawing set to one image context, do some stuff, push a different context, then return to the former context without any need to keep track of where that was. popContext keeps track of that for you.

1 Like