Show and Tell: Grid based layout system
-
Just wanted to share something I'm working on. It was briefly discussed last month here.
It's a grid based layout system, inspired by html and other layout languages. The idea is you define your components once in a JSON type format, pass it to the layout engine, and it will do the rest. It can layout components in a vertical or horizontal stack, or use a flexible grid.
If no dimensions are passed components will stretch to fill the available space. Dimensions can be passed either as numbers or percentages relative to the parent/column/row.
By default components are centred horizontally and vertically within each grid cell but you can specify their alignment (top/bottom/left/right). For stacks components butt against each other, I have plans to add some alignment options here as well though as well as margins/gutters.
If you want to add multiple controls you can define one control and specify a number of clones, and they will be created and positioned automatically.
I think it will make it easier for me to transfer layouts between projects as well as quickly build complex projects. I have a lot more functionality planned.
-
Three thumbs up!
Building matrices is on my todo list for next week, so this will come in handy!