0

I want to create a gui, which has on the top two horizontal components(a combobox and a button) and on the bottom I would like to add several components. I created everything like that:

import java.awt.BorderLayout;
import java.awt.Button;
import java.awt.Dimension;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.io.IOException;

import javax.swing.JButton;
import javax.swing.JComboBox;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JSeparator;

public class minimumExample extends JFrame {

    private JButton addItem;

    private JComboBox itemBox;

    private String[] itemSelect = { "test1", "test2" };

    private JPanel addUpperPane;

    private JPanel addLowerPane;


    public void createControlPane() {

        setLayout(new BorderLayout());

        addUpperPane = new JPanel(new BorderLayout(5, 5));
        addLowerPane = new JPanel(new GridLayout(0, 1));

        addItem = new JButton("Add item");

        itemBox = new JComboBox(itemSelect);

        addItem.addActionListener(new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent e) {
                getContentPane().setLayout(new GridLayout(0, 1));

                if(itemBox.getSelectedItem().toString().equals("test1")) {
                    addLowerPane.add(new Button("Lolonator"));
                    validate();
                    repaint();

                }

            }
        });;

        addUpperPane.add(itemBox);
        addUpperPane.add(addItem);
        addUpperPane.add(new JSeparator(JSeparator.HORIZONTAL));

        //put everything together

        add(addUpperPane);
        add(addLowerPane);

        repaint();

    }

    private void makeLayout() {

        setTitle("Test App");
        setLayout(new BorderLayout());
        setPreferredSize(new Dimension(1000, 500));

        createControlPane();
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        pack();
        setVisible(true);

    }


    /**
     * starts the GUI
     */
    public void start() {
        javax.swing.SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                makeLayout();   
            }
        });
    }

    public static void main(String[] args) throws IOException {
        minimumExample ex = new minimumExample();
        ex.start();
    }

}

My problem is that nothing gets shown and I also thing that the layouts are not correct. Any recommendations what I should change to fix my problem?

I appreciate your answer!

UPDATE

Here is a simple wireframe of how my gui should look like:

enter image description here

UPDATE 2

Changing everything to:

addUpperPane.add(itemBox, BorderLayout.EAST);
        addUpperPane.add(addItem, BorderLayout.WEST);
        addUpperPane.add(new JSeparator(JSeparator.HORIZONTAL));

        //put everything together

        add(addUpperPane, BorderLayout.NORTH);
        add(addLowerPane, BorderLayout.SOUTH);

Gives me that: enter image description here

Any recommendations how to remove the gap?

Carol.Kar
  • 4,581
  • 36
  • 131
  • 264
  • 2
    Only one component can be added to each area of a `BorderLayout`. AFAIU the only component of all the above that will shows is the separator. Provide ASCII art or a simple drawing of how the GUI should appear at default size and (if resizable) with extra width/height. – Andrew Thompson Aug 06 '14 at 06:59
  • @AndrewThompson Thx for your answer! Changing this: ` setLayout(new FlowLayout()); addUpperPane = new JPanel(new FlowLayout());` does not change anything in my Program. Any recommendations what I should change? – Carol.Kar Aug 06 '14 at 07:01
  • 1
    Provide ASCII art or a simple drawing of how the GUI should appear at default size and (if resizable) with extra width/height. – Andrew Thompson Aug 06 '14 at 07:02
  • @AndrewThompson Please have a look at my update! – Carol.Kar Aug 06 '14 at 07:05
  • Consider using a `JToolBar` for the `JComboBox` and `JButton`. Add either that or a `JPanel` with a `FlowLayout` to the `PAGE_START` location of a `BorderLayout`. Add a panel to the `CENTER` of the outer layout for `JComponent1` & `2`. It might have a `GridLayout` or a `BoxLayout`. The white space can be obtained from layout padding and use of `EmptyBorder` on the various containers.. – Andrew Thompson Aug 06 '14 at 07:10
  • @Vivien As I said you need to wrap your component in a JPanel. for butotn and checkbox. – Rod_Algonquin Aug 06 '14 at 07:11
  • 1
    `setPreferredSize(new Dimension(1000, 500));` See [Should I avoid the use of set(Preferred|Maximum|Minimum)Size methods in Swing?](http://stackoverflow.com/q/7229226/418556) (Yes.) Here we should call `pack()` after all the components are added. – Andrew Thompson Aug 06 '14 at 07:16
  • @AndrewThompson he is setting the layout of Jframe upon click the button. that why there is a huge gap – Rod_Algonquin Aug 06 '14 at 07:27
  • @AndrewThompson Thx for your further help! What I do not understand yet is seen in my second update. Why do I have such a huge gap between the upper and the lower pane? – Carol.Kar Aug 06 '14 at 07:27

2 Answers2

3

Since you used BorderLayout you need the specify the location of each component of the layout what you are doing is that you are only adding all the component on the same position of the layout which by default is CENTER.

solution:

    addUpperPane.add(itemBox,BorderLayout.EAST);
    addUpperPane.add(addItem,BorderLayout.WEST);
    addUpperPane.add(new JSeparator(JSeparator.HORIZONTAL));

    //put everything together

    add(addUpperPane,BorderLayout.NORTH);
    add(addLowerPane,BorderLayout.SOUTH);

Also this doesn't make since setLayout(new BorderLayout()); that JFrame's default layout is already BorderLayout so no need to set the layout to it again.

EDIT:

If you want your component to be side by side then FlowLayout is the way to go:

addUpperPane = new JPanel(); //default component of JPanel is FlowLayout
addUpperPane.add(itemBox);
addUpperPane.add(addItemT);

EDIT number 2:

problem:

    getContentPane().setLayout(new GridLayout(0, 1)); //remove it

sample:

addItem.addActionListener(new ActionListener() {

        @Override
        public void actionPerformed(ActionEvent e) {

            if(itemBox.getSelectedItem().toString().equals("test1")) {
                addLowerPane.add(new Button("Lolonator"));
                revalidate();
            }

        }
    });;
Rod_Algonquin
  • 26,074
  • 6
  • 52
  • 63
  • 1
    *"..that JFrame's default layout is already `BorderLayout` so no need to set the layout to it again."* The default layout of `JFrame` **used to be** `FlowLayout`. So I say 'screw the default and set one'. Also note it is better to use the locale sensitive `PAGE_START`, `LINE_START` etc. over the compass based constants. – Andrew Thompson Aug 06 '14 at 07:06
  • @AndrewThompson I remember you said that to me before, :)). – Rod_Algonquin Aug 06 '14 at 07:08
  • @Rod_Algonquin Thx for your answer! Why do I have such a huge gap, when using your layout in my gui? For the upper Pane I used the default flow layout. – Carol.Kar Aug 06 '14 at 07:13
  • Thx for your answer! I also updated my image. Any recommendations why there is such a huge gap between the upper and the lower pane? – Carol.Kar Aug 06 '14 at 07:16
  • Thx! Just changed to JScrollable, which does not support GridBack, any recommendation which layout I should choose here? – Carol.Kar Aug 06 '14 at 07:34
1

The solution of Rod_Algonquin is right. If you are going to build more GUI I can recommend MigLayout to you. It helps you to write nice GUIs which less lines of readable code.

Their homepage: http://miglayout.com/

Deutro
  • 3,113
  • 4
  • 18
  • 26