Thread: Need help understanding GUI screen layouts and labels

Ok, I have to make a program which converts binary to decimal and decimal to binary, making my own calculations for it. That part is no problem, but right now I'm trying to construct the basic layout of what the screen should look like, but I'm having problems with it.

The general idea of what I want is:

--------------------------------------------------------------
|                                            ___________              
|                  Binary number: |  (text field)  |             
|                                                                                
|                               Decimal number:                       
|            _______________________________      
|           |                      (text field)                      |      
|                                                                                 
|  [Button 1]    [Button 2]    [Button 3]    [Button 4] 
|                                                                                 
---------------------------------------------------------------

Now, with my current code, which I will show soon, this is basically what I am getting:

--------------------------------------------------------------
|       [Button 1]    [Button 2]    [Button 3]    [Button 4] 
|                                                                                
|   Binary number:                                                     
|                                                                                
|   Decimal number:                                                   
|            _______________________________      
|           |                      (text field)                      |      
|                                                                                 
|            _______________________________      
|           |                      (text field)                      |      
---------------------------------------------------------------

I've tried messing with some things, but I only end up really messing it up. Here is my code:

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;
import javax.swing.JLabel;
import java.awt.Color;
import java.awt.Container;
import java.awt.BorderLayout;
import java.awt.FlowLayout;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
 
public class BinaryDecimalConverter extends JFrame implements ActionListener
{
    public static final int WIDTH = 400;
    public static final int HEIGHT = 300;
 
 
    private JTextField binaryText;
    private JTextField decimalText;
 
    private String decimal = "No Binary to Convert";
    private String binary = "No Decimal to Convert";
 
    public BinaryDecimalConverter( )
    {
		setSize(WIDTH, HEIGHT);
        addWindowListener(new WindowDestroyer( ));
        setTitle("Binary/Decimal Number Converter");
        Container contentPane = getContentPane( );
        contentPane.setLayout(new BorderLayout( ));
 
        JPanel buttonPanel = new JPanel( );
 
        buttonPanel.setLayout(new FlowLayout( ));
 
        JButton toDecButton = new JButton("To Base 10");
        toDecButton.addActionListener(this);
        buttonPanel.add(toDecButton);
 
        JButton toBinButton = new JButton("To Base 2");
        toBinButton.addActionListener(this);
        buttonPanel.add(toBinButton);
 
        JButton clearButton = new JButton("Clear");
        clearButton.addActionListener(this);
        buttonPanel.add(clearButton);
 
        JButton exitButton = new JButton("Exit");
        exitButton.addActionListener(this);
        buttonPanel.add(exitButton);
 
        contentPane.add(buttonPanel, BorderLayout.SOUTH);
 
        JPanel textPanel = new JPanel( );
 
		contentPane.setLayout(new GridLayout(6, 1));
 
		JLabel binLabel = new JLabel("Binary number:");
        contentPane.add(binLabel);
 
        binaryText = new JTextField(20);
        binaryText.setBackground(Color.WHITE);
        textPanel.add(binaryText);
        contentPane.add(textPanel);
 
		JLabel decLabel = new JLabel("Decimal number:");
        contentPane.add(decLabel);
 
		decimalText = new JTextField(20);
		decimalText.setBackground(Color.WHITE);
		textPanel.add(decimalText);
        contentPane.add(textPanel);
 
    }
 
    public void actionPerformed(ActionEvent e)
    {
        String actionCommand = e.getActionCommand( );
        if (actionCommand.equals("To Base 10"))
            decimal = binaryText.getText( );
        else if (actionCommand.equals("To Base 2"))
            binary = decimalText.getText( );
        else if (actionCommand.equals("Clear")) {
            binaryText.setText("");
            decimalText.setText("");
		}
        else if (actionCommand.equals("Exit"))
            System.exit(0);
        else
            binaryText.setText("Error in conversion");
     }
 
    public static void main(String[] args)
    {
        BinaryDecimalConverter guiMemo = new BinaryDecimalConverter( );
        guiMemo.setVisible(true);
    }
}

If anyone can give me a better idea of how to manipulate and use a layout and arrange objects the way I want, it would be much appreciated.

Thanks!

The problems you see have to do with you change in layout in the contentPane and order of addition to the contentPane. A layout you may wish to consider is the BoxLayout (I personally always tend to lean toward BoxLayout because it is both easy and versatile when used in combinations): create a JPanel that has a page axis box layout, then add the components to this layout
Here's a quick revision, you can of course alter the prettiness of the layout bay adding borders and/or chaning the layouts of the other panels.

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;
import javax.swing.JLabel;
import javax.swing.BoxLayout;
import java.awt.Color;
import java.awt.Container;
import java.awt.BorderLayout;
import java.awt.FlowLayout;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
 
public class Test extends JFrame implements ActionListener
{
    public static final int WIDTH = 400;
    public static final int HEIGHT = 300;
 
 
    private JTextField binaryText;
    private JTextField decimalText;
 
    private String decimal = "No Binary to Convert";
    private String binary = "No Decimal to Convert";
 
    public Test( )
    {
		setSize(WIDTH, HEIGHT);
 
		JPanel main = new JPanel(  );
		main.setLayout( new BoxLayout(main, BoxLayout.PAGE_AXIS ));
        //addWindowListener(new WindowDestroyer( ));
        setTitle("Binary/Decimal Number Converter");
        Container contentPane = getContentPane( );
 
 
       // contentPane.setLayout(new BorderLayout( ));
 
        JPanel buttonPanel = new JPanel( );
 
        buttonPanel.setLayout(new FlowLayout( ));
 
        JButton toDecButton = new JButton("To Base 10");
        toDecButton.addActionListener(this);
        buttonPanel.add(toDecButton);
 
        JButton toBinButton = new JButton("To Base 2");
        toBinButton.addActionListener(this);
        buttonPanel.add(toBinButton);
 
        JButton clearButton = new JButton("Clear");
        clearButton.addActionListener(this);
        buttonPanel.add(clearButton);
 
        JButton exitButton = new JButton("Exit");
        exitButton.addActionListener(this);
        buttonPanel.add(exitButton);
 
       // contentPane.add(buttonPanel, BorderLayout.SOUTH);
 
        JPanel textPanel = new JPanel( );
 
		//contentPane.setLayout(new GridLayout(6, 1));
 
		JLabel binLabel = new JLabel("Binary number:");
        //contentPane.add(binLabel);
 
        binaryText = new JTextField(20);
        binaryText.setBackground(Color.WHITE);
		textPanel.add(binLabel);
        textPanel.add(binaryText);
        //contentPane.add(textPanel);
 
		JLabel decLabel = new JLabel("Decimal number:");
        //contentPane.add(decLabel);
 
		decimalText = new JTextField(20);
		decimalText.setBackground(Color.WHITE);
		//textPanel.add(decimalText);
 
		main.add( textPanel );
		main.add( decLabel );
		main.add( decimalText );
		main.add( buttonPanel );
		getContentPane().add(main);
		pack();
        //contentPane.add(textPanel);
 
    }
 
    public void actionPerformed(ActionEvent e)
    {
        String actionCommand = e.getActionCommand( );
        if (actionCommand.equals("To Base 10"))
            decimal = binaryText.getText( );
        else if (actionCommand.equals("To Base 2"))
            binary = decimalText.getText( );
        else if (actionCommand.equals("Clear")) {
            binaryText.setText("");
            decimalText.setText("");
		}
        else if (actionCommand.equals("Exit"))
            System.exit(0);
        else
            binaryText.setText("Error in conversion");
     }
 
    public static void main(String[] args)
    {
        Test guiMemo = new Test( );
        guiMemo.setVisible(true);
    }
}