How to properly use GridLayout to position elements in a JFrame?

Question

This is what I want my JFrame to look like:

________________________________________________________________________________
|Play                                                                     - 0 x |
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Score List:     | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Mario: 100      | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Luigi: 50       |        
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Waluigi: 20     | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Wario: 10       |       
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 |       
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 |       
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 |       
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 | 
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%                 |    
|Status: Ready!                                                       Score: 30 |
‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾

At the moment, each element is of equal size and basically just split up the middle and top/bottom. Play is the title of the Frame, the %s represent a JPanel in which the user can play a game. The 'Status: Ready' is a JLabel, as is the 'Score: 30'. The list of scores is a JTextArea.

So, how do I set the sizes and positions of these elements? I'll give you my code so far, perhaps you could tell me where I'm going wrong.

this.add(playPanel);
this.add(scoreArea);
this.add(statusLabel);
this.add(scoreLabel);
this.setLayout(new GridLayout(2,2));

I cannot see how one would achieve that layout using a `GridLayout`. I'd instead look to a [Nested Layout](http://stackoverflow.com/a/5630271/418556) or perhaps a `GridBagLayout` or `GroupLayout`. — Andrew Thompson, Oct 31 '13 at 13:18

Sage · Answer 1 · 2013-10-31T15:45:45.730

GridBagLayout should be the perfect solution for you. With it's support of obeying preferred size of component and clever use of GridBagConstraints. using GridBagLayout's GridBagConstraint property:

gridx, gridy: your component will be placed in grid(X, Y). Before adding any component you specify the grid using these property, to which component will be added.
anchor: FIRST_LINE_START, PAGE_START, FIRST_LINE_END, LINE_START, LINE_END etc are used to orient the component in the available space of each grid.
weightx, weighty: For it is the center label weightx and weighty are specified to respond with re-sizing the container in width and height. For score list label, only weighty is specified to respond with re-sizing the container only in height.
gridwidth: For it is the center label this property was specified as 2 to take two grid.
fill: is specified as BOTH for the it is the center label to fill the available display are in both width and height. And this property is set as VERTICAL for score list label to fill the display area in height.

Here is a Demo built for you to give you the idea at first glance:

Not really coded as standard(such as setting preferred size by setPreferredSize() should not be done) but i think it meets the demo purpose.

enter image description here

Source code:

import java.awt.*;
import java.awt.Dimension;
import java.awt.GridBagConstraints;
import java.awt.HeadlessException;
import java.awt.Insets;
import javax.swing.*;
import javax.swing.SwingUtilities;

/**
 *
 * @author Rashed
 */
 class GridBagLayoutDemo extends JFrame{


    public JLabel createLabel(String txt, int width, int height, Color color)
    {
        JLabel label = new JLabel(txt);
        label.setOpaque(true);
        label.setBackground(color);
        label.setPreferredSize(new Dimension(width, height));
        return label;
    }

    public GridBagLayoutDemo() throws HeadlessException {
       setSize(400,400);
       setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

       JPanel panel = new JPanel(new java.awt.GridBagLayout());
       GridBagConstraints labCnst = new GridBagConstraints();

       labCnst.fill = GridBagConstraints.NONE;
       labCnst.insets = new Insets(3, 3, 3, 3);
       labCnst.anchor = GridBagConstraints.FIRST_LINE_START;
       labCnst.gridx  = 0;
       labCnst.gridy = 0;
       panel.add(createLabel("play", 100, 30, new Color(0x359DBD)), labCnst);

      // labCnst.anchor = GridBagConstraints.LAST_LINE_START;
       labCnst.gridx  = 0;
       labCnst.gridy = 2;
       panel.add(createLabel("Status: Ready!", 100, 30, new Color(0x359DBD)), labCnst);

       labCnst.anchor = GridBagConstraints.FIRST_LINE_END;
       labCnst.gridx  = 2;
       labCnst.gridy = 0;
       panel.add(createLabel("-0x", 100, 30, new Color(0x359DBD)), labCnst);

       labCnst.anchor = GridBagConstraints.LAST_LINE_END;
       labCnst.gridx  = 2;
       labCnst.gridy = 2;
       panel.add(createLabel("score:30", 100, 30, new Color(0x359DBD)), labCnst);


       labCnst.anchor = GridBagConstraints.LINE_START;
       labCnst.fill = GridBagConstraints.VERTICAL;
       labCnst.gridx  = 2;
       labCnst.gridy = 1;
       labCnst.gridwidth = 1;

       labCnst.weightx = 0.7;
       labCnst.weighty = 0.7;
       panel.add(createLabel("ScoreList", 100, 200, new Color(0xFFAA00)), labCnst);


       labCnst.gridx = 0;
       labCnst.gridy = 1;
       //labCnst.anchor = GridBagConstraints.LIN;
       labCnst.gridwidth = 2;

       labCnst.weightx = 0.8;
       labCnst.weighty = 0.8;
       labCnst.fill = GridBagConstraints.BOTH;
       panel.add(createLabel("It is the center", 200, 200, new Color(0xFFD47E)), labCnst);

       //labCnst.anchor = GridBagConstraints.LINE_END;


       add(panel);

    }


    public static void main(String[] args) {
        SwingUtilities.invokeLater(new Runnable() {

            @Override
            public void run() {
                new GridBagLayoutDemo().setVisible(true);
            }
        });
    }
}

score 1 · Answer 2 · answered Oct 31 '13 at 13:19

1

You may want to take a look at a Gridbaglayout instead. It might better suit your needs.

answered Oct 31 '13 at 13:19

Native

157
12

How to properly use GridLayout to position elements in a JFrame?

2 Answers2