# BoxLayout – Learning Glue & Strut

## 1. About Struts & Glues

One can use Struts and Glues with the BoxLayout. They both help in aligning the components based on available empty space. One can imagine strut and glue both as soft & sticky material which can expand and compress. This factor allows filling up the empty space in the container there by aligning the components. Before we proceed further, have a look at the below picture:

The above picture divides into three sections to study the behaviour of the invisible items: 1) Rigid Area 2) Glue 3) Strut. Note, for better result, all these components should be used with BoxLayout only. Now let us explore these components one-by-one.

### 1.1 Rigid Area

The Gray area shows the sticky substance which is invisible to the user. In the bottom right, we have a Rigid Area which can be specified in pixels. Rigid Area requires both height and width. The Rigid Area is fixed, and it will not expand when the container resizes. In this example, we will explore frequently used components Glue & Strut.

### 1.2 Strut

In the bottom left, you can see a strut component used with a vertical BoxLayout. As shown in the picture, the strut will expand either in horizontal direction or in vertical direction. In the above picture, the strut is fixed in height when we place it on Vertical Box, and it can expand width-wise when the user resizes the container. Likewise, a strut can be placed on the Horizontal BoxLayout as well. In that case, the strut will have fixed width and variable height.

### 1.3 Glue

A Glue is a more flexible alignment component, and it can expand both on X-Axis & Y-Axis, as shown in the picture above. The top portion of the picture shows three usages of Glue in the Vertical BoxLayout.

In the first part, we add a glue after adding button1 and button 2. Button3 comes after the Glue. BoxLayout gives all the free space to the Glue so that it expands to occupy all the available space after adding Button1 and Button2. This makes button3 stay on the bottom edge of the Box.

In the second part, we added the Glue after adding the button1. So now the Glue expands to occupy the free space, pushing button2 and button3 towards the bottom of the Vertical BoxLayout.

Final part shows how two glues are placed between button1 & button2 as well as button2 & button3. Now these two glues together pack all three buttons equally spaced. The BoxLayout will maintain the equal space even when the user resizes the container.

## 2. About the Glue & Strut Example

Have a look at the below depiction which shows the examples which we will create in the coming sections:

Here, we will create two examples. One on the left, which makes use of Glue component and the one on the right uses the struts. In both the examples, we have three JPanels with BoxLayout. Two JPanels use Vertical BoxLayout and one JPanel in the Frame’s top uses horizontal BoxLayout. The JPanel contents are below:

1. Right Panel: Button1, Button2, Button3
2. Left Panel: Button7, Button8, Button9
3. Top Panel: Button4, Button5, Button6

With these two examples, we can study how the Struts and Glues behave when the containing container resizes. Note, to study the resizing of Glues and Struts, we will use the edges of the BorderLayout.

The below YouTube video explains about Strut, Glues and RegidArea:

## 3. Glue Grouping Controls

Below is the first example which shows how the glues are used. In line 31, we created a Vertical glue via createVerticalGlue method call. We kept this glue between Button2 & Button3. In the example screenshot, you can see how it pushes the button3 towards the bottom of the Panel. When the JPanel size changes, the glue extends vertically or simply glue height increases.

In line 52, we placed the glue between button 7 and button8. After adding button8 to the JPanel, we added button9. Now, since the glue is between button7 and button8, the Glue pushes both Button 8&9 towards the bottom of the panel.

At Line 41, we created a horizontal glue through the method call createHorizontalGlue. The horizontal glue is fixed in height, but it can expand in width. In our example, we added this Glue between button 4 and 5. So the BoxLayout manager pushes the button 5,6 towards the right edge of the JPanel, which was added to the north portion of the JFrame’s BorderLayout.

## 4. Glues Spacing Controls Equally

In the previous code, we add more glues By adding/modifying code at Line Nos – 8,10,20,22,32,34. Now, the controls are spaced equally on the BoxLayout by means of more than one Glue. The modified code is below:

When we run the sample, it will look like below and you can see how the space is divided for the glues equally:

## 5. Struts Fixing Control Position

Now we will go ahead with the struts. Here, we create a new example BoxLayoutExample3. For left side JPanel which is managed by Vertical BoxLayout, we add two vertical struts at line number 30,32 by using the method createVerticalStrut. The first strut has a fixed height of 20 and the second vertical strut has a fixed height of 40. This means, the strut can expand width-wise, but they are fixed in height. Because of this reason, the controls maintain its position. The same way, the struts at line numbers 54 & 56 work.

For the JPanel called `PanelX`, we create horizontal strut by calling the method createHorizontalStrut. These struts are fixed in width, but can expand in height. The first strut has a fixed width of 20 and the second one has a fixed width of 40.

## 6. YouTube Demo – Code Implementation

Categories: Swing

This site uses Akismet to reduce spam. Learn how your comment data is processed.