- you first need to lay out the scrollable content normally, without a scrollbar
- then you need to detect whether it spills over, and whether a scrollbar is needed
- if so, you need to lay out all the content again, in a slightly smaller area
- if the content ever shrinks, you need to detect this too
- and if the content only _just_ fits, then it is possible that without a scrollbar, it doesn't need a scrollbar, but if there is a scrollbar, it needs to be scrollable. Chicken and egg.
This is actually pretty nasty to get right. Now factor in layout models like flex box, which also require part of the content to have a "pre layout" pass done in order to estimate "natural size", and it can get quite gnarly. And if you want to mix vertical and horizontal layouts... oof.
I got an equivalent of HTML/CSS box+flex working in Use.GPU but it took plenty of iteration.
I think the lesson here is that UI is always more complicated than you think. There are countless little tricks and mechanisms that you would only ever notice it if they didn't work. When they do, it is so "obviously" right you literally can't tell.
(As an aside, whoda thunk that a generation raised on participation trophies would be easily triggered???)
Yes, scrollbars are not completely trivial, but what you describe used to be a solved problem on desktop UIs, and the reason for making scrollbars invisible were purely aesthetic.
- you first need to lay out the scrollable content normally, without a scrollbar
- then you need to detect whether it spills over, and whether a scrollbar is needed
- if so, you need to lay out all the content again, in a slightly smaller area
- if the content ever shrinks, you need to detect this too
- and if the content only _just_ fits, then it is possible that without a scrollbar, it doesn't need a scrollbar, but if there is a scrollbar, it needs to be scrollable. Chicken and egg.
This is actually pretty nasty to get right. Now factor in layout models like flex box, which also require part of the content to have a "pre layout" pass done in order to estimate "natural size", and it can get quite gnarly. And if you want to mix vertical and horizontal layouts... oof.
I got an equivalent of HTML/CSS box+flex working in Use.GPU but it took plenty of iteration.
I think the lesson here is that UI is always more complicated than you think. There are countless little tricks and mechanisms that you would only ever notice it if they didn't work. When they do, it is so "obviously" right you literally can't tell.
(As an aside, whoda thunk that a generation raised on participation trophies would be easily triggered???)
(Yes this is an alt)