Question

I’m having what seems to me should be a really simple issue. In my opinion it’s just a massive oversight of the people who made GridBagLayout…

Anyway. I’m using GridBagLayout to display a 27×13 grid of tiles for the game I’m making. I used this layout because of its ability to resize the components and because of how easy it is to configure, but there’s just one small problem. When it’s resizing the tiles, if the width is not a multiple of 27 or if the height is not a multiple of 13, there will be white space put around the borders.

To show what I mean:

Here is what it looks like when I resize the frame so that the JPanel within is sized 864×416, perfect multiples of 27 and 13.

Here is what it looks like when I resize the frame so that the JPanel within is sized 863×415, just barely not multiples of 27 or 13.

It simply is not distributing the extra pixels among the tiles. I don’t know why. When I fiddle with the minimum/maximum/preferred size using their respective methods or overriding them, or even use GridBagLayout‘s ipadx and ipady constraints, I can remove the white space – but all it does is just squish the outermost tiles to fit the rest. You can see this in the example code below.

Here’s an SSCCE:

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.util.Random;

import javax.swing.JComponent;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class Game extends JPanel {
    public static void main(String[] args) {
        javax.swing.SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                start();
            }
        });
    }
    static void start() {
        JFrame frame = new JFrame("Game");
        JPanel newFrame = new MainGameScreen();
        frame.getContentPane().add(newFrame);
        frame.pack();
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }
}
class MainGameScreen extends JPanel {
    public MainGameScreen() {
        setPreferredSize(new Dimension(864, 551));
        setLayout(new GridBagLayout());
        setBackground(Color.green);
        GridBagConstraints gbc = new GridBagConstraints();
        gbc.fill = GridBagConstraints.BOTH;
        gbc.weightx = 1;
        gbc.weighty = 1;
        gbc.ipadx = 0; //Change to 64 to see undesired effects
        gbc.ipady = 0; //^
        for (int i=0;i<13;i++) {
            for (int j=0;j<27;j++) {
                gbc.gridx = j;
                gbc.gridy = i;
                add(new ImagePanel(), gbc);
            }
        }
    }
}
class ImagePanel extends JComponent { 
    private int r,g,b;
    public ImagePanel() {
        Random generator = new Random();
        r = generator.nextInt(100)+1;
        g = generator.nextInt(100)+1;
        b = generator.nextInt(100)+1;
    }
    @Override
    public void paintComponent(Graphics gr) {
        super.paintComponent(gr);
        gr.setColor(new Color(r,g,b));
        gr.fillRect(0, 0, getWidth(), getHeight());
    }
}

My question is, how can I make the layout constantly look like the first image? Do I need a different layout? I’m very lost here.

Answer 1

I would use a GridLayout for the panel with square tiles, and nest that inside another layout (either GridBagLayout, BorderLayout, BoxLayout, or some combination of layouts) for the rest of the window.

That said, both GridLayout and GridBagLayout will distribute pixels evenly in this case. Since you can only use whole pixels, you’ll be left with a remainder after dividing up the the space, and that will be used as padding. This is largely unavoidable, although there are a few potential workarounds:

• enforce certain window sizes
• draw a larger panel than you need, but use a viewport so the extra tiles are truncated in the view
• add other elements bordering the tiled area to effectively hide the fact that there’s extra padding

If you’re okay with the first option, you can make a slight modification to snap the window to a compatible size, such that there is no remainder (note: I also changed a couple of your hard-coded ints to constants):

package com.example.game;

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.event.ComponentAdapter;
import java.awt.event.ComponentEvent;
import java.util.Random;

import javax.swing.JComponent;
import javax.swing.JFrame;
import javax.swing.JPanel;

    public class Game extends JPanel {      
        public static void main(String[] args) {
            javax.swing.SwingUtilities.invokeLater(new Runnable() {
                public void run() {
                    start();
                }
            });
        }

        static void start() {
            final JFrame frame = new JFrame("Game");
            JPanel newFrame = new MainGameScreen();

            frame.addComponentListener(new ComponentAdapter() {
                @Override
                public void componentResized(ComponentEvent e) {
                    int h = frame.getContentPane().getHeight() % MainGameScreen.ROWS;
                    int w = frame.getContentPane().getWidth() % MainGameScreen.COLS;

                    // Subtract the remainder pixels from the size.
                    frame.setSize(frame.getWidth() - w, frame.getHeight() - h);
                }
            });
            frame.getContentPane().add(newFrame);
            frame.pack();
            frame.setLocationRelativeTo(null);
            frame.setVisible(true);
        }
    }
    class MainGameScreen extends JPanel {
        static final int ROWS = 13;
        static final int COLS = 27;

        public MainGameScreen() {
            setPreferredSize(new Dimension(864, 551));
            setLayout(new GridBagLayout());
            setBackground(Color.green);
            GridBagConstraints gbc = new GridBagConstraints();
            gbc.fill = GridBagConstraints.BOTH;
            gbc.weightx = 1;
            gbc.weighty = 1;
            gbc.ipadx = 0; //Change to 64 to see undesired effects
            gbc.ipady = 0; //^
            for (int i=0;i<ROWS;i++) {
                for (int j=0;j<COLS;j++) {
                    gbc.gridx = j;
                    gbc.gridy = i;
                    add(new ImagePanel(), gbc);
                }
            }
        }
    }

    class ImagePanel extends JComponent { 
        private int r,g,b;
        public ImagePanel() {
            Random generator = new Random();
            r = generator.nextInt(100)+1;
            g = generator.nextInt(100)+1;
            b = generator.nextInt(100)+1;
        }
        @Override
        public void paintComponent(Graphics gr) {
            super.paintComponent(gr);
            gr.setColor(new Color(r,g,b));
            gr.fillRect(0, 0, getWidth(), getHeight());
        }
}