Working with multiple panels in one frame

Question

I have a problem where i want a program to switch between multiple panels in a same frame. The problems I am encountering are that i can't set the layout when the panels switch and after the switch content is lowering pixel by pixel. Here is my code.

import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.FlowLayout;
import javax.swing.JFrame;

public class Main {

    public static boolean logged_in = false;

    public static int width = 200, height = 400;

    public static void main(String[] args) {
        EventQueue.invokeLater(new Runnable() {
            public void run() {
                try {
                    Dimension d = new Dimension(width, height);
                    First frame = new First();
                         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                    frame.setSize(d);
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
                    frame.setResizable(true);
                    frame.setLayout(new FlowLayout());  
                } catch (Exception e) { 
                    e.printStackTrace();    
                }
            }
        });
    }
}

and here are the two classes that hold frames.

import java.awt.FlowLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;


public class First extends JFrame {

    JPanel contentPane;
    private JButton button_1;
    private JTextField text;

    public First(){

        contentPane = new JPanel();
        setContentPane(contentPane);

        button_1 = new JButton("Second frame");
        button_1.setVisible(true);
        text = new JTextField(20);
        text.setVisible(true);

        contentPane.add(button_1);
        contentPane.add(text);

        thehandler handler = new thehandler();

        button_1.addActionListener(handler);
    }

    private class thehandler implements ActionListener {

        public void actionPerformed(ActionEvent event) {

            if (event.getSource() == button_1) {
                contentPane.removeAll();
                contentPane.invalidate();
                Second frame = new Second();
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.setLocationRelativeTo(null);
                frame.setResizable(true);
                frame.setLayout(new FlowLayout());
                frame.contentPane.setVisible(true);
                contentPane.add(frame.contentPane);
                ((JPanel) contentPane).revalidate();
                contentPane.setSize(200, 400);
                contentPane.repaint();
            }
        }
    }
}

and the second one

import java.awt.FlowLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;


public class Second extends JFrame {

    JPanel contentPane;
    private JButton button_1;
    private JTextField text;

    public Second(){

        contentPane = new JPanel();
        setContentPane(contentPane);

        button_1 = new JButton("First frame");
        button_1.setVisible(true);
        text = new JTextField(20);
        text.setVisible(true);

        contentPane.add(button_1);
        contentPane.add(text);

        thehandler handler = new thehandler();

        button_1.addActionListener(handler);
    }

    private class thehandler implements ActionListener {

        public void actionPerformed(ActionEvent event) {

            if (event.getSource() == button_1) {
                contentPane.removeAll();
                contentPane.invalidate();
                First frame = new First();
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.setLocationRelativeTo(null);
                frame.setResizable(true);
                frame.setLayout(new FlowLayout());
                frame.contentPane.setVisible(true);
                contentPane.add(frame.contentPane);
                ((JPanel) contentPane).revalidate();
                contentPane.setSize(200, 400);
                contentPane.repaint();
            }
        }
    }
}

Any help is appreciated. Please keep in mind I am not so good with java GUI. Ty.

EDIT After a lot of time searching for an answer i got one. It probably isn't perfect but i will post it for future reference or if anyone else needs this solution. Here is the code.

Main frame that holds panels:

import javax.swing.JFrame;
import javax.swing.JPanel;

public class MainFrame extends JFrame {

    public static JPanel main_panel;
    private static FirstFrame first;

    public MainFrame(){

        setLayout(null);    
        setSize(400, 400);
        setLocationRelativeTo(null);
        setResizable(true);
        setDefaultCloseOperation(EXIT_ON_CLOSE);

        main_panel = new JPanel();
        main_panel.setBounds(0, 0, 400, 400);
        add(main_panel);

        main_panel.invalidate();
        main_panel.removeAll();

        first = new FirstFrame();
        main_panel.add(first);
        main_panel.revalidate();
        main_panel.repaint();
    }

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

First panel:

import java.awt.Dimension;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JPanel;

public class FirstFrame extends JPanel {

    private JButton button;

    public FirstFrame() {

        JPanel panel = new JPanel();

        panel.setPreferredSize(new Dimension(400, 400));
        panel.setLayout(null);

        button = new JButton("First");
        button.setBounds(20, 20, 200, 40);
        button.setVisible(true);

        thehandler handler = new thehandler();

        button.addActionListener(handler);

        panel.add(button);

        add(panel);
        revalidate();
        repaint();
    }
    private class thehandler implements ActionListener {

        public void actionPerformed(ActionEvent event) {
            if (event.getSource() == button) {
                MainFrame.main_panel.invalidate();
                MainFrame.main_panel.removeAll();
                SecondFrame frame = new SecondFrame();
                MainFrame.main_panel.add(frame);
                MainFrame.main_panel.revalidate();
                MainFrame.main_panel.repaint();
            }
        }
    }
}

Second:

import java.awt.Dimension;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JPanel;

public class SecondFrame extends JPanel {

    private JButton button;

    public SecondFrame() {
        JPanel panel = new JPanel();

        panel.setPreferredSize(new Dimension(400, 400));
        panel.setLayout(null);

        button = new JButton("Second");
        button.setBounds(20, 20, 200, 40);
        button.setVisible(true);

        thehandler handler = new thehandler();

        button.addActionListener(handler);

        panel.add(button);

        add(panel);
        revalidate();
        repaint();
    }
    private class thehandler implements ActionListener {

        public void actionPerformed(ActionEvent event) {
            if (event.getSource() == button) {
                MainFrame.main_panel.invalidate();
                MainFrame.main_panel.removeAll();
                ThirdFrame frame = new ThirdFrame();
                MainFrame.main_panel.add(frame);
                MainFrame.main_panel.revalidate();
                MainFrame.main_panel.repaint();
            }
        }
    }
}

And third:

import java.awt.Dimension;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import javax.swing.JButton;
import javax.swing.JPanel;

public class ThirdFrame extends JPanel {

    private JButton button;

    public ThirdFrame() {
        JPanel panel = new JPanel();

        panel.setPreferredSize(new Dimension(400, 400));
        panel.setLayout(null);

        button = new JButton("Third");
        button.setBounds(20, 20, 200, 40);
        button.setVisible(true);

        thehandler handler = new thehandler();

        button.addActionListener(handler);

        panel.add(button);

        add(panel);
        revalidate();
        repaint();
    }
    private class thehandler implements ActionListener {

        public void actionPerformed(ActionEvent event) {
            if (event.getSource() == button) {
                MainFrame.main_panel.invalidate();
                MainFrame.main_panel.removeAll();
                FirstFrame frame = new FirstFrame();
                MainFrame.main_panel.add(frame);
                MainFrame.main_panel.revalidate();
                MainFrame.main_panel.repaint();
            }
        }
    }
}

As you can see you can switch from panel 1 ->2 ->3 and back to 1 but not the second one. Ty all for your answers they were helpful. Any further suggestions are welcome.

Answer 1

The solution is to use card layout. It is very simple,

1. create a panel with card layout in which other children panels added with unique string reference.
2. invoke show method of CardLayout to pick a panel to take in front (docs )

Check the following code.

  final JPanel mainPanel=new JPanel();
    JPanel panelOne=new JPanel();
    JPanel panelTwo=new JPanel();
    final CardLayout card=new CardLayout();
    mainPanel.setLayout(card);
    mainPanel.add(panelOne, "one"); // id one refers panelOne
    mainPanel.add(panelTwo, "two"); // id two refers panelTwo

    panelOne.add(new JLabel("first panel"));
    JButton btn1=new JButton("Show second");
    panelOne.add(btn1);
    btn1.addActionListener(new ActionListener(){public void actionPerformed(ActionEvent ae){
    card.show(mainPanel, "two"); // shows panelTwo
    }});

  panelTwo.add(new JLabel("second panel"));
    JButton btn2=new JButton("Show First");
    panelTwo.add(btn2);
    btn2.addActionListener(new ActionListener(){public void actionPerformed(ActionEvent ae){
    card.show(mainPanel, "one"); // shows panelOne
    }});