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

76 Views Asked by At

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.

1

There are 1 best solutions below

0
MadProgrammer On BEST ANSWER

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