How to add JTextField whenever the button is clicked?

Question

I am practising Java Swing and I am trying to create a GPA calculator. I am having a hard time with my code, how can I add text fields whenever the JButton "add" is clicked? I also want the text fields to align vertically when the button is clicked. Should I use a layout or something?

You can check my screenshot as well.

Here is my code:

import java.awt.event.ActionEvent;
import javax.swing.*;
public class gwa implements ActionListener, java.awt.event.ActionListener{
public static void main(String[] args) {
    JFrame frame = new JFrame();
    JPanel panel = new JPanel();
    
    //button
    JButton buttonAdd = new JButton("Add");
    buttonAdd.setBounds(30, 30, 80, 34);
    buttonAdd.addActionListener(new gwa());
    
    //textfield
    JTextField gradeField = new JTextField();
    gradeField.setBounds(150, 30, 100, 35);
    JTextField unitsField = new JTextField();
    unitsField.setBounds(300, 30, 100, 35);
    
    //panel
    panel.setLayout(null);
    panel.add(buttonAdd);
    panel.add(gradeField);
    panel.add(unitsField);

    //frame
    frame.add(panel);
    frame.setSize(500,500);
    frame.setVisible(true);
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}

@Override
public void actionPerformed(ActionEvent e) {

}

Answer 1

One way – but not the only way – is to use GridBagLayout.

import java.awt.BorderLayout;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.event.ActionEvent;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JScrollPane;
import javax.swing.JTextField;

public class GwaAdder {
    private static final int  COLUMNS = 10;

    private GridBagConstraints  gbc;
    private JPanel  textFieldsPanel;

    private void addTextField(ActionEvent event) {
        JTextField textField = new JTextField(COLUMNS);
        gbc.gridy++;
        textFieldsPanel.add(textField, gbc);
        textFieldsPanel.revalidate();
        textFieldsPanel.repaint();
    }

    private void createAndDisplayGui() {
        JFrame frame = new JFrame();
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.add(createTextFieldsPanel(), BorderLayout.CENTER);
        frame.add(createButtons(), BorderLayout.PAGE_END);
        frame.pack();
        frame.setLocationByPlatform(true);
        frame.setVisible(true);
    }

    private JPanel createButtons() {
        JPanel panel = new JPanel();
        JButton button = new JButton("Add");
        button.addActionListener(this::addTextField);
        panel.add(button);
        return panel;
    }

    private JScrollPane createTextFieldsPanel() {
        textFieldsPanel = new JPanel(new GridBagLayout());
        gbc = new GridBagConstraints();
        gbc.gridy = 0;
        JTextField textField = new JTextField(COLUMNS);
        textFieldsPanel.add(textField, gbc);
        JScrollPane scrollPane = new JScrollPane(textFieldsPanel);
        scrollPane.setPreferredSize(new Dimension(140, 200));
        return scrollPane;
    }

    public static void main(String[] args) {
        EventQueue.invokeLater(() -> new GwaAdder().createAndDisplayGui());
    }
}

The ActionListener is implemented using method references. When you change the GUI after it is initially displayed (as the above code does in method addTextField), you usually need to call method revalidate (in class javax.swing.JComponent) followed by method repaint (in class java.awt.Component).

How it looks when I run the above code:

Answer 2

You should first give your button's Action event the panel, and then do the Action My English is not good, so I use translation software to answer, please forgive me