Tiled Textures for Sprites/GUI Boxes

Hey,

Currently, when you apply a texture to a GUI Box or a Sprite (displayed inside a collection object), the only option for said texture is to have it stretch to fill the object. For generic use, this is fine, however if you wish to have a repeating texture (say for example, a plane of grass), it becomes less than a simple task.

The two options available right now are:

a) Clone the tile a lot of times; this creates obvious needless overhead especially when it’s for something generic such as a plane of grass. Not to mention it goes without saying this creates a messy situation when you have thousands of identical tiles.

b) Create a custom material with WRAP_MODE_REPEAT set as the UV flags under the sampler. While this presents a “better” solution, this isn’t ideal either. Firstly, it requires creating custom fragment and vertex shaders (overkill for simply tiling some grass), and secondly, it does not show the result in the editor… which seems to go against the awesomeness of the editor aims to provide.

Suggested solution: For GUI Box elements and sprites, allow an option for the applied texture to be tiled rather than stretched. However this is implemented, it should be visible in the editor. For sprites, this would either allow sprite objects to be individually scaled (otherwise the tiling becomes pointless) or the tiling is applied when the containing game object is scaled (regardless of how big the sprite gets either by its own scale or parent scaling, the texture should always tile).

I saw there was a post late last year about something similar to this, but nothing was ever mentioned and nothing came from it, so I figured I would post it again, as it seems like a decent feature to have in such a rich toolkit.

5 Likes

I’d love some engine-dev feedback on this. :slight_smile:

1 Like

We put some thought into this over the years, it’s not completely straight forward how to do it when you consider texture lookup and atlases. The best option I could come up with was to let the geometry be dynamic, so that a tiling where the texture has been offset by [0.5, 0.0], would in fact result in two quads rather than one, put side by side to allow for the texture to seemingly wrap. So for geometry with UVs [0.0-0.2] in an atlas, we would generate:

|0.1    0.2|0.0     0.1|
+----------+-----------+
|          |           |

And if the offset changes:

|0.15 0.2|0.0         0.15|
+--------+----------------+
|        |                |

The discussion then moves into what kind of operations would you reasonably need for the UVs? Is it a full blown transform, 3x3 matrix, or is a translation + possibly stretching (scaling) enough?
We fully agree tiling would be great to support, but we first need to solve the problems around it.

4 Likes

Hey, thanks for the response!

Just to confirm, the idea would not to have two textures for different objects blend together seamlessly via the editor, that it something that can technically already be achieved, rather to have one single object (sprite, for example), with a single texture, tile that texture instead of stretching it.

As an example, if I wanted to create a large plane of grass, the best solution that allows editor feedback is to stack tiles on-top of each other, as seen in the attached image. If this grass plane was to be something closer to 100x100 (resulting in 10,000 tiles), that becomes rather silly to manage. A solution would allow for just one sprite, which can be scaled/sized as big as you would want the plane of grass, but the texture remains at its original size, and tiles to fill the object instead of stretching.

Current situation: (9-tiles vs 1 large): http://i.imgur.com/QkoemHi.png
Desired result (mock): http://i.imgur.com/DLx2Q6I.png

I’m eager to see a solution reached for this, as it’s quite a hindrance for the game we’re working on. I realize we’re perhaps already on the same page, I thought it best to clarify, as I’ve never been the best at explaining things! :slight_smile:

2 Likes

If there’s only a few things you need tiled (e.g. the grass plane), you could consider solving this with a model(s) as well. You are free to choose your own UVs for models.

I did consider that, but even in early development, there’s a lot of things we’d ideally like to use the tiling textures for, and using models seems like it would quickly become overkill for those, especially as we add more and more content to the game.

Update:

Would it be feasible to add a new component that can be added to a collection inside of a game object, which acts as a tiling plane, rather than figuring out a method of extending the capabilities of the sprites and such? “Tiled Sprite”, or something appropriately named, which works the same as a sprite but tiles the texture inside of it instead of stretching it?

The overhead of using models for this cause, seems way too much for the intended output. Instead, we looked to using a script to generate a plane once the collection is initialized; some problems occurred.

a) Spawning sprites or even game objects doesn’t seem possible currently.
b) Cloning sprites or even game objects doesn’t seem possible (similar to how gui.clone works).
c) Experiments with a factory hit an unrelated road-block, but seems like it may be the best usable solution right now. However, having a gameobject spawned for every tile in a large plane seems like bad overhead.
d) None of the above give editor feedback.
c) Lots of objects rapidly fills the sprite buffer.

I think your current best bet is to use tile maps (not sure that’s what you had been doing or not). It’s quite fast to draw up in terms of authoring (there’s some brush features for tile maps), and they are quite efficient to render.

2 Likes

Thanks, I hadn’t played around too much with those. I’ll give them some experimenting.

1 Like