Button layout outside of a GridLayout

Question

I'm currently doing a quite simple GUI and was wondering how I could get the button in question out from the GridLayout and put it in its own say BorderLayout, if that's a bit vague I'll attach images to show you what I mean:

With that picture I would like the button to not be with the grid layout and for it to fill all the way across at the bottom of the program as it would in a border layout. My code is as follows:

import java.awt.*;
import javax.swing.*;
import java.awt.event.*;
/**
 * Write a description of class HW4GUI here.
 *
 * @author (your name) 
 * @version (a version number or a date)
 */
  public class HW4GUI extends JFrame implements ActionListener
{
private JButton jbtAction;
private JTextField jtfFName;
private JTextField jtfLName;
private JTextField jtfLibNo;
private int nextLibNo;
private JPanel textPanel;

/**
 * The constructor for the GUI, also initalises nextLibNo number
 */
public HW4GUI()
{
    super("Adding a borrower");
    makeFrame();
    showFrame();
    nextLibNo = 1001;
}

/**
 *
 */
private void makeFrame()
{
    setLayout(new GridLayout(4,0));
    setResizable(false);
    textPanel = new JPanel();
    //textPanel.setLayout(new FlowLayout(FlowLayout.CENTER));
    textPanel.setLayout(new BorderLayout());

    jtfFName = new JTextField(15);
    JLabel fNLbl = new JLabel("First Name: ");
    add(fNLbl);
    add(jtfFName);
    // add(textPanel);
    fNLbl.setHorizontalAlignment(JLabel.RIGHT);
    jtfFName.setEditable(true);

    jtfLName = new JTextField(15);
    JLabel lNLbl = new JLabel("Last Name: ");
    add(lNLbl);
    add(jtfLName);
    //add(textPanel);
    lNLbl.setHorizontalAlignment(JLabel.RIGHT);
    jtfLName.setEditable(true);

    jtfLibNo = new JTextField(15);
    JLabel lNOLbl = new JLabel("Library Number: ");
    add(lNOLbl);
    add(jtfLibNo);
    // add(textPanel);
    lNOLbl.setHorizontalAlignment(JLabel.RIGHT);
    jtfLibNo.setEditable(false);


    jbtAction = new JButton("Add Borrower");
    add(jbtAction, BorderLayout.SOUTH);
    jbtAction.addActionListener(this);

}

/**
 * displays the frame window where you can set the size of it and also other variables
 */
private void showFrame()
{
    setSize(400,200);
    setResizable(false);
    setLocationRelativeTo( null);
    setVisible(true);
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}

public void actionPerformed(ActionEvent e)
{
    String fn = jtfFName.getText();
    String ln = jtfLName.getText();
    boolean valid = true;
    if (e.getActionCommand().equals("Add Borrower"))
    {
        if (fn.equals("") && (ln.equals("")))
        {
            jtfLibNo.setText("No Names");
            valid = false;
        }
        else if (fn.equals("") )
        {
            jtfLibNo.setText("No First Name");
            valid = false;
        }
        else if (ln.equals(""))
        {
            jtfLibNo.setText("No Last Name");
            valid = false;
        }
        else

        if (valid == true)
        {
            String lib = Integer.toString(nextLibNo++);
            jtfLibNo.setText(lib);
            jbtAction.setText("Confirm");
        }
    }
    if (e.getActionCommand().equals("Confirm"))
    {
        jtfLibNo.setText("");
        jbtAction.setText("Add Borrower");
    }

}
}

Answer 1

As you have said that you want the Button outside your GridLayout, you can do:

• Declare a new Panel, like mainPanel or something like that.

  JPanel mp = new JPanel();
  

• Set its layout to 3x1 using GridLayout.

  mp.setlayout(new GridLayout(3,1));
  

• Add you labels and text-fields to that panel.

  mp.add(fNLbl);// and the rest.
  

• Add this panel to your frame.

  add(mp, BorderLayout.CENTER);
  

• Then add the Button at the end, using, BorderLayout.SOUTH.

  add(jbtAction, BorderLayout.SOUTH);
  

  But as far as my knowledge goes, then your button will occupy the width of the whole frame. So, instead, you can add the button to a panel, and then add that panel to it. Like:

  add( new JPanel(){{ add(jbtAction);}}, BorderLayout.SOUTH); // this is double-brace initialization.
  

---

---

The following code works fine:

private void makeFrame()
{
    JPanel mp = new JPanel();
    mp.setLayout(new GridLayout(3,1));
    setResizable(false);
    textPanel = new JPanel();
    //textPanel.setLayout(new FlowLayout(FlowLayout.CENTER));
    textPanel.setLayout(new BorderLayout());

    jtfFName = new JTextField(15);
    JLabel fNLbl = new JLabel("First Name: ");
    mp.add(fNLbl);
    mp.add(jtfFName);
    // add(textPanel);
    fNLbl.setHorizontalAlignment(JLabel.RIGHT);
    jtfFName.setEditable(true);

    jtfLName = new JTextField(15);
    JLabel lNLbl = new JLabel("Last Name: ");
    mp.add(lNLbl);
    mp.add(jtfLName);
    //add(textPanel);
    lNLbl.setHorizontalAlignment(JLabel.RIGHT);
    jtfLName.setEditable(true);

    jtfLibNo = new JTextField(15);
    JLabel lNOLbl = new JLabel("Library Number: ");
    mp.add(lNOLbl);
    mp.add(jtfLibNo);
    // add(textPanel);
    lNOLbl.setHorizontalAlignment(JLabel.RIGHT);
    jtfLibNo.setEditable(false);

    jbtAction = new JButton("Add Borrower");
    add(mp, BorderLayout.CENTER);
    add( new JPanel(){{ add(jbtAction);}}, BorderLayout.SOUTH);
    jbtAction.addActionListener(this);

}

Answer 2

With that picture I would like the button to not be with the grid layout and for it to fill all the way across at the bottom of the program as it would in a border layout

Then use a BorderLayout. The default layout manager for a JFrame is a BorderLayout. So you would do somethinglike:

1. Create a panel using a GridLayout. Add the first 5 components to this panel. Then add the panel to the "CENTER" of the frame.

2. Create your button. Add the button the the "PAGE_END" of the frame.

The idea of layout managers is that you can nest panels with different layouts to achieve your final layout.

I also agree, the main panel with multiple buttons should probably be a GridBagLayout as it will size each column to the width of the widest component in the column instead of making every column width identical, which will make the panel look better. Read the section from the Swing tutorial on How to Use GridBagLayout for more information and working examples.