Nockawa

Two new Texture types: FontTexture and MapTexture

4 posts in this topic

Hello people,

I'm out of my cave after many weeks of coding, so I figured I should make more announcements about my recent contributions.

In order to develop the Canvas2D feature I had to add two new types of Texture, here's a short summary.

FontTexture

This texture is used to create a Font Map, in order to render text efficiently. When you create an instance of this Texture you specify the Font Name (using CSS notation), the owner Scene, the maximum character count you wish to store (beware it's an approximation, but you should always be able to store at least this number) and the filtering mode. Upon creation the basic ASCII characters are automatically added, but you can also add other Unicode Character by calling the getChar method which will add the given character if it doesn't exist or return the corresponding info Object if it does.

Typical scenario is to parse all characters you want to render and call this method to be sure they are all present in the Map. Then you call the Update method to update (if necessary) the Texture to reflect the latest additions.

getCharInfo() return the character position in the map and its width. You also have access to the lineHeight Property which gives you...the height of a line! Finally you have a measureText method which will return the size taken by a given text. Line return and tabulation are supported.

Well, this class is simple and you can use it if you want, but you should be happy with the Text2D primitive in the Canvas2D.

MapTexture

This texture is a dynamic implementation of the 2D Bin Packing algorithm. It's mainly used when you want to store many different bitmap rectangles of different size in a single Texture, for rendering performance's sake.

We typically use this algorithm to build LightMaps, but I needed it to cache the content of Group2D in the Canvas2D feature.

One thing differentiate this implementation from the algorithm mentioned above: it's dynamic! You can free elements you allocated!

It's pretty straightforward to use: the constructor defines the name,  the size of the texture, the owner scene and the filtering mode.
Then you call allocateRect(size: Size) to find a slot to store your data, the returning PackedRect object gives all the information you need. You need to save this object if you want to release this allocation later by calling freeRect(rectInfo: PackedRect). If null is returned while calling allocateRect() it means the texture has no room to store what you asked for!
The freeSpace read-only property returns you the amount of free space in from the range of 0 (totally full) to 1 (totally free). Beware: due to fragmentation you may not allocate a rect of the corresponding area returned by freeSpace!

Three others methods are very useful: binTextureForRect/PosSize() and unbindTexture(). Use the first two to bind the texture to the texture as the render Frame Buffer targeting the region specified either by the PackedRect object or a Pos/Size info. Rendering will then be done in this area and this area only. You also have the possibility to clear the area during binding to start fresh! When you're done rendering, just call the unbind method to restore the WebGL state as is was before.

That's all folks! See you in the next announcement, because there are more stuffs to talk about! :)

Share this post


Link to post
Share on other sites

Well, both are used by the Canvs2D but there's no playground demo for these features, they're kind of technical/mid level features.

FontTexture is used by Text2D to store the fontMap.

MapTexture is used to cache the content of Cached Renderable Groups.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.