The layout is often invisible but quite important part of your web application. It helps to make applications that know what to do with the available space. Each layout consists of panels. Panels hold the content - HTML or a widget, for example, a grid. They can be easily hidden, shown, resized, removed, refreshed.

Auto Resize

Once you have rendered layout into a container, it will attach a listener to the window and will make sure it takes up all the width and height available from the container.

6 Panels

Layout comes with 6 default panels. You can set the content of the panel by setting HTML, loading from a file, or rendering a widget, for example, a grid.


If 6 default panels is not enough for you, you can nest them. A layout panel can contain another layout with 6 more panels. There is no limit how many layouts you can nest.

JavaScript Control

A widget is good when it has clean APIs and can be manipulated from JavaScript.

Clean Syntax

The code is clean, modern and easy to read, as you can see below.


In the example above you can see all the panels, but by default they are invisible.

The Code

User Comments

comments powered by Disqus