javajframeiconsjlabelwindowbuilder

How do I create padding between icon images that are inside of JLabels

I am trying to create a JFrame that has a layout like this image desired goal and what I currently have is this current progress. How do I create padding between the two images as well as at the top and bottom? I have tried using the empty border property and setting the left and right at their respective values, but the gap of space in the middle, top, and bottom does not get created.

Solution

  • See:

    for more details...

    Use an EmptyBorder

    enter image description here

    import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.EventQueue;
import java.awt.GridBagLayout;
import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.border.EmptyBorder;

public class Main {
    public static void main(String[] args) {
        new Main();
    }

    public Main() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    JFrame frame = new JFrame();
                    frame.add(new TestPane());
                    frame.pack();
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
                } catch (IOException ex) {
                    Logger.getLogger(Main.class.getName()).log(Level.SEVERE, null, ex);
                }
            }
        });
    }

    public class TestPane extends JPanel {

        public TestPane() throws IOException {
            setLayout(new BorderLayout());

            JLabel header = new JLabel("Next");
            header.setBorder(new EmptyBorder(4, 0, 4, 0));
            header.setHorizontalAlignment(JLabel.CENTER);
            header.setOpaque(true);
            header.setBackground(Color.BLUE);
            header.setForeground(Color.WHITE);

            add(header, BorderLayout.NORTH);

            JLabel footer = new JLabel("This is the way");
            footer.setBorder(new EmptyBorder(4, 0, 4, 0));
            footer.setHorizontalAlignment(JLabel.CENTER);
            footer.setOpaque(true);
            footer.setBackground(Color.BLUE);
            footer.setForeground(Color.WHITE);

            add(footer, BorderLayout.SOUTH);

            BufferedImage leftImage = ImageIO.read(getClass().getResource("/images/Mando01.jpeg"));
            BufferedImage rightImage = ImageIO.read(getClass().getResource("/images/Mando02.jpeg"));

            JLabel leftLabel = new JLabel(new ImageIcon(leftImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));
            JLabel rightLabel = new JLabel(new ImageIcon(rightImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));

            leftLabel.setBorder(new EmptyBorder(8, 8, 8, 4));
            rightLabel.setBorder(new EmptyBorder(8, 4, 8, 8));

            JPanel imagePane = new JPanel(new GridBagLayout());
            imagePane.setBackground(Color.DARK_GRAY);
            imagePane.add(leftLabel);
            imagePane.add(rightLabel);

            add(imagePane);
        }
    }
}

    Use a FlowLayout

    enter image description here

    import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.EventQueue;
import java.awt.FlowLayout;
import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.border.EmptyBorder;

public class Main {
    public static void main(String[] args) {
        new Main();
    }

    public Main() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    JFrame frame = new JFrame();
                    frame.add(new TestPane());
                    frame.pack();
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
                } catch (IOException ex) {
                    Logger.getLogger(Main.class.getName()).log(Level.SEVERE, null, ex);
                }
            }
        });
    }

    public class TestPane extends JPanel {

        public TestPane() throws IOException {
            setLayout(new BorderLayout());

            JLabel header = new JLabel("Next");
            header.setBorder(new EmptyBorder(4, 0, 4, 0));
            header.setHorizontalAlignment(JLabel.CENTER);
            header.setOpaque(true);
            header.setBackground(Color.BLUE);
            header.setForeground(Color.WHITE);

            add(header, BorderLayout.NORTH);

            JLabel footer = new JLabel("This is the way");
            footer.setBorder(new EmptyBorder(4, 0, 4, 0));
            footer.setHorizontalAlignment(JLabel.CENTER);
            footer.setOpaque(true);
            footer.setBackground(Color.BLUE);
            footer.setForeground(Color.WHITE);

            add(footer, BorderLayout.SOUTH);

            BufferedImage leftImage = ImageIO.read(getClass().getResource("/images/Mando01.jpeg"));
            BufferedImage rightImage = ImageIO.read(getClass().getResource("/images/Mando02.jpeg"));

            JLabel leftLabel = new JLabel(new ImageIcon(leftImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));
            JLabel rightLabel = new JLabel(new ImageIcon(rightImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));

            JPanel imagePane = new JPanel(new FlowLayout(FlowLayout.CENTER, 8, 8));
            imagePane.setBackground(Color.DARK_GRAY);
            imagePane.add(leftLabel);
            imagePane.add(rightLabel);

            add(imagePane);
        }
    }
}

    Use a GridBagLayout

    enter image description here

    import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Image;
import java.awt.Insets;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.border.EmptyBorder;

public class Main {
    public static void main(String[] args) {
        new Main();
    }

    public Main() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    JFrame frame = new JFrame();
                    frame.add(new TestPane());
                    frame.pack();
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
                } catch (IOException ex) {
                    Logger.getLogger(Main.class.getName()).log(Level.SEVERE, null, ex);
                }
            }
        });
    }

    public class TestPane extends JPanel {

        public TestPane() throws IOException {
            setLayout(new BorderLayout());

            JLabel header = new JLabel("Next");
            header.setBorder(new EmptyBorder(4, 0, 4, 0));
            header.setHorizontalAlignment(JLabel.CENTER);
            header.setOpaque(true);
            header.setBackground(Color.BLUE);
            header.setForeground(Color.WHITE);

            add(header, BorderLayout.NORTH);

            JLabel footer = new JLabel("This is the way");
            footer.setBorder(new EmptyBorder(4, 0, 4, 0));
            footer.setHorizontalAlignment(JLabel.CENTER);
            footer.setOpaque(true);
            footer.setBackground(Color.BLUE);
            footer.setForeground(Color.WHITE);

            add(footer, BorderLayout.SOUTH);

            BufferedImage leftImage = ImageIO.read(getClass().getResource("/images/Mando01.jpeg"));
            BufferedImage rightImage = ImageIO.read(getClass().getResource("/images/Mando02.jpeg"));

            JLabel leftLabel = new JLabel(new ImageIcon(leftImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));
            JLabel rightLabel = new JLabel(new ImageIcon(rightImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));

            JPanel imagePane = new JPanel(new GridBagLayout());
            imagePane.setBackground(Color.DARK_GRAY);

            GridBagConstraints gbc = new GridBagConstraints();
            gbc.insets = new Insets(8, 8, 8, 4);
            imagePane.add(leftLabel, gbc);

            gbc = new GridBagConstraints();
            gbc.insets = new Insets(8, 4, 8, 8);
            imagePane.add(rightLabel, gbc);

            add(imagePane);
        }
    }
}

    Use a GridLayout (and EmptyBorder)

    enter image description here

    import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.EventQueue;
import java.awt.GridLayout;
import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.border.EmptyBorder;

public class Main {
    public static void main(String[] args) {
        new Main();
    }

    public Main() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    JFrame frame = new JFrame();
                    frame.add(new TestPane());
                    frame.pack();
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
                } catch (IOException ex) {
                    Logger.getLogger(Main.class.getName()).log(Level.SEVERE, null, ex);
                }
            }
        });
    }

    public class TestPane extends JPanel {

        public TestPane() throws IOException {
            setLayout(new BorderLayout());

            JLabel header = new JLabel("Next");
            header.setBorder(new EmptyBorder(4, 0, 4, 0));
            header.setHorizontalAlignment(JLabel.CENTER);
            header.setOpaque(true);
            header.setBackground(Color.BLUE);
            header.setForeground(Color.WHITE);

            add(header, BorderLayout.NORTH);

            JLabel footer = new JLabel("This is the way");
            footer.setBorder(new EmptyBorder(4, 0, 4, 0));
            footer.setHorizontalAlignment(JLabel.CENTER);
            footer.setOpaque(true);
            footer.setBackground(Color.BLUE);
            footer.setForeground(Color.WHITE);

            add(footer, BorderLayout.SOUTH);

            BufferedImage leftImage = ImageIO.read(getClass().getResource("/images/Mando01.jpeg"));
            BufferedImage rightImage = ImageIO.read(getClass().getResource("/images/Mando02.jpeg"));

            JLabel leftLabel = new JLabel(new ImageIcon(leftImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));
            JLabel rightLabel = new JLabel(new ImageIcon(rightImage.getScaledInstance(200, -1, Image.SCALE_SMOOTH)));

            JPanel imagePane = new JPanel(new GridLayout(1, 2, 8, 8));
            imagePane.setBorder(new EmptyBorder(8, 8, 8, 8));
            imagePane.setBackground(Color.DARK_GRAY);

            imagePane.add(leftLabel);
            imagePane.add(rightLabel);

            add(imagePane);
        }
    }
}

    Or a combination of any...

    Based on your needs