2
votes

I'm making my first thing with libgdx. That's a tiled 2D game. Say I have two types of tiles: blue and green. Those are 32x32 pixel images that cover one cell on the game field. I want to be able to create a transition between tiles such as the one on the right of the image attached. Blue and green doesn't mean all pixels in a tile are the same color, that just defines what texture a pixel is from.

enter image description here

I'm not asking about an algorithm — I've already done it via canvas in JavaScript. I just need some directions on what classes/techniques/solutions to use specifically in libgdx.

So I need to take pixels from the blue texture and draw them above the green one. Is there a way to do this with a shader or maybe by directly taking pixel values from blue tile's texture?

Say I already have all my textures (with no transition sprites yet calculated) loaded in a TextureAtlas. What classes should go next to get the desired effect?

Update: Here is a rough example of what my code currently is. My gameScreen.render() method looks simply like this:

batch.begin();
for (int x = 0; x < width; x++) {
        for (int y = 0; y < height; y++) {
                Sprite sprite = getFloorSpriteByCell(cells[x][y]);
                batch.draw(sprite, x * 32, y * 32);
        }
}
batch.end();

and in getFloorSpriteByCell() I choose between some of preloaded sprites, that's all, no fancy level editing in a fancy gui-thing.

I don't use tilemaps, I just need to draw some part of a texture above another texture during rendering.

1

1 Answers

1
votes

Welp, I finished it, and here is how it looks:

Without diffusion:

enter image description here

With diffusion:

enter image description here

The code itself, I guess, is too large and project-specific to post it here. Here are the steps (actual classes from LibGDX are in bold starting with a capital letter):

  1. Pick individual pixels of an image you are diffusing into and put them into a Pixmap (if you have your textures in a TextureAtlas as I have had them, use a PixmapTextureAtlas class from this question on GoogleCode to get Pixmaps).
  2. Draw these Pixmaps to Textures
  3. Then, as usual, draw all Textures to a SpriteBatch.

Hope this will be useful for someone. Contact me if you need the actual code.