PDA

View Full Version : Rendering Game tokens like in Card Dungeon?



Michael Hartlef
27-03-2016, 22:00
Hi folks,

maybe you saw an tutorial/article before that explains how the 2D monster /player game tokens were rendered in games like Card Dungeon or Card Hunter?

I think it might be some kind of shader as I can't imagine that for each monster a 3D model was build.

Did you came across over this before?


https://www.youtube.com/watch?v=ah_FTLPXj14

Petr Schreiber
27-03-2016, 22:26
Hi Mike,

I did a very shameful variation to this in the past:
- render 8 quads, tightly packed one behind other
- first quad with proper character, alpha masked
- the rest with color reset to white, keeping the alpha

Don't do it at home! (But it worked for objects in longer distance, like these...).
It was expensive alpha-test wise, but with just a few quads...


Petr

Michael Hartlef
28-03-2016, 09:20
Thanks Petr for your idea. Sounds good, how did it look when you circle the camera around it? I am sure the gaps were showing, or?

Petr Schreiber
28-03-2016, 18:11
In original solution, I solved it (partially) by collapsed quads (looked like letter V from top).

I was thinking about it again now, and I bring new solution with slices + vertical and horizontal beams.


Petr

Michael Hartlef
28-03-2016, 18:30
Looks great. To bad I can't test it with my own images. PNG is not supported and when exporting to TGA, it says the file format is not supported.

Petr Schreiber
28-03-2016, 18:35
You should be able to use own TGAs.

Open your PNG in GIMP and when saving:
- uncheck the RLE compression
- choose left down (maybe bottom down, not sure) option

This way it will work. Loading PNG is possible via custom wrapper using TBGL_MakeTexture + GDIPlus.
I cannot find it at the moment, but I will try again.


Petr

Petr Schreiber
28-03-2016, 19:37
Hi Mike,

why struggle with TGA, when we can have PNG, right?
I could not find the code so I wrote it from scratch, please redownload Cards.zip to see, how to load PNG now.

I made SmartTexture a github project (http://www.thinbasic.com/community/showthread.php?12676-SmartTexture-unit-for-texture-loading), so feel free to fork and give pull requests...


Petr

Michael Hartlef
28-03-2016, 20:36
Awesome Petr, like always. Is there a way to have the image rendered on both sides?

Michael Hartlef
28-03-2016, 20:37
And what is a tbasicU file again? Been so long away from TB.

Michael Hartlef
28-03-2016, 20:51
Here is a small result.

9598

primo
28-03-2016, 21:24
very nice idea and nice graphics, thanks, i suggest also the possibility to scale the m15 model so it is very thin, such as adding:
TBGL_Scale 0.01, 1, 1
before:
tbgl_m15DrawModel 1
in example TBGL_AnimatedCubes.tbasic inside the thinbasic folder
so it appears as flat and very funny. this is if there is no 2D shapes available.
but i guess there should be some care in texturing else it may flicker.
at the beginning of that Cubes.m15 model in the TBGL_AnimatedCubes example there is:
VERTEXNUM,64
TEXLIST,kp4_LedKonzistentni.bmp
so can we texture it with TEXLIST,kp4_LedKonzistentni.png . or this feature not available yet.
thanks Petr for all your efforts.

Petr Schreiber
29-03-2016, 06:50
Hi Primo,

I will make SmartTexture.tbasicu part of m15 solution, but before that I need to solve a few more important problems in the solution.
But yes, it should make it possible to use BMP/TGA/JPG/PNG for textures :)

Mike! Thanks! Very nice monsterito :) The unit is called smartTexture.tbasicu, and you can download it from here: https://github.com/petrSchreiber/SmartTexture/releases/
(as described in dedicated forum post: http://www.thinbasic.com/community/showthread.php?12676-SmartTexture-unit-for-texture-loading).
Image on second side should not be a problem at all, if you won't crack it in the meantime, I will check once I have a free evening.

Michael Hartlef
29-03-2016, 21:24
Thanks Petr,

its a cyclops from a game I am working on. Btw. I got the backside rendering the image too. Like you said, very easy... once you know how :-) Thanks for the initial code and smart texture module.