Clash Royale CLAN TAG#URR8PPP

JPanel shrinks when I click on button

Whenever I click my show password button the panels shrink and become as in the pictures my code is below:

public class AssetLogin extends JFrame implements ActionListener, MouseListener
private static final long serialVersionUID = 1L;
private JPanel layout, panLogin, panEmail, panPassword;
private JButton btnShowPassword;
private JTextField txtEmail;
private JPasswordField txtPassword;

public AssetLogin()
super("Asset And Equipment Tracking");
setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
this.setExtendedState(Frame.MAXIMIZED_BOTH);
this.setLocationRelativeTo(null);
this.pack();
this.setVisible(true);
this.setResizable(false);
this.setMinimumSize(new Dimension(750, 500));
JFrame.setDefaultLookAndFeelDecorated(false);
getContentPane().setLayout(new BorderLayout(0, 0));
UIManager.put("TextField.border", BorderFactory.createMatteBorder(0, 0, 0, 0, Color.WHITE));
UIManager.put("PasswordField.border", BorderFactory.createMatteBorder(0, 0, 0, 0, Color.WHITE));
UIManager.put("Button.background", Color.WHITE);
UIManager.put("Button.foreground", Color.GRAY);
UIManager.put("Button.border", BorderFactory.createMatteBorder(0, 0, 0, 0, Color.WHITE));
UIManager.put("Button.focus", new Color(0,0,0,0));
UIManager.put("Button.select", new Color(0, 0, 0, 0));
layout = new JPanel();
layout.setLayout(null);
layout.setSize(this.getWidth(), this.getHeight());
layout.setBackground(Color.WHITE);

initialize();

getContentPane().add(layout);


private void initialize()
panEmail = new JPanel();
panPassword = new JPanel();
txtEmail = new JTextField();
txtPassword = new JPasswordField();

setBoundsResize();
setDecorations();

btnShowPassword.addActionListener(this);
btnShowPassword.addMouseListener(this);

panLogin.add(panEmail);
panLogin.add(panPassword);

panEmail.add(txtEmail);

panPassword.add(txtPassword);
panPassword.add(btnShowPassword);
layout.add(panLogin);


private void setBoundsResize ()
panLogin.setBounds(layout.getWidth() / 2 - layout.getWidth() / 4, layout.getHeight() / 2 - layout.getHeight() / 3, layout.getWidth() / 2, (2 * layout.getHeight()) / 3);
panEmail.setBounds(10, 10, panLogin.getWidth() - 10, 60);
panPassword.setBounds(10, 100, panLogin.getWidth() - 10, 60);
btnShowPassword.setBounds(panPassword.getWidth() - 120, 15, 100, panPassword.getHeight() - 25);
txtEmail.setBounds(10, 15, panEmail.getWidth() - 20, panEmail.getHeight() - 25);
txtPassword.setBounds(10, 15, panPassword.getWidth() - 130, panPassword.getHeight() - 25);


private void setDecorations()
layout.setBackground(Color.WHITE);
layout.setBorder(BorderFactory.createMatteBorder(0, 2, 2, 2, Color.LIGHT_GRAY));
panLogin.setOpaque(false);
panEmail.setOpaque(false);
panPassword.setOpaque(false);
panEmail.setBorder(BorderFactory.createTitledBorder(
BorderFactory.createEtchedBorder(EtchedBorder.LOWERED), "Email"));
panPassword.setBorder(BorderFactory.createTitledBorder(
BorderFactory.createEtchedBorder(EtchedBorder.LOWERED), "Password"));
btnShowPassword.setOpaque(false);
txtPassword.setEchoChar('*');


@Override
public void actionPerformed(ActionEvent e)
if (e.getSource() == btnShowPassword)
if (txtPassword.getEchoChar() == '*')
txtPassword.setEchoChar( (char) 0 );
//btnShowPassword.setOpaque(true);
btnShowPassword.setBorder(
BorderFactory.createLineBorder(Color.black));
else
txtPassword.setEchoChar( '*' );
//btnShowPassword.setOpaque(false);
btnShowPassword.setBorder(null);




@Override
public void mousePressed(MouseEvent e)
btnShowPassword.setBackground(null);


@Override
public void mouseReleased(MouseEvent e)
btnShowPassword.setBackground(Color.LIGHT_GRAY);




of course i added the rest of the mouse event methods but the thing is that as i said the JPanels shrinks when i click "show password" button here how it should look like:

how it look like when I click the button:

Why is this happening?

2 Answers
2

Try getting rid of:

this.pack();


The Window.pack() method causes your frame to resize which will cause all your child elements to resize to their preferred sizes:

Causes this Window to be sized to fit the preferred size and layouts of its subcomponents. The resulting width and height of the window are automatically enlarged if either of dimensions is less than the minimum size as specified by the previous call to the setMinimumSize method.

If the window and/or its owner are not displayable yet, both of them are made displayable before calculating the preferred size. The Window is validated after its size is being calculated.

If you're not setting your preferred sizes correctly this can cause the types of distortion you're seeing.

Don't forget to add the layout for each panel since this will cause that problem when you are putting:

this.pack();


Since the Window.pack() method causes your frame to resize which will cause all your child elements to resize to their preferred sizes:

Causes this Window to be sized to fit the preferred size and layouts of its subcomponents. The resulting width and height of the window are automatically enlarged if either of dimensions is less than the minimum size as specified by the previous call to the setMinimumSize method.

If the window and/or its owner are not displayable yet, both of them are made displayable before calculating the preferred size. The Window is validated after its size is being calculated.

If you're not setting your preferred sizes correctly this can cause the types of distortion you're seeing.

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.