How to show a honeycomb image containing dynamic content

[james12]

I’d like to show a game board with a honeycomb layout, and within each cell is a short piece of dynamic text drawn from the database (so it changes and updates), and each cell has a reactive state of open or complete, which would be reflected in one of two colours being shown as the backdrop to the cell. In otherwords, each cell in the honeycom contains text witha background colour drawn from the database.

Can anyone suggest a good technique to achieve this?

Perhaps a background image of the honeycomb, overlaid with many visual elements of text/image using a pixel offset in static alignment?

Or an HTML tag used to expose a completely different technology?

Or …?

Anyone done anything like this before?

Many thanks,
James

[hergin]

My first instict was going to be “No, you can’t do it with native Bubble”, but then I got an original idea See the demo below in which I create hexagonal layout from the textual layout. You can put some text in hexagons (A, B, Cs etc.) or you can totally get rid of them by marking them with X. You can even change its color.

The original idea is how I created the hexagonal layouts. It is simply a bunch of repeating groups with some x-offset and y-offset within cells so that other repeating groups exactly fit into the space between cells visually. The first row of the textual for example, is a repeating group, but its data source is the first row of the multiline input.

Then, the second row is the copy of the same repeating group but this time with the second row of the multiline input:

The rest is simply split bys, conditional visibilities, dynamic colors etc.

You can store the textual layout in a database either one by one or as a whole in different forms. Then, while displaying repeating groups, you will read your data based on that.

Currently, I have created 5 rows but if I play hard enough, I am sure I can make this dynamic too. But I am done.

The only caveat is, you can’t click on the hexagon cells because repeating groups block some of them. And, this can’t be done with only 1 repeating group (or prove me wrong )

Here is the editor if you want to play with it and see the details: Tests for Forum 14 | Bubble Editor

[james12]

Oh wow - that’s out of the box thinking - love it! With lovely animations to illustrate!!

I DO want to be able to click on the cells, so that’s a problem. But I feel you have an elgant solution here, that I will now try to extend.

Thank you Huseygin!