Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Problem with custom component container
I'm trying to create a custom set of Vaadin components for creating iPhone-like applications (demo here).
The basic hierarchy is that a TouchPanel (extends Panel) contains one TouchLayout (extends CssLayout). The TouchLayout can then contain any number of other components. If components are put directly into the TouchLayout, they are shown fine. The problem that I'm having is that if another layout, for example a VerticalLayout, is put into the TouchLayout – all of its content gets a 'style="height:0px; width:0px;"' from somewhere and are thus not visible. The content itself is there and can be seen with FireBug, but is simply not visible because of the 0px size.
The problem can be seen for example by going to the demo, then UI Basics > Buttons > Push Button. (Please disregard the ugliness of the demos, the CSS styling is still very much in progress).
On the client side, TouchPanel is represented by VTouchPanel (extends Composite implements Container) and TouchLayout by VTouchLayout (extends VCssLayout). The sources can be viewed here.
I'm guessing that the problem is somehow related to my implementation of container and the getAllocatedSpace() and requestLayout() methods. I've tried to extract as much info from this open ticket as I could, but I'm still stuck.
My head's slowly starting to hurt from banging it against the wall, any help would be greatly appreciated :)
Setting the inner component's size to undefined seems to circumvent the problem. This also supports my suspicion that the problem has something to do with the size calculations.