Writing a JFrame that will change the JPanel based on input, where the JPanel itself is contextual and depends on a variable

Question

I am trying to make a GUI which will take a value from one JPanel, and then when a button is pressed it will move on to the next panel, which uses information that was input from the previous panel. Since one panel is dependent on the value the user has input from the previous panel I don't think CardLayout will work here as it refers to the panels as strings.

As an example of the mechanism that I'm trying to implement, I have attempted to create a JFrame where

the first panel will ask the user to input a number,
the second panel will then display to the user the first number that the user selected and ask them to pick a second number,
the third panel will show the both the first and second number that the user selected and ask for a third number.
Finally, the fourth panel will display the sum of the three numbers that the user input in each JPanel, and allow the user to reset the JFrame.

I first created four separate classes that create the four JPanels I want to be able to move between. As can be seen from the code, I have tested each of these JPanels in a separate JFrame to see if they produce the desired effect.

Here is the code for PanelThree, PanelFour and the overall GUI. Panels one and two are very similar to panel three:

Panel Three:

import javax.swing.*;
import java.awt.*;

public class PanelThree extends JPanel {
    JPanel row1 = new JPanel();
    JPanel row2 = new JPanel();
    JPanel row3 = new JPanel();
    JSlider slider = new JSlider(0, 10, 5);
    JButton next = new JButton("Find the total of all three numbers");

public PanelThree(int num0, int num1) {
    BorderLayout lay = new BorderLayout();
    setLayout(lay);

    JLabel one = new JLabel("Choose your last number on the slider, the 
    slider goes from one to ten. Your first number was: " + num0 + ". Your 
    second number was: " +  num1);
    row1.add(one);
    row2.add(slider);
    row3.add(next);

    add(row1, BorderLayout.NORTH);
    add(row2, BorderLayout.CENTER);
    add(row3, BorderLayout.SOUTH);
}

public static void main(String[] args) {
    JFrame frame = new JFrame();
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    frame.setSize(800,600);
    PanelThree panelThree = new PanelThree(7, 2);
    frame.setContentPane(panelThree);
    frame.setVisible(true);
    }
}

Panel Four:

import javax.swing.*;
import java.awt.*;

public class PanelFour extends JPanel {
    JPanel row1 = new JPanel();
    JPanel row2 = new JPanel();
    JButton reset = new JButton("Reset");

public PanelFour(int num0, int num1, int num2) {
    BorderLayout lay = new BorderLayout();
    setLayout(lay);

    int tot = num0 + num1 + num2;
    JLabel total = new JLabel("All of your numbers add up to: " + tot);
    row1.add(total);
    row2.add(reset);

    add(row1, BorderLayout.CENTER);
    add(row2, BorderLayout.SOUTH);
}

public static void main(String[] args) {
    JFrame frame = new JFrame();
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    frame.setSize(800,600);
    PanelFour panelFour = new PanelFour(7, 2, 9);
    frame.setContentPane(panelFour);
    frame.setVisible(true);
    }
}

Now this is the problem, the class which tries to knit the four JPanels together and to have it react based on what the inputs were to the last JPanel in the JFrame. The issue seems to lie specifically with the actionPerformed method which is unable to access the components in the Frame constructor. Here is the code:

import javax.swing.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

public class Frame extends JFrame implements ActionListener {
    int x, y, z;

public void Frame() {
    super("Number Adder");
    int i = 1;
    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

    PanelOne panelOne = new PanelOne();
    panelOne.next.addActionListener(this);

    PanelTwo panelTwo = new PanelTwo(x);
    panelTwo.next.addActionListener(this);

    PanelThree panelThree = new PanelThree(x, y);
    panelThree.next.addActionListener(this);

    PanelFour panelFour = new PanelFour(x, y, z);
    panelFour.reset.addActionListener(this);

    if (i == 1) {
        add(panelOne);
    } else if (i == 2) {
        add(panelTwo);
    } else if (i == 3) {
        add(panelThree);
    } else {
        add(panelFour);
    }
}

public actionPerformed(ActionEvent e) {
    if (e.getSource() == panelOne.next) {
        return x = int panelOne.slider.getValue();
        return i = 2;
    } else if (e.getSource() == panelTwo.next) {
        return y = int panelTwo.slider.getValue();
        return i = 3;
    } else if (e.getSource() == panelThree.next) {
        return z = int panelThree.slider.getValue();
        return i = 4;
    } else {
        return i = 1;
    }
    repaint();
}

public static void main(String[] args) {
    Frame frame = new Frame();
    }
}

What can I do to fix this or improve this?

Welcome to Stack Overflow! You have posted way to much code in your question, which makes it unclear to us (and to future readers) exactly where the problem is. Please reduce your problem code to 10 lines or less. See: [How to create a Minimal, Complete, and Verifiable example](http://stackoverflow.com/help/mcve) and [How to Debug Small Programs](https://ericlippert.com/2014/03/05/how-to-debug-small-programs/). — Joe C, Oct 08 '17 at 15:49
@JoeC 10 lines is hardly enough for a design problem, and debugging won't help since it's not a behavior issue. — user1803551, Oct 08 '17 at 19:46
You need to do some research into the "model-view-controller" paradigm. The idea is you have a "model" which represents the data, which can be shared by the views and controllers which make decisions about what should happen based on events from the view and model — MadProgrammer, Oct 08 '17 at 21:37
[For example](https://stackoverflow.com/questions/18350197/cant-call-a-the-third-page-via-the-2nd-page/18350351#18350351), [example](https://stackoverflow.com/questions/27663306/open-a-jpanel-after-pressing-a-button-in-a-jframe/27663749#27663749), [example](https://stackoverflow.com/questions/29571722/java-application-with-multiple-scenes/29639672#29639672), [example](https://stackoverflow.com/questions/35470930/is-this-jpanel-code-good-not-showing-the-other-jpanel-when-clicked-on-the-butto/35471323#35471323) — MadProgrammer, Oct 08 '17 at 21:39
@MadProgrammer thanks for this, I have read through these but I think I am still too new to programming GUIs to fully understand these examples and am still really stuck on this problem. Are there any introductory books or maybe a youtube video where they make a really simple program like this from scratch that you would recommend? — JenniferHL3, Oct 09 '17 at 15:42

score 0 · Answer 1 · answered Oct 08 '17 at 18:01

I don't think CardLayout will work here as it refers to the panels as strings

Why not?

You have a sequence of events.

Enter a number,
Display another panel.

There is no reason the second panel can't access the first number entered. That has nothing to do with a CardLayout.

Your second panel, just needs a way to access the data from the first panel. So maybe when you create the second panel you pass in the reference to the first panel. So when you display the second panel you can know access the number entered on the first panel.

Thanks for your reply. Could you give me a small example of how to do this with some code? — JenniferHL3, Oct 08 '17 at 21:45

Writing a JFrame that will change the JPanel based on input, where the JPanel itself is contextual and depends on a variable

1 Answers1