How would I create a tile menu?

I have preveiously developed basic menus, but one type of menu I’ve been wanting to make is a tile menu.

For my game, I want to create a tile menu that has a few options, like news, settings, etc. with something like this:

I have a few questions about approaching this:

  • Would I need to use a hacky workaround with one or more of the UI constraints, such as UIGridLayout?
  • Would I need to use scale, offset, or a mix of both to accomplish a decent looking tile menu?
  • Would using the UI Editor be a last resort?
1 Like

I’m assuming you are looking for a solution to sort different sized tiles in a way that will arrange them in a grid, such as how the tiles in your example fill the canvas despite consisting of both 1x1 and 1x2 tiles.

The UI Constraints Roblox offers aren’t built for this use-case, and for flexibility reasons you would be far better of building it in code yourself. That is, if you are looking to dynamically sort and arrange tiles on the fly.

For most use-cases however, your UI would be fairly static. Especially if you are looking to build a menu, you probably won’t need dynamic arranging through code. You would be far better off just building it visually, and rearrange it yourself whenever you need to add new tiles to your menu (which would probably be an infrequent action).

This is entirely up to your preferences, but I would highly suggest using Scale. Whether you need to use Scale or Offset is not relevant for the design you are trying to create, but is something you should decide and apply to all GUI you’ll build for your game (stick to one, unless you know what you are doing there is no reason to mix scale and offset)

For your use-case of building a tile-based menu, whether you use the UI editor isn’t relevant from a technology standpoint. If you are building it manually, use the toolset you are most comfortable with. If that is the UI editor, go ahead.

2 Likes