Add JPanel dynamically Swing

Question

Hi I would like to have the following user interface:

And when the user clicks on start, I would like to add dynamically a JPanel underneath these elements. Something like this:

I am able to generate the grid in an empty JFrame, but when I try to add it when there are more elements inside the JFrame it appears, but very small.

This is the code that I have tried. The class UITable creates the buttons and input text

public UITable(){

    jfrm = new JFrame("Plants experiment");
    jfrm.setLayout(new FlowLayout());
    jfrm.setSize(1000, 1000);
    jfrm.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    //JLabel titles for input texts
    JLabel jlab_plants = new JLabel(" Enter nº plants: ");
    JLabel jlab_time = new JLabel(" Enter evolution time: ");
    jlab_prueba = new JLabel("");

    //Input texts
    jtf_plants = new JTextField(10);
    jtf_plants.setActionCommand("numPlants");
    jtf_time = new JTextField(10);
    jtf_time.setActionCommand("time");

    //Buttons
    jbtnStart = new JButton("Start");

    //Add components
    jfrm.add(jlab_plants);
    jfrm.add(jtf_plants);
    jfrm.add(jlab_time);
    jfrm.add(jtf_time);
    jfrm.add(jbtnStart);
    jfrm.add(jlab_prueba);

    //Set visibility
    jfrm.setVisible(true);
}

Adding dynamically the grid:

@Override
public void actionPerformed(ActionEvent ae) {
    // ...
    this.view.jfrm.add(new Grid());
    this.view.jfrm.revalidate();
    this.view.jfrm.repaint();

}

This is the Grid class:

public class Grid extends JPanel{
//Change Point to Plant in order to have a different color for each object
private List<Plant> fillCells;

public Grid() {
    //fillCells = new ArrayList<>(25);
    fillCells = PlantsControler.myPlants;
}

@Override
protected void paintComponent(Graphics g) {
    super.paintComponent(g);
    System.out.println("Width: "+getWidth()+" Height: "+ getHeight());
----  //Returns Width: 10 Height: 10 ------
    g.clearRect(0, 0, getWidth(), getHeight());
    for (Plant fillCell : fillCells) {
        int cellX = 10 + (fillCell.getX() * 10);
        int cellY = 10 + (fillCell.getY() * 10);
        g.setColor(fillCell.getColor());
        g.fillRect(cellX, cellY, 10, 10);
    }
    g.setColor(Color.BLACK);
    g.drawRect(10, 10, 800, 500);

    for (int i = 10; i <= 800; i += 10) {
        g.drawLine(i, 10, i, 510);
    }

    for (int i = 10; i <= 500; i += 10) {
        g.drawLine(10, i, 810, i);
    }
}

public void fillCell(int x, int y, Color color) {
    fillCells.add(new Plant(x, y, color));
    repaint();
}

public void fillCell(Plant plant){
    fillCells.add(plant);
    repaint();
}
public void fillCell(){
    repaint();
}

public void clearGrid(){
    fillCells.clear();
}

Thanks in advance!!!

1) Use a [`CardLayout`](http://download.oracle.com/javase/8/docs/api/java/awt/CardLayout.html) as shown in [this answer](http://stackoverflow.com/a/5786005/418556). The first image would be achieved by having a blank panel as the initial card. 2) For better help sooner, post a [MCVE] or [Short, Self Contained, Correct Example](http://www.sscce.org/). 3) `public class Grid extends JPanel{` this componet should override the `getPreferredSize()` as a suggestion to the layout.. — Andrew Thompson, Jun 23 '16 at 13:27
There's no need for a dynamic JPanel in this user interface. You can and should display an empty grid so the user knows what to expect when he / she fills in the fields. In general, create the Swing components, then use the Swing components. — Gilbert Le Blanc, Jun 23 '16 at 14:11
@Andrew Thompson, thanks for your answer and advice. I have been able to do it just overriding the getPreferredsize(). What advantages would have, if I used a CardLayout? — Spirrow, Jun 23 '16 at 22:13
1) Well for starters, the `jfrm.setSize(1000, 1000);` would be entirely unnecessary as the code could simply call `pack()` once both the blank and non-blank panels had been added, but to go into it is too long for a comment. 2) BTW - it was not an answer, but a comment. — Andrew Thompson, Jun 24 '16 at 02:54

score 1 · Answer 1 · answered Jun 23 '16 at 15:37

You can try something like below.

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.FlowLayout;
import java.awt.Graphics;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

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

public class DemoFrame extends JFrame {

    JTextField  field = new JTextField();

    public DemoFrame() {
        setLayout(new BorderLayout());
        JPanel controlsPane = new JPanel(new FlowLayout());
        controlsPane.add(new JLabel("I m a Label"));
        field.setPreferredSize(new Dimension(100,20));
        controlsPane.add(field);
        JButton button = new JButton("I am add drawPanel");
        controlsPane.add(button);
        button.addActionListener(new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent paramActionEvent) {
                DemoFrame.this.add(new DrawPanel(), BorderLayout.CENTER);
                DemoFrame.this.revalidate();
            }
        });
        add(controlsPane,BorderLayout.NORTH);
    }

    public static void main(String[] args) {
        DemoFrame frame = new DemoFrame();
        frame.setVisible(true);
        frame.pack();
    }

    class DrawPanel extends JPanel {

        @Override
        protected void paintComponent(Graphics g) {
            // TODO Auto-generated method stub
            super.paintComponent(g);
            g.setColor(Color.BLUE);
            g.drawString(field.getText(), this.getWidth()/2, this.getHeight()/2);
        }
    }
}

Add JPanel dynamically Swing

1 Answers1