Chapter 7 A First Look at GUI Applications Layout Managers

2 Contents I. Introduction to Layout Managers II. The FlowLayout Manager III. The BorderLayout Manager IV. The GridLayout Manager

3 I. Introduction to Layout Managers 1. Layout Managers 2. Adding a Layout Manager to a Container

4 I.1 Layout Managers In Java, we do not normally specify the exact location of a component within a window. Instead, we let a layout manager control the position of components. A layout manager is an object that governs the positions and sizes of components in a container. The layout manager automatically repositions and, int some cases, resizes the components when the container is resized. A layout manager has its own rules about how components are to be positioned and sized, and makes adjustments when necessary.

5 I.1 Layout Managers To use a layout manager with a group of components Place the components in a container. Create a layout manager object. Add the layout manager object to the container. Some layout managers FlowLayout : Arrange components in rows; this is the default layout manager for JPanel objects.

6 I.1 Layout Managers BorderLayout : Arrange components in five regions north, south, east, west, and center; this is the default layout manager for a JFrame object's content pane. GridLayout : Arrange components in a grid with rows and columns. To use these classes, we should have the following import statement: import java.awt.*;

7 I.2 Adding a Layout Manager to a Container To add a layout manager to a container Call the setLayout method of the container Pass a reference to a layout manager object as the argument. JPanel panel = new Panel(); panel.setLayout(new BorderLayout()); Once we establish a layout manager for a container, the layout manager governs the positions and sizes of the components that are added to the container.

8 II. The FlowLayout Manager 1. Introduction to FlowLayout Manager 2. Adjusting the FlowLayout Aligment 3. Adjusting the FlowLayout Component Gaps

9 II. 1 Introduction to FlowLayout Manager The FlowLayout manager arranges components in rows, and is the default layout manager for JPanel objects. Rules of FlowLayout manager: We can add multiple components to a container. When we add components to a container, the components appears horizontally, from left to right, in the order that they were added to the component. When there is no more room in a row but more components are added, the new components “flow” to the next row.

10

11

12 II. 2 Adjusting the FlowLayout Alignment The FlowLayout manager allows us to align components In the center of each row setLayout(new FlowLayout(FlowLayout.CENTER)); Along the left of each row setLayout(new FlowLayout(FlowLayout.LEFT)); Along the right of each row setLayout(new FlowLayout(FlowLayout.RIGHT));

13 II. 3 Adjusting the FlowLayout Component Gaps By default, the FlowLayout manager inserts a gap of five pixels between components, both horizontally and vertically. The constructor has the following format: FlowLayout(int aligment, int horGap, int vertGap)

14 III. The BorderLayout Manager 1. Introduction to the BorderLayout Manager 2. Nesting Panels Inside a Container's Regions

15 III. 1 Introduction to the BorderLayout Manager The BorderLayout manager divides a container into five regions: north, south, east, west, and center. North Region South Region West RegionEast RegionCenter Region

16 III. 1 Introduction to the BorderLayout Manager Rules: Each region can hold only one component at a time. When a component is add to a region, the component is stretched so it fills up the entire region. When adding a component to the container, we specify the region by passing one of the following constants as a second argument: BorderLayout.NORTH, BorderLayout.SOUTH, BorderLayout.EAST, BorderLayout.WEST, BorderLayout.CENTER

17 III. 1 Introduction to the BorderLayout Manager For example, add a button to the north region: JPanel panel = new Jpanel(); JButton button = new JButton(“Click Me”); panel.setLayout(new BorderLayout()); panel.add(button, BorderLayout.NORTH); If we do not pass a second argument to the add method, the component will be added to the center region.

18

19

20 II. 1 Introduction to the BorderLayout Manager Here are the rules that governs how a BorderLayout manager resizes components: A component that is placed in the north or south regions may be resized horizontally so it fills up the entire regions. A component that is placed in the east or west regions may be resized vertically so it fills up the entire regions. A component that is placed in the center region may be resized both horizontally and vertically so it fills up the entire regions.

21 II. 1 Introduction to the BorderLayout Manager By default there is no gap between the regions. We can specify horizontal and vertical gaps. BorderLayout(int horGap, int vertGap)

22 III. 3 Nesting Panels Inside a Container's Regions The BoderLayout manager is limiting because it allows only one component per region, and the components that are placed in its regions are automatically resized to fill up any extra space. These limitations are easy overcome by adding components to panels and then nesting the panels inside the regions ?

23 III. 3 Nesting Panels Inside a Container's Regions Nesting JPanel objects inside each region North Region South Region West Region East Region Center Region 1. Five JPanel objects are created and a JButton object is added to each one. 2. The JPanel objects are then added to the content pane, one to each region.

24

25

26 III. 3 Nesting Panels Inside a Container's Regions There are multiple layout managers at work in the BorderPanelWindow class: The content pane uses a BorderLayout manager. Each of the JPanel objects use a FlowLayout manager.

27 IV. The GridLayout Manager 1. Rows, Columns, and Cells 2. Using the GridLayout Manager

28 IV.1. Rows, Columns, and Cells The GridLayout manager creates a grid with rows and columns. The container is divided into equally sized cells. For example, the GridLayout manager divided a container into cells

29 IV.1. Rows, Columns, and Cells Here are some rules that the GridLayout manager follows: Each cell can hold only one component. All of the cells are the same size. This is the size of the largest component placed within the layout. A component that is placed in a cell is automatically resized to fill up any extra space.

30 IV.2. Using the GridLayout Manager Passing the number of rows and columns as arguments to the GridLayout constructor: GridLayout(int row, int column) When adding components to a container that is governed by the GridLayout manager, we cannot specify a cell.

31 IV.2. Using the GridLayout Manager The components are assigned to cells in the order they are added. The first component added to the container is assigned to the first cell, which is in the upper-left corner. As other components are added, they are assigned to the remaining cells in the first row, from left to right. When the first row is filled up, components are assigned to the cell in the second row, and so forth.

32 IV.2. Using the GridLayout Manager In the following example, the content pane is managed by a GridLayout manager. The content pane is divided into two rows and three columns. A button is added to each cell.

33

34

35 IV.2. Using the GridLayout Manager The GridLayout manager limits each cell to only one component and resizes components to fill up all of the space in a cell. To get around these limitations, we can nest panels inside the cells and add other components to the panels. In the following example, the content pane uses a GridLayout manager, and each of the JPanel objects uses a FlowLayout manager.

36

37

38 Checkpoint 1. How do you add a layout manager to a container? Create a layout manager object. Call setLayout method of the container and pass the layout manager object as an argument. 2. Which layout manager divides a container into regions known as north, south, east, west, and center? BorderLayout manager

39 Checkpoint 3. Which layout manager arranges components in a row, from left to right, in the order they were added to the container? FlowLayout manager 4. Which layout manager arranges components in rows and columns? GridLayout manager 5. How many components can you have at one time in a BorderLayout region? In a GridLayout cell?One

40 Checkpoint 6. How do you prevent the BorderLayout manager from resizing a component that has been placed in its regions? Nesting a panel inside each region. 7. What is the default layout manager for a JFrame object's content pane? For a JPanel object? BorderLayout manager FlowLayout manager