Screen layout Multiple docked at same position

There is a way to have three docked windows in the south side by side?
Want to make a layout with three areas at bottom of the screen navigation, faceplates and trends and alarms, like Aveva situation awareness template. After a little research I think that is not possible using only docked windows, am I right?

Aveva layout sketch;

I would make the three bottom ‘zones’ templates, and then make a single docked window (you are correct, you can only have one) with a template canvas. You can position each template in the canvas to a width of 33% via the MigLayout based canvas options.


The crucial piece is the template canvas. It’s set to a scroll behavior of None, and each component within just has a constraint of grow, telling the canvas that the it wants to take up as much space as possible. Since all three components have the same growth priority, they end up the same size (you could also simply say width 33%, but grow is easier):

Great solution, I was focused in using windows, but you opened my mind to using templates.

You rock.

You think it’s safe to create a dynamic client dataset binded to the template canvas? I mean, it will refresh with the change in dataset? Or de best aproach is to design is to update the templates itself?

You can absolutely provide a dynamic dataset to the canvas and have it update accordingly.

One complication of the canvas is that the fractal nature of parameters * templates means you’ll have to JSON-encode any parameters you pass into each template, which can get slightly tricky.

1 Like

Everything is good with the template canvas, the grow layout makes Vision works like Perspective, but know that I’m start developing new features and the resizing of some components inside the template canvas is not desirable, it’s possible to lock the size for just some of the components?

Solved by setting to true the template property “Behavior → Enable Layout” for the template with the componentes that don’t want to resize.

1 Like