title: Border Layout Spacing/Margins
body: <p>for my beginner Java class we made an automated Tic-Tac-Toe game, and now we are creating a GUI to play it on. However, I'm having a lot of trouble getting the spacing/margins right. So far, I've just been trying to get the general framework for the GUI, and then I'm going to go back and actually implement the Tic-Tac-Toe game I have already made. So, far, I have this: </p>
  
  <pre><code>import java.awt.*;
  
  import java.awt.event.*;
  
  import javax.swing.*;
  
  import javax.swing.border.*;
  
  public class ITTTGUI extends JFrame implements ActionListener{
  
      //butimport javax.swing.border.*;tons
      private JPanel sizePanel;
      private JPanel buttonPanel;
      private JPanel displayPanel;
      private JPanel bottomPanel;
      private JTextField size;
      private JButton rebuildButton;
      private JButton[] buttons;
      private JLabel output;
  
      //constructor
      public NumberChooser(){
          setTitle("BitchFace");
          setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  
          //content pane
          Container cp = getContentPane();
  
          //add a panel for the size
          sizePanel = new JPanel();
          sizePanel.setBorder(new EmptyBorder(5, 5, 5, 5) );//adds margin to panel
          sizePanel.setLayout(new FlowLayout());
          size = new JTextField("3",5);
          sizePanel.add(new JLabel("N"));
          sizePanel.add(size);
          rebuildButton = new JButton("Rebuild");
          rebuildButton.addActionListener(this);
          sizePanel.add(rebuildButton);
          //add bottom panel for output
  
              sizePanel.add(new JButton("Player:"), BorderLayout.EAST);
              sizePanel.add(new JButton("Move:"), BorderLayout.EAST);
              sizePanel.add(new JButton("Winner:"), BorderLayout.EAST);
  
  
          //add a panel for the numbers
          buttonPanel = new JPanel();
          buttonPanel.setBorder(new EmptyBorder(5, 5, 5, 5) );//adds margin to panel
          buildButtonsPanel();
  
          //add bottom panel for output
          JPanel bottomPanel = new JPanel();
          bottomPanel.setBorder(new EmptyBorder(5, 5, 5, 5) );//adds margin to panel
          bottomPanel.add(new JButton("New Game"), BorderLayout.SOUTH);
          bottomPanel.add(new JButton("Advise"), BorderLayout.SOUTH);
          bottomPanel.add(new JButton("Quit"), BorderLayout.SOUTH);
  
  
  
  
          //add panels to main pane
          cp.setLayout(new BorderLayout());
          cp.add(sizePanel, BorderLayout.EAST);
          cp.add(buttonPanel, BorderLayout.CENTER);
          cp.add(bottomPanel, BorderLayout.SOUTH);
          pack();
      }
  
      //this is a helper method to rebuild the buttons panel
      private void buildButtonsPanel(){
          int n = 3;
          try{
              n = Integer.parseInt(size.getText());
          }catch(Exception e){
              e.printStackTrace();
          }
          buttonPanel.removeAll();
          buttonPanel.setLayout(new GridLayout(n,n,4,4));
          buttons = new JButton[n*n];
          for(int i=0; i &lt; buttons.length; i++){
  
              buttons[i] = new JButton("*");
              buttonPanel.add(buttons[i]);
              buttons[i].addActionListener(this);
          }
          revalidate();
          repaint();
          pack();
      }
  
      public void actionPerformed(ActionEvent e){
          Object s = e.getSource();
          //check to see if the action came from the rebuild button
          if(s == rebuildButton){
              buildButtonsPanel();
          }
          //otherwise it came from the grid
  
      }
  
      //entry point
      public static void main(String[] args){
          //create the GUI
          NumberChooser nc = new NumberChooser();
          nc.setVisible(true);
      }
  
  }
  </code></pre>
  
  <p>It doesn't have to be exact, just generally the same. 
  And also there is no X or winner variable since I haven't implemented that. I also tried changing the margins from (5,5,5,5) to like (1,1,1,1), but that didn't change anything at all so that also confused me. </p>
  
  <p>Any help with this, or how to generally go about this assignment would be appreciated. </p>
  
  <p>(And it's not accepting my images. Sorry.)
  Links are: </p>
  
  <p>The problem is that is looks like this: 
  <img src="https://i1224.photobucket.com/albums/ee362/Devolutor/COPimage1_zps459f304b.png" alt="What my GUI looks like"></p>
  
  <p><a href="https://i1224.photobucket.com/albums/ee362/Devolutor/COPimage1_zps459f304b.png" rel="nofollow noreferrer">https://i1224.photobucket.com/albums/ee362/Devolutor/COPimage1_zps459f304b.png</a></p>
  
  <p>And it is supposed to look like this: 
  <img src="https://i.stack.imgur.com/8fp1Z.png" alt="What it is supposed to look like"></p>
  
  <p><a href="http://i1224.photobucket.com/albums/ee362/Devolutor/COPimage2_zps8981c846.png" rel="nofollow noreferrer">http://i1224.photobucket.com/albums/ee362/Devolutor/COPimage2_zps8981c846.png</a></p>