Android Question libGDX, basic4Android and PNG tilemaps

[sc3000survivors]

Hello,

I am trying to understand how tilemaps work in order to design a tiny tilemap engine like the retro video display processors. I decided to start from the amazing Pacdroid, and I understood how the tilemaps work: get and put tiles, layers etc. Very cool library.

Now I want to understand if i can color remap individual tiles. Here's the practical example... I have a screen like the retrocomputers screens, made of 32 by 24 8x8 pixel tiles. I want to print a text using the tiles ordered by the ASCII characters index, let's say something like:

PRINT AT 10,10 "HELLO WORLD!"

The routine is something that set the X and Y tile starting position, then a cycle that gets the char code of each character in the string, then gets the corresponding tile ( space: 32, H: 72 etc... ). And it works and it's incredibly fast. This library is cool.

Now what if I want to change the color of the tiles? For example if I want to change the text color:

COLOR RED: PRINT AT 10,10 "HELLO WORLD!"

At this point If there is a way to remap the color of the tile it would be good, but I will change also the color of the background pixels. So I should use a tileset with the alpha channel so that I will remap only the "foreground" color. So I used a png image imported in Tiled and saved as a tmx. Now the map is loaded, and the layer is shown correctly with the correct transparency, but if I try to change a tile on the layer the program crashes.

The tilemap is initialised in the "clsMaze" class like Pacdroid does:

Sub Class_Globals
    Private Maps As lgMapTiledMap
   
    Private MapRenderer As lgMapOrthogonalTiledMapRenderer
    Dim CurrentLayer As lgMapTiledMapLayer
    Dim MapWidth, MapHeight As Int 'in tiles
    Dim TileSize As Float 'in pixels
   
    Dim TotalTiles As Int = (256)
    Dim Tiles(TotalTiles) As lgMapStaticTiledMapTile 

End Sub

'Loads the mazes and initializes the map renderer
Public Sub Initialize(Width As Int, Height As Int, GutterSize As Float, SpriteBatch As lgSpriteBatch)
    'Loads the mazes (TMX format)
    LoadMazes

    'Initializes the map renderer and computes the tile size
    MapWidth = Maps.Properties.Get("width")
    MapHeight = Maps.Properties.Get("height")
    Dim TileWidth As Int = Maps.Properties.Get("tilewidth")
    Dim TileHeight As Int = Maps.Properties.Get("tileheight")
    Dim RatioW As Float = Width / (TileWidth * MapWidth)
    Dim RatioH As Float = (Height - (GutterSize * 2)) / (TileHeight * MapHeight)
    If RatioW < RatioH Then
        MapRenderer.Initialize4(Maps, RatioW, SpriteBatch)
        TileSize = MapRenderer.UnitScale * TileWidth
    Else
        MapRenderer.Initialize4(Maps, RatioH, SpriteBatch)
        TileSize = MapRenderer.UnitScale * TileHeight
    End If

    'Selects the default layer
    SelectLayer(0)

    'Gets the reference tiles
    GetRefTiles
End Sub

Private Sub LoadMazes
    'Loads the mazes (TMX format)
    Dim TMXLoader As lgMapTmxMapLoader
    Maps = TMXLoader.Initialize2("maps/Ardisplay.tmx")
End Sub

And the code that change a tile on the layer is:

Sub LG_Update
...
Dim TileX, TileY, NumTile As Int = 0
Maze.CurrentLayer.GetCell(TileX, TileY).Tile = Maze.Tiles(NumTile)
...
End Sub

Where Maze.Tiles is an array of

    Dim TotalTiles As Int = (256)
    Dim Tiles(TotalTiles) As lgMapStaticTiledMapTile

Everything works if I use a tileset derived from a bmp image, but it crashes when I use a png. Is there an issue or I should use another way to do this? I hope I have been clear in my explainantion.

Thanks.

 

[sc3000survivors]

Hello to all, actually I saw what the problem was, and it was a simple problem caused by a null pointer. I fixed the problem, now I have to understand if I can remap the color of a tile and if it's possible to redefine the tiles during run-time. Thanks anyway!

 

[acidrain1]

Looks like it's a zx-spectrum screen?)) I do looking for some similar decision. Is any idea now?

 

[sc3000survivors]

Actually I would like to do something like the TMS9918 that was one of the common Video Display Processor of that ages. Since you mentioned the glorious ZX Spectrum, I developed several online emulators written in Actionscript for FLASH player:

CBS Colecovision: http://www.digimorf.com/graphics/fcv/
SEGA SG-1000/SC-3000: http://www.play-sc-3000.com/
SEGA Master System: http://www.digimorf.com/graphics/ASms/
MSX: http://www.digimorf.com/graphics/ASmsx/

Playable PACMAN in 3D cabinet: http://www.digimorf.com/graphics/FlaME/pacman3D.htm

and other arcade games such as BombJack, Solomon's Key, Pengo, Crush Roller, Lady Bug...

Basically the concept behind the graphic engine is to access to the memory where the graphic tiles are defined. Unfortunately I had to freeze my project because I don't have time right now to go on with it, but I still haven't found something helpful to solve this problem with libGDX.

 

[Informatix]

Why not using a bitmap font instead? If I understand well, you want to reproduce what was done with Ascii characters on old computers (with semi-graphics characters). There are plenty of fonts allowing to do that. If you want to address each "block" individually, you can create 32x24 Scene2D labels in a table (one label per cell).

 

[acidrain1]

My excuses but I have some off-topic questions - is there a way to do some visual effects like "blur" or "glow" on sprite or views? Is there a way to use layers with libGDX f.ex. I need partialy show backgound? Thanks in advance from newbie in b4a and android scene though ))

 

[Informatix]

My excuses but I have some off-topic questions - is there a way to do some visual effects like "blur" or "glow" on sprite or views? Is there a way to use layers with libGDX f.ex. I need partialy show backgound? Thanks in advance from newbie in b4a and android scene though ))

Blur and glow effects are made with shaders. Shaders (and their language) are not the easiest part of OpenGL but, fortunately, there's a lot of code available on Internet. Start by looking here for tutorials.
For semi-transparent effects, you just have to set the alpha value of your sprite (see the setRGBA and DrawAlpha functions, and the Alpha property) under 1.

 

[sc3000survivors]

Why not using a bitmap font instead? If I understand well, you want to reproduce what was done with Ascii characters on old computers (with semi-graphics characters). There are plenty of fonts allowing to do that. If you want to address each "block" individually, you can create 32x24 Scene2D labels in a table (one label per cell).

Hi Informatix,

so what you mean is that I can use a bitmap character for each graphic tile. Every character (portion of bitmap) is a tile from the bitmap font, is this correct? In this case I can access to the original bitmap font and change the pixels, right? But in your experience is this fast like the tile engine? Is there some example or demo I can evaluate?

Thanks.

 

[Informatix]

Hi Informatix,

so what you mean is that I can use a bitmap character for each graphic tile. Every character (portion of bitmap) is a tile from the bitmap font, is this correct? In this case I can access to the original bitmap font and change the pixels, right? But in your experience is this fast like the tile engine? Is there some example or demo I can evaluate?

Thanks.

You don't need to use tiles at all. You create your bitmap font from a TTF file, as I did in some examples or with the Hiero tool, and you use this bitmap font in a lgScn2DLabel. You create a lgScn2DTable with 32 columns and 24 rows, and place each label in a cell of this table. Now, when you want to display B on screen at position 10, 10, you set the value of the label in the corresponding cell to B. To access easily to a certain label, you can name it like this: "10, 10" and retrieve it with FindActor(Column & ", " & Row). You can change the label color with the color markups (see the BitmapFont demo).
Examples of fonts with semigraphical characters: Color basic, C64

 

[acidrain1]

Dear Informatix, thanks for your effort and help! Where can I have a detailed description of how to use SetColorsRGBA?

 

[Informatix]

Dear Informatix, thanks for your effort and help! Where can I have a detailed description of how to use SetColorsRGBA?

This function is documented. In the IDE, you should read in the help balloon:

Sets the color of this sprite.
R: Red, from 0 to 1
G: Green, from 0 to 1
B: Blue, from 0 to 1
A: Alpha, from 0 to 1

To make your sprite semi-transparent with a red tint, for example, you can call setColorRGBA(1, 0, 0, 0.5).