Using two JPanels in one JFrame

Question

I'm attempting to create a program that allows the user to click a button to place something in the JPanel and allowing them to move this item around. I have already found a good layout to use to allow the moving components (see this link). However, I'm just curious the best way to create a layout like this? My hope is to have something like this:

How can I accomplish this? Would I want to use two JPanel's or something else?

Solution 1

The main panel (or the window content pane) would have to have a BorderLayout as the layout manager.

Then, the buttons panel would be added to BorderLayout.WEST and the drag panel to BorderLayout.CENTER.

There is a Visual Guide to swing layout managers.

Solution 2

Try to use JSplitPane:

Here is a code example:

class SplitPane extends JFrame {

private     JSplitPane  splitPaneV;
private     JSplitPane  splitPaneH;
private     JPanel      panel1;
private     JPanel      panel2;
private     JPanel      panel3;


public SplitPane(){
    setTitle( "Split Pane Application" );
    setBackground( Color.gray );

    JPanel topPanel = new JPanel();
    topPanel.setLayout( new BorderLayout() );
    getContentPane().add( topPanel );

    // Create the panels
    createPanel1();
    createPanel2();
    createPanel3();

    // Create a splitter pane
    splitPaneV = new JSplitPane( JSplitPane.VERTICAL_SPLIT );
    topPanel.add( splitPaneV, BorderLayout.CENTER );

    splitPaneH = new JSplitPane( JSplitPane.HORIZONTAL_SPLIT );
    splitPaneH.setLeftComponent( panel1 );
    splitPaneH.setRightComponent( panel2 );

    splitPaneV.setLeftComponent( splitPaneH );
    splitPaneV.setRightComponent( panel3 );
}

public void createPanel1(){
    panel1 = new JPanel();
    panel1.setLayout( new BorderLayout() );

    // Add some buttons
    panel1.add( new JButton( "North" ), BorderLayout.NORTH );
    panel1.add( new JButton( "South" ), BorderLayout.SOUTH );
    panel1.add( new JButton( "East" ), BorderLayout.EAST );
    panel1.add( new JButton( "West" ), BorderLayout.WEST );
    panel1.add( new JButton( "Center" ), BorderLayout.CENTER );

}

public void createPanel2(){
    panel2 = new JPanel();
    panel2.setLayout( new FlowLayout() );

    panel2.add( new JButton( "Button 1" ) );
    panel2.add( new JButton( "Button 2" ) );
    panel2.add( new JButton( "Button 3" ) );
}

public void createPanel3(){
    panel3 = new JPanel();
    panel3.setLayout( new BorderLayout() );
    panel3.setPreferredSize( new Dimension( 400, 100 ) );
    panel3.setMinimumSize( new Dimension( 100, 50 ) );

    panel3.add( new JLabel( "Notes:" ), BorderLayout.NORTH );
    panel3.add( new JTextArea(), BorderLayout.CENTER );
}

public static void main( String args[] ){
    try {
        UIManager.setLookAndFeel("com.sun.java.swing.plaf.windows.WindowsLookAndFeel");
    } catch (Exception evt) {}
    // Create an instance of the test application
    SplitPane mainFrame = new SplitPane();
    mainFrame.pack();
    mainFrame.setVisible( true );
}
}

You can play with splitPaneH.setOneTouchExpandable true/false

You can confugure divider location for both like:

Toolkit tk = Toolkit.getDefaultToolkit();
    Dimension d = tk.getScreenSize();
    int width = d.width;
    int height = d.height;

    spane.setDividerLocation((width*3)/4);
    spanex.setDividerLocation(width/4); 

Comments

[Admin]

what is spane in spane.setDividerLocation((width*3)/4); ??? It isn't present in whole code. +1 for nice answer btw.