Before we can properly take up screen sizing, we need to understand how visual components are laid out in a WaveMaker application. The layoutBox, of type
wm.Layout, is the page's widget container. It is the parent of all the visual components on the page. The layout box is the container into which the widgets of the page go. As such, its properties affect every widget on its page:
First, we have width and height. These both default to using percentage-based sizing at 100%, which means that the app will be of the full width and height of the browser. Percentage layout allows us to specify the size of a widget in terms of the percentage of the space available in that dimension. Let's say both components in a panel are set to 100% width in a left-to-right panel. Each widget would get one half of the available width. That is, each widget would get 100% of the 200% allocated. If one widget was set to 100% and the other 200%, the first would get 1/3 of the available space, 100...