3 ms·
As you know, grid and grid-like layouts work with cells. The height and width of these cells are integers. So, when you have something like this: +-----+--
by bayindirh 1y ago
As you know, grid and grid-like layouts work with cells. The height and width of these cells are integers. So, when you have something like this:
+-----+-------+
| | Lorem |
| |-------|
| | Ipsum |
| |-------|
| foo | Dolor |
| |-------|
| | Sit |
| |-------|
| | Amet |
+-----+-------+
You have basically six cells. Five of them (lorem, ipsum, dolor, sit, amet) are 1x1, and the other one (foo) is 1x5.
What I do is, I draw the UI I imagine on a paper, add a grid where the smallest UI elements (labels, buttons, fields) their own, suitable $WIDTHx1 cells.
Some cells like "foo" needs to span mutliple cells (like this 1x5) to look and place correctly. At the end, you have a "spreadsheet like view" with some cells "merged and centered" in spreadsheet software parlance.
As the last step, I note the dimensions of the cells I need to realize the UI on the paper, and write the code reflecting that.