Java - Mixing component size in GroupLayout

Question

I am trying to arrange two set of buttons for a calculator GUI. Each one uses a GroupLayout to make them. One set is the numbers (and "."), the other is for operation buttons. This basically works but if one of the buttons has double length (for example the equals button on my operations set) it throws the other buttons out of line. I will use the operations set as an example. There are two columns and four rows of buttons. The final row only has one button - the equals. I want to make this double length stretching across both columns. At the moment it simply pushes the second column along to the end of it when I want the second column to sit on top of it.

Here's the code for the layout - operLayout is the name of the layout for the operations, left and right brackets on the first row, + and - on the second, * and / on the third and equals on the last row. Each button has a minimumSize set elsewhere (they are all the same except equals is twice as long).

operLayout.setAutoCreateGaps(true);
operLayout.setAutoCreateContainerGaps(true);
operLayout.setVerticalGroup(operLayout
        .createSequentialGroup()
        .addGroup(
operLayout.createParallelGroup(GroupLayout.Alignment.BASELINE).addComponent(leftBracket)
                            .addComponent(rightBracket))
            .addGroup(operLayout.createParallelGroup().addComponent(add).addComponent(subtract))
            .addGroup(operLayout.createParallelGroup().addComponent(multiply).addComponent(divide))
            .addGroup(operLayout.createParallelGroup().addComponent(equals)));
    operLayout.setHorizontalGroup(operLayout
            .createSequentialGroup()
            .addGroup(
                    operLayout.createParallelGroup().addComponent(leftBracket).addComponent(add)
                            .addComponent(multiply).addComponent(equals))
            .addGroup(
                    operLayout.createParallelGroup().addComponent(rightBracket).addComponent(subtract)
                            .addComponent(divide)));

I understand why this is happening but I'm not sure how to sort it out. Is there a simple way? Or should I change the way I'm doing it? Thanks

Answer 1

Put the equals component in its own parallel horizontal group.

First of all, make sure you use consistent indentation when you're using GroupLayout. I have found this absolutely vital in keeping track of what's going on.

The reason you're seeing the behavior you report is because the equals sign is part of the same horizontal parallel group as the first column of buttons. So when you make it double wide, it pushes the second column of buttons to the right. This is exactly what you're telling it to do because you're telling it to stay in the first parallel group (column).

In order to get the behavior you want, you have to layout that button separately, in parallel to the other buttons. You do this by putting it in its own parallel group. You probably want to put an alignment on this group also in order to get the best behavior. I think GroupLayout.Alignment.CENTER is what you want.

Also note that you don't need to create a new group if it's only going to have one component in it. Just add that component instead.

operLayout.setVerticalGroup(operLayout.createSequentialGroup()
    .addGroup(operLayout.createParallelGroup(GroupLayout.Alignment.BASELINE)
        .addComponent(leftBracket)
        .addComponent(rightBracket))
    .addGroup(operLayout.createParallelGroup()
        .addComponent(add)
        .addComponent(subtract))
    .addGroup(operLayout.createParallelGroup()
        .addComponent(multiply)
        .addComponent(divide))
    .addComponent(equals));
operLayout.setHorizontalGroup(operLayout.createParallelGroup()
    .addGroup(operLayout.createSequentialGroup()
        .addGroup(operLayout.createParallelGroup()
            .addComponent(leftBracket)
            .addComponent(add)
            .addComponent(multiply))
        .addGroup(operLayout.createParallelGroup()
           .addComponent(rightBracket)
           .addComponent(subtract)
           .addComponent(divide)))
    .addComponent(equals));