Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Classic Chat / isometric sprite sheet

Author
Message
TheViking
12
Years of Service
User Offline
Joined: 16th Feb 2012
Location:
Posted: 24th Jul 2013 03:40
Hey everyone,

Just wondering if there is any better way to utilize the space on a sprite sheet when making tiles isometric. My current res is set for 1200x768, and to make the tiles large enough to even see decent they will need to be 256x256, when angled. However, about half of the sprite sheet is pretty much just waste, except that it can be useful sometimes to have that extra empty area.

Anyways, making the sheet 1024x1024 only yields 16 sprites, and I will require MANY more than this to work with. Is there any suggestions or useful info you have about this?

Thanks,
Ancient Lady
Valued Member
20
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 24th Jul 2013 06:13
Instead of making the images angled, why don't you just apply an angle to the sprite after it is created with the 'straight' image?

Cheers,
Ancient Lady
AGK Community Tester and AppGameKit Master
TheViking
12
Years of Service
User Offline
Joined: 16th Feb 2012
Location:
Posted: 24th Jul 2013 06:32 Edited at: 24th Jul 2013 08:21
wouldn't that distort the image? Like how it would in a paint program?

Aslo, is 256x256 too large for map tiles?
Van B
Moderator
21
Years of Service
User Offline
Joined: 8th Oct 2002
Location: Sunnyvale
Posted: 24th Jul 2013 14:03
256x256 would give a pretty huge play area, like if each tile is scaled at say, 1 meter wide, then that's 65k square metres. Now the actual data for that might not be an issue - but designing a map that big would be.

Have you considered using 3D instead?

Like, the floor would be a matrix, so each floor tile could be just 128x128, or even 64x64, giving a much easier system to work with - you can fit 64 tiles on just a 256x256 images that way.
Structures like buildings could be solid 3D models, and more complicated organic things like trees could be 3D sprites.

With 3D, it'd be easy to work with Z layers, less math because you won't have to convert between iso and 2D with everything, scrolling would be easy too. I'd set the FOV of the camera really narrow, set the camera position way back, like -10,000z from the actual polygons - which would mimic a orthographic view. It would look 2D, but give the impression and benefits of actual 3D. Characters could still be 2D sprites. Even though AGK's 3D capabilities are somewhat infant right now - I'm sure it could handle a mock isometric engine, especially if you want the control over things like lighting. It's difficult to get lighting working on 3D models... but you can skip that and just rely on texturing and sprite work to define the lighting. I'd lock down the camera, so it moves with the player, but doesn't rotate - then you can really get creative with the sprites.

Seriously, as long as your prepared to put in the work with pixel art, it could look great, it would function great too - much easier to code with 3D than to code isometric I think.

I got a fever, and the only prescription, is more memes.
Ancient Lady
Valued Member
20
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 24th Jul 2013 16:19
Changing the angle of a sprite doesn't distort it. Or maybe I'm misunderstanding your question?

Cheers,
Ancient Lady
AGK Community Tester and AppGameKit Master
Van B
Moderator
21
Years of Service
User Offline
Joined: 8th Oct 2002
Location: Sunnyvale
Posted: 24th Jul 2013 16:31
You'd have to squish the sprite at opposite corners to do that, that's if I'm imagining what Ancient Lady is.

Like, if you start with a square sprite, rotate it 45 degrees, then take that and scale it vertically by 50%, you'd have an isometric sprite from a convenient square image. But the only way to do that in AppGameKit, would probably involve using sprite scissors, probably making it too slow. A sprite can only be scaled uniformally on an axis, X and/or Y - and the scaling is along the axis, to get the results Lady means, we'd have to be able to scale a sprite across the XY axis, which doesn't exist... once we have a diamond shape, we can't scale it vertically, only diagonally.

I got a fever, and the only prescription, is more memes.
Ancient Lady
Valued Member
20
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 24th Jul 2013 16:43
If you create a square sprite (or rectangular) from a square (or rectangular) image and then call SetSpriteAngle, that doesn't distort anything.

I was responding to this "they will need to be 256x256, when angled."

Again, maybe I just misunderstood.

Cheers,
Ancient Lady
AGK Community Tester and AppGameKit Master
Digital Awakening
AGK Developer
22
Years of Service
User Offline
Joined: 27th Aug 2002
Location: Sweden
Posted: 24th Jul 2013 16:56
I don't think there is any good solution to this if you want to make it 2D. But the tiles would be 256x128. Doubling the number of tiles on your sheets. For older devices I would suggest using smaller tiles, like 128x64. There are devices that can load 2k images (2048x2048). IIRC Tegra 4 supports 4k images, so does most PCs. You can always release 2 versions, one HD.

Van B
Moderator
21
Years of Service
User Offline
Joined: 8th Oct 2002
Location: Sunnyvale
Posted: 24th Jul 2013 18:02
Ahh, I kinda disregarded that bit, assumed he was just referring to the resolution of image he's having to use to retain quality. I thought that you wanted to rotate and scale a square sprite, to make a diamond isometric version.

I got a fever, and the only prescription, is more memes.
Digital Awakening
AGK Developer
22
Years of Service
User Offline
Joined: 27th Aug 2002
Location: Sweden
Posted: 24th Jul 2013 18:49
Van:
That would be useful as you could save image space. When you use square tiles to make isometric graphics, half the image is unused.

Van B
Moderator
21
Years of Service
User Offline
Joined: 8th Oct 2002
Location: Sunnyvale
Posted: 24th Jul 2013 20:24
Yeah, I guess the major downside with it, is how tricky it would be to add detail without it looking too flat. I mean, when drawing isometric tiles, there's always the option of making them pop out the 'ground' a bit more, grass can be actual blades for instance - stuff that would be really tricky to get right with a flat square texture.

But that's the whole appeal of isometric games these days, they can look damn nice, can effectively mix 3D and 2D elements and take the necessary control over their appearance... it just takes a lot of pixel work. People who make isometric sprites tend to know what they're in for though. There are so many puzzles with isometric maps especially - like the shape of the floor tiles, where does that extra pixel come from to make things line up perfectly - how to handle different sized objects - how to handle tile edges, and transitions - how to deal with zdepth sorting - how a building is composed, 1 big sprite with a zdepth trauma to go with it, or several sprites linked together and a pixel art trauma to go with that . That's why I suggest mixing 2D and 3D skipping a whole host of issues in the process. Anyway, sorry to ramble

I got a fever, and the only prescription, is more memes.
TheViking
12
Years of Service
User Offline
Joined: 16th Feb 2012
Location:
Posted: 25th Jul 2013 03:48
thanks all, and sorry about any confusion in the question . I forgot about scale sprite. I also, did cut it down to 256x128. However, I will try just going with 128x64. my device runs at 1200x800, and that's why I was going for that resolution, also from my understanding any device which runs at a higher resolution would look much smaller on the screen, would it not? or am I mistaken? I guess however I can still use that resolution and scale up x2 or x4.

Van: Yeah, that's kind of what I mean, how it seems you would lose out on some of the fine detail and the 3d look if rotated/squished. I have thought of 3d, however, last I read, AppGameKit does not support 3D, unless you are referring to model 3d then transpose into 2d by rendering images. It does save LOTS of time doing it that way, as I have done some work like that before. Though, I am starting to enjoy the 2D sprite work. I do know how much more work it is. I have minimized the amount of work slightly by making a few different layers which are more transparent with the single object on it so it can be placed over dirt/grass/pavement/etc.

Anyways, the programming aspect did seem much more tricky as mentioned with trying to align stuff properly, though I think I got it ok for now, just need to work on the sprites more.

Thanks again all.
Ancient Lady
Valued Member
20
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 25th Jul 2013 04:49
AGK scales up (or down) to the max resolution of the device.

My 960x640 landscape game fills my iPad 2 and iPad 3 as well as my iPod Touch (iPhone substitute tester).

The AppGameKit app will always take up as much possible space on the device as it can. But it will keep the ratio of your virtual resolution, if you are using virtual, and put black bars either above/below or left/right, depending on the actual width/height ratios of the device and your app. And there are ways to fill those black spaces, if you want.

AGK v108+ does support 3D. Just not as fully as DarkBasic Pro.

Cheers,
Ancient Lady
AGK Community Tester and AppGameKit Master
Marl
12
Years of Service
User Offline
Joined: 19th Nov 2011
Location: Bradford, UK
Posted: 25th Jul 2013 10:06 Edited at: 25th Jul 2013 10:07
There is another way to do this but it may be to complex for what you want.

As stated on an isometric tilesheet, half the space is unused.

This space could theoretically be used as a second tile set - kind of interleaved with the first.

All that would be needed would be to apply a mask to the alpha channel of the image to make the unused set transparent.

Only one set could be used at once, but it would save space if you had a different tile set for indoors and outdoors.
Van B
Moderator
21
Years of Service
User Offline
Joined: 8th Oct 2002
Location: Sunnyvale
Posted: 25th Jul 2013 14:27
That would be cool - it's a shame we can't just re-shape sprite plains. Like, if we rotated a sprite by 45 degrees, then moved the top and bottom vertex, we'd have an isometric tile shaped sprite, that could use square textures and a lot of that extra space could be used up, because of the shape of the sprite.

This stuff is something of an issue that I find with high level languages, and Apples new game-centric framework will have the same issue. To do anything more complex with sprite shapes, we need access to the vertex data for a sprite, and we never get that. It's one aspect of working with native C++ libraries that I like - you can do all sorts of cool tricks with that sort of access. Hopefully we'll get vertex access for 3D which will at least let us transfer our DBPro memblock mesh knowledge and do some cool stuff.

I got a fever, and the only prescription, is more memes.
3d point in space
15
Years of Service
User Offline
Joined: 30th Jun 2009
Location: Idaho
Posted: 25th Jul 2013 14:41 Edited at: 25th Jul 2013 14:52
Actually there is a easy way to do it, Tiled. I actually have created the iso map parser, but don't use it I have not included it in the sprite maker I have know, because I am making a two d ortho game. I believe it is my old post in the showcase but that is hefty code. I will probably do ortho soon just have not got around to it in the sprite engine, then load it as a agk file and modify it. I had to change my sprite sheet so there is space in between the sprites. I have stopped making the 3d part since hokey kid developed his fpsc exporter, because that seems a lot better then what I have, I am just leaving the 3d the way it is make a exporter but I won't go to much further into it.

Developer of Space Chips, pianobasic, zipzapzoom, and vet pinball apps. Developed the tiled map engine seen on the showcase. Veteran for the military.
JimHawkins
15
Years of Service
User Offline
Joined: 26th Jul 2009
Location: Hull - UK
Posted: 25th Jul 2013 15:59
Why not create an isometric tile image, then transform it into a distorted rectangle. At load time, rotate the relevant amount to restore the original.

-- Jim DO IT FASTER, EASIER AND BETTER WITH AppGameKit FOR PASCAL
3d point in space
15
Years of Service
User Offline
Joined: 30th Jun 2009
Location: Idaho
Posted: 25th Jul 2013 17:29 Edited at: 25th Jul 2013 17:32
Jim I actually just tried to do iso, I found a problem already sprite sheet animation does not do 45 degree maps. So I thought I could do it with what I had and I got a non ISO Map. I programmed it then I said oh. I am so stupid sometimes that I see why it won’t work with the current sprite animation command. I would have to do some serious programming to fix that. The only way it would work is if you have space between your sprites.

Developer of Space Chips, pianobasic, zipzapzoom, and vet pinball apps. Developed the tiled map engine seen on the showcase. Veteran for the military.
Ancient Lady
Valued Member
20
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 25th Jul 2013 17:49
If you use a sprite sheet for animation, you definitely need at least a one pixel transparent buffer on all four sides of each image.

This is a known thing about animation from images. It also applies to UV offsetting.

Cheers,
Ancient Lady
AGK Community Tester and AppGameKit Master
3d point in space
15
Years of Service
User Offline
Joined: 30th Jun 2009
Location: Idaho
Posted: 25th Jul 2013 19:37 Edited at: 25th Jul 2013 19:42
Done, I redid the iso today. Too bad that I am not putting this out just yet though. This is iso but i used a regular sprite sheet to test it. Like I said you have to make sure that the image is isometric in the sprite sheet.


Developer of Space Chips, pianobasic, zipzapzoom, and vet pinball apps. Developed the tiled map engine seen on the showcase. Veteran for the military.

Attachments

Login to view attachments
TheViking
12
Years of Service
User Offline
Joined: 16th Feb 2012
Location:
Posted: 26th Jul 2013 01:16 Edited at: 26th Jul 2013 01:21
Cool. I did make a map editor though, it's only for standard tiles which I will try to make a iso option. It seems like the biggest problem I will have is programming the depth so that when on a edge of raised tiles you show above, though when on the other side below a hill like section you show below, if that makes sense. I am sure I'll figure it out though.

Also, I take it that when placing tiles, that each one should be offset an extra one pixel down and to the left or right so that they seem to "link" together? Or am I not creating the tiles properly?
3d point in space
15
Years of Service
User Offline
Joined: 30th Jun 2009
Location: Idaho
Posted: 26th Jul 2013 01:24 Edited at: 26th Jul 2013 01:55
I just cut this out of my editor hope it helps this takes a vector frameimg from tiled. I just wrote this function. If you already have a tiled importor this will help to see what I did.


this is the part that that is the easy part about it


Developer of Space Chips, pianobasic, zipzapzoom, and vet pinball apps. Developed the tiled map engine seen on the showcase. Veteran for the military.

Login to post a reply

Server time is: 2024-10-06 08:00:33
Your offset time is: 2024-10-06 08:00:33