Re-implementing Tilesheet to expand functionality

With the current implementation of Tilesheet I couldn’t find a way to render at low resolution to avoid half pixels in a pixel art game, and shaders for simple filters.

My idea was to recreate the same api that Tilesheet provides and add the option of setting a shader using agal language and the recently implementation of stage3d and context3d. The first trouble I found during my initial experiment was that you can’t use Context3d.setRenderToTexture in native so I can’t render to a lower texture and then scale, and I can’t create filters(at least not the ones that need to draw to a second buffer). The main problems problems I want to tackle can’t be achieved apparently.

I don’t know if it is a good idea what I’m doing, and I couldn’t find answers if the future of openfl was going to tackle the problem of Tilesheet+shaders any time soon.

Any thoughts or help are welcome.

Yes, OpenFL will have Tilesheet + shaders (also, filters, cacheAsBitmap and cacheAsBitmapMatrix) https://github.com/openfl/openfl/pull/697

1 Like

BRAVO!!! Didn’t thought the implementation was already among us. OpenFl is getting a lot of goodies this year =).

-Is there a way to render into a smaller backBuffer an then scale it? pixelisation is what I want.

-Is the shader language just GLSL? I’m asking this because in theory we could some of the GLSL to AGAL converters and update the api in TilesheetStage3d

-Can we use this with drawTriangles?

Again awesome work! :thumbsup:

1 Like
  1. Yes, use cacheAsBitmapMatrix
  2. Only GLSL for now.
  3. Not sure what do you mean, it won’t be possible to use it directly but you can cache the sprite and use the shader there.

Thank you for your answers!

-Is there a way to render into a smaller backBuffer an then scale it?
Is it efficient to cacheAsBitmapMatrix every frame? like render the whole game in a small buffer and then scale every frame.

-Can we use this with drawTriangles?
Like if you if you have a cape/flag were you can’t get away using skew and you create an animated mesh, and an artist ask to add a glow to that cape/flag XD.

thanks

I’ve updated the samples to show how the cacheAsBitmapMatrix works here It’s applied to a Sprite, but you can apply the same concept to the Stage.
I haven’t tried to use it with drawTriangles() but it should work without any problem. Just use sprite.filters = [new GlowFilter()]; on the sprite that holds the drawTriangles() call. (although it won’t work yet because the filter isn’t done :sweat_smile:)

1 Like

Thanks! can’t wait until this is added. This was the last big thing that openFl didn’t had. I will look at the examples and I guess now I need to learn some GLSL :smile:

Are the shaders apply while its rendering itself or its render to a an image and then it apply the the shader to the image? In other words, will using a shader add another draw call? thanks again =)

It depends, if it’s applied in the function drawTiles() it will be applied to each object of the tilesheet. If it’s applied to the sprite that holds the function call (sprite.graphics.drawTiles(...)) and the sprite cacheAsBitmap is true or you are applying filters to it, then it will be applied to the cached bitmap. You can mix everything altogether.

For example (don’t mind the ugly image):


Each bunny has a custom shader that changes the color of it and the sprite has a custom shader that waves everything because it has cacheAsBitmap as true

Thanks! Great post a lot of useful information. Now that’s power to the masses! I assume that the bunnies are batched, right?

Yes, the bunnies are batched.

1 Like

Super awsome! Thanks again