layoutjpaneljlabeljtextfieldborder-layout

Image will not centre with layout manager


Output My background image will not centre. I'm using BorderLayout.CENTER. Everything else is in the right position except for the background image which instead of being centred is a tad bit to the left. Any suggestions on how to fix it?

private JTextField tf;
private JLabel jl2;

   public void window() {
       ImageIcon ic = new ImageIcon("hangman.png");
      JFrame gameFrame = new JFrame();
      JPanel jp = new JPanel();
      JPanel jpLets = new JPanel();
      JPanel jpBlank = new JPanel();
      JPanel blankLet = new JPanel();
      JPanel imgPane = new JPanel();
      JPanel panel1 = new JPanel();
      JPanel panel2 = new JPanel();
      blankLet.setLayout(new BoxLayout(blankLet, BoxLayout.X_AXIS));
      panel2.setLayout(new BorderLayout());
      imgPane.setLayout(new BorderLayout());
      panel1.setLayout(new BorderLayout());
      panel1.setOpaque(false);//!!
     //jp.setBorder(BorderFactory.createTitledBorder(""));
      tf = new JTextField(1);
      JLabel img = new JLabel(ic, JLabel.CENTER);
      JLabel jl = new JLabel("Enter a letter", JLabel.CENTER);
      jl2 = new JLabel("Letters used:  ", JLabel.CENTER);
      JLabel jl3 = new JLabel("__ ", JLabel.CENTER);
      jl.setFont(new Font("Rockwell", Font.PLAIN, 20));
      tf.setFont(new Font("Rockwell", Font.PLAIN, 20));
      jl2.setFont(new Font("Rockwell", Font.PLAIN, 20));
      imgPane.add(img);
      jp.add(jl);
      jp.add(tf);
      jpLets.add(jl2);
      jpBlank.add(jl3);
      blankLet.add(jpLets);
      blankLet.add(jpBlank);
      panel1.add(imgPane, BorderLayout.CENTER);
      panel1.add(jp, BorderLayout.NORTH);
      panel1.add(blankLet, BorderLayout.SOUTH);
      panel2.add(panel1, BorderLayout.CENTER);
      gameFrame.setTitle("Hangman");
      gameFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
      gameFrame.setIconImage(
      new ImageIcon("Hangman-Game-grey.png").getImage());
      gameFrame.setResizable(false);
      gameFrame.add(panel2);
      gameFrame.setSize(600, 600);
      gameFrame.setLocationRelativeTo(null);
      gameFrame.setVisible(true);

Solution

  • Two things you can try

    1. Remove the BorderLayout from this imgPane.setLayout(new BorderLayout());
    2. If one doesn't work try to add the label to the Panel instead of the imgPane

      panel1.add(img, BorderLayout.CENTER);
      
    3. Also, panel2 looks unnecessary. Get rid of that and just add panel1 to the frame

    4. Try setting the alignment

      img.setAlignmentX(JLabel.CENTER_ALIGNMENT);
      img.setAlignmentX(JLabel.CENTER_ALIGNMENT);
      
      panel1.add(img, BorderLayout.CENTER);
      

    Here's the code I used to reconstruct the desired result

    import java.awt.BorderLayout;
    import java.awt.Dimension;
    import javax.swing.ImageIcon;
    import javax.swing.JFrame;
    import javax.swing.JLabel;
    import javax.swing.JPanel;
    import javax.swing.JTextField;
    import javax.swing.SwingUtilities;
    import javax.swing.border.EmptyBorder;
    
    public class HangManAlign extends JPanel {
    
        public HangManAlign() {
            JLabel guess = new JLabel("Guess");
            JTextField jtfGuess = new JTextField(3);
    
            JLabel label = new JLabel(new ImageIcon("images/Xpo9R.png"));
    
            JLabel bottom = new JLabel("Letters Used                __ __ __ __ __ __ __ __ __");
            bottom.setHorizontalAlignment(JLabel.CENTER);
    
            JPanel topPanel = new JPanel();
            topPanel.add(guess);
            topPanel.add(jtfGuess);
    
            setLayout(new BorderLayout());
            add(topPanel, BorderLayout.NORTH);
            add(label, BorderLayout.CENTER);
            add(bottom, BorderLayout.SOUTH);
            setBorder(new EmptyBorder(20, 20, 20, 20));
    
        }
    
        public static void createAndShowGui() {
            JFrame frame = new JFrame();
            frame.add(new HangManAlign());
            frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            frame.setLocationRelativeTo(null);
            frame.pack();
            frame.setVisible(true);
    
        }
    
        public Dimension getPreferredSize() {
            return new Dimension(500, 500);
        }
    
        public static void main(String[] args) {
            SwingUtilities.invokeLater(new Runnable() {
                public void run() {
                    createAndShowGui();
                }
            });
        }
    } 
    

    enter image description here

    I Copied your entire image and cut it down to size, so you can see that it's centered. Here's the image I used

    enter image description here