Grid questions in the GUI

Hi all,

Couple of questions about the gui, repro attached.

(1) Is there anyway to turn the border off in the grid? As the playground shows there is a white pixel line around each grid/subgrid. I would like to remove this somehow.

(2) I can’t seem to assign RGB or Hex colours to the rectangles (note that the top rectangle will eventually be replaced with an image) but either way I can’t seem to use the colour I need? Commented out lines in the code don’t work.

Any pointers would be great.

Thanks,
Sy

https://playground.babylonjs.com/#KX33X8#219

ping @msDestiny14

Hi there. Looks like you had a small typo and some miscalculations for your grid. That’s why it appeared as if there were outlines.

Here is a fix for that and I’ll take a look at the color next. :slight_smile: https://playground.babylonjs.com/#KX33X8#222

1 Like

As far as the color, if I recall it background takes in a string. So you don’t need to use color3. This will work instead:

rect.background = "#e80404";

Hi,

That’s great, both of those worked really well. I’ve attached an updated playground for reference.

I have a couple of further questions that you might be able to help with. Firstly, you can use a style class for textblocks. Is there a style class for checkboxes? I couldn’t seem to get it to work? It would save about 100 lines of code in this example!

Secondly, can you invoke different alignments in differnts cells in a grid? In the attached example I would like all of the text to be left justified but all of the check boxes to remain centrally aligned in their grid.

Thanks again for all you help!
Sy

https://playground.babylonjs.com/#KX33X8#226

  1. Yes I believe you can use style classes. (Not sure about checkbox)

  2. Yes I believe you can also have different alignments. Think of it like different divs.

OK Ill have a play and put another question out there if I cant get it to work - style classes for checkboxes didn’t appear to be working though.

Thanks again,
Sy

Fresh eyes this morning and I realise you have to use a .textHorizontalAlignment as opposed to just a .HorizontalAlignment accessor. Apologies, my fault.

Also, according to the API the style class currently only supports font properties and even then on family, size, style and weight so it looks like my second question is not possible.

Thanks,
Sy