Scrollviewer and grid size interaction

Questions
1

repro: https://www.babylonjs-playground.com/#4ZC0G4#8
Not 100% sure its a bug, so posting here. Tested in Chrome.

Steps:

  1. Click on blue ‘click me’ button once. You should see some numbers on each row that is not 50.
  2. Click on blue ‘click me’ button again. You should see some numbers on each row that is 50.
  3. scroll to the very bottom. Click on blue ‘click me’ button again. The scroll viewer window goes grey.
  4. Now you can click on blue ‘click me’ button again and again, the scroll viewer window remains grey and the grid does not show until you scroll up a little.

The control case:

  1. reload the pg. Keep clicking on the blue ‘click me’ button. The scroll viewer consistently shows a 50 row grid and one that’s less than 50 rows.

The visual problem only happens when the scroll viewer is near the bottom and whenever the toggling results in a grey scroll viewer. Then it seems to be stuck there and will not show the grid despite more toggling.

2

I would personally say it’s a bug, since we are trying to imitate UI framework behavior. I would expect the scrolled list to scroll up until the last item available is at the bottom (and not like that):

Screenshot_20200329-111740_Chrome
Screenshot_20200329-111740_Chrome1440×2960 381 KB

Want to create a GitHub issue?

3

I haven’t managed to pin down the issue :frowning:

If I swap the grid out for a rect, its wai: https://www.babylonjs-playground.com/#4ZC0G4#9
If I put the grid in the rect and the rect in the sv, the bug appears: https://www.babylonjs-playground.com/#4ZC0G4#10

1 Like
4

Hello! Mabye I’m writing this comment too late, but I’ve recently fixed the same problem in my code. You should change this string:
rc.verticalAlignment = BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER;

You should use CENTER, but not TOP.

To be honest, I don’t really understand, why it works :‘’)

1 Like