Here’s a really simple example showing how to slice up a sprite sheet using an atlas and then drawing the individual tiles using those slices. Very useful for 2D tile-based games
API Covered
image.read() image.atlas image.slice scene
Learn to Codea?
This is be part of an ongoing series called “Learn to Codea”, which will cover a variety of topics from beginner to advanced and everything in-between
@John - thanks for the post, have used it on one of my sprite sheets, pretty easy to apply. I think that a tutorial would be very useful for new and old forum members.
@John - just had a couple of crashes with the latest Atlas/Slice demo. First crash whilst trying to scroll up or down to on the screen trying to find Settings (from the Apps summary) - reported directly.
Second incident whilst changing the sprite capture size and display sizes, I was trying to condense the image to give richer colours by changing sprite size alone.
@John - whilst running a project on Codea, dragging up from the centre bottom of the screen produces a screen with organized apps on the device in ‘boxes’.
On the second crash - I was using your code with a different sprite-sheet, which is 1.3mb in size. It loaded up and displayed OK (same sprite-sheet) as above - I just changed the tilesetImg to the file path (only changing the filename - path unchanged).
I also changed the tilesetAtlas:setWithCellSize to 64/64
Note - that’s not meant to be setWidthCellSize ???
then
scn.pixelsPerUnit = 64
Note I tried changing the latter to different values without changing the former.
Does Codea freeze the running project when the iPad is being used for a parallel app ?
Ah I see. Not sure about the first one but for the second one I’d need to have a look at the image you used to see if there’s something going on there. pixelsPerUnit shouldn’t cause a crash no matter what its set to…
@John - on the graphic front I found an issue with the file involved.
Moving on from that I tried your demo with a crude file I had built to try to change the sprite display. I have commented that in V4 the graphics seem to be larger than in V3. Now I think it may be due to the 2D camera provision for 2D scenes.
I tried to build a project using a parameter to change the camera ortho.size which appears to be a scaling factor. I can sometimes get the display to work but errors are thrown up.
I enclose a zipped file, could you point out the errors I have made. spritesheettester.zip (1.2 MB)
@Bri_G So the scene.pixelsPerUnit property lets you scale sprites up or down to make them fit within certain units without needing scale them using transforms. So in the original example, each sprite is 16x16 pixels and I wanted to have game units of 1x1 for each square (usually better for things like physics). So settings pixelsPerUnit to 16 makes sprites draw 16 pixels wide for each 1 unit in world space. If you set it to 1, then its just regular pixels (1 unit = 1 pixel).
I haven’t properly put in code to handle @2x anda @3x images so some of them might be too big or too small. I need to fix this
Bit confused ! I’ve been away from Codea for a while and just downloaded the Atlas and Slice demo, which seems to run fine. BUT in the Part1 class I see no function Part1:draw(), although it is called from Main. In the Part1 tab there are 47 lines of code but all are under function part1:setup(). Am I missing something ? It runs without errors, but I see no drawing function
Basically you’ll see there’s a line where it sets scene.main = ... which is a way of automatically drawing/updating a scene without having to call draw. I made the draw part optional (if statement) in case I wanted to draw anything else on top of the scene
I’m not the smartest programmer but I’m not dumb, or at least not irredeemably so, and I am finding this demo fairly incomprehensible, especially as something intended, presumably, for beginners.
I understand what it’s doing, I think, but I’ve wrestled with it for a couple days now, trying to adjust numbers here and there, and to change this and that, and I still can’t make it do anything I want it to. Every change I make just breaks it in a way I can’t figure out and I have to start over. So for a tutorial it’s almost entirely opaque to me.
I see that everyone else seems to understand it instantly so it does seem that I’m slower on the uptake than most around here.
OTOH I’d say it’s pretty likely that other people who didn’t understand it were too embarrassed to admit it.
Can you give an example of something you are trying to do and how its breaking? I commented almost every step of the demo so maybe I’m not getting what the specific issues with it is?
