Learn ExtJS border Layout

1. Border layout is defined by Ext. layout. BorderLayout. The layout name is border. This layout divides the container into five areas in the Southeast and northwest, which are represented by east, south, west, north, and cente respectively. When adding sub-elements to the container, we only need to specify the location of these child elements. The Border layout will automatically place the child elements to the location specified by the layout.
II. Application Example
Copy codeThe Code is as follows:
Ext. onReady (function (){
New Ext. Viewport ({
Layout: "border ",
Items: [{region: "north ",
Height: 50,
Title: "top panel "},
{Region: "south ",
Height: 50,
Title: "bottom panel "},
{Region: "center ",
Title: "central panel "},
{Region: "west ",
Width: 100,
Title: "left panel "},
{Region: "east ",
Width: 100,
Title: "right panel "}
]
});
});