Tips on making a Dynamic Canvas Application Part1

The key to making a dynamic canvas app is to use as many containers as possible. they offer you plenty of arrangement for all your elements. The containers are listed as bellow :

Horizontal Container

Horizontal containers are containers in canvas app that arrange the elements inside of it horizontally. This is a good container to use when we would like to arrange: elements of header tabs, panels, position of grids etc. One benefit of using this container is that it can give elements inside of it weight, making their width dynamic based on what their weight value is.

In order to give elements an even width we set their weight 1 as shown below.

Vertical Container

Vertical containers are similar to horizontal containers meaning that they share similar behaviors only difference being that they arrange their elements vertically which makes them good for arranging header and footer of applications or elements of grids.

Here’s an example where I used the vertical container to make a filter panel:

Container

Containers are different from the horizontal and vertical containers because they don’t arrange their elements related to each other but instead they keep them free. What is good about containers is that they can move themselves related to other containers and the elements on the container move as one unit. This container is good for displaying popups.

And also here is a example of using a containers for a pop up window:

If we ever were to move this container all the elements inside of it will move together with it wherever we place the container.