How to make this 3 column splitter in Java?

Question

I'm using Java and MiGLayout to try and re-create this layout:

http://www.methvin.com/splitter/3csplitter.html

So something like this:

• Each column needs to be resizable
• The size of the left and right columns stay the same size when resizing the main window
• Middle column fills all available space and changes size when resizing

In other words, the left and right panel need to "stick" to the left and right side of the window, but also be resizable (and not change proportionally when being resized)

I've tried many things, but the resizing is always the problem. Here is the current code which is an attempt at doing this with a nested JSplitPane.

public class MainGUI extends JFrame {
    private String app_name = "Layout Test";
    private int window_x_min = 700;
    private int window_y_min = 450;

    public MainGUI() {
        setTitle(app_name);
        setSize(window_x_min + 200, window_y_min + 100);
        setMinimumSize(new Dimension(window_x_min, window_y_min));
        setLocationRelativeTo(null);
        setDefaultCloseOperation(WindowConstants.DISPOSE_ON_CLOSE);

        JPanel panel = new JPanel();
        this.setContentPane(panel);
        panel.setLayout(new MigLayout("","[]","[grow]"));
        JSplitPane splitpane = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT);
        splitpane.setContinuousLayout(true);

        splitpane.setTopComponent(new JButton("middle"));
        splitpane.setBottomComponent(new JButton("right"));

        JSplitPane splitpane2 = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT);
        splitpane2.setContinuousLayout(true);
        splitpane.setDividerLocation(450);

        splitpane2.setBottomComponent(splitpane);
        splitpane2.setTopComponent(new JButton("left"));

        panel.add(splitpane2, "push, grow");

        this.pack();
        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        this.setVisible(true);
    }
}

I've managed to make it load up initially how I like, however with the following issues:

• Resizing from the right side changes size of the the "right" panel, not the size of the middle panel
• Resizing from the left side changes the size of the "right" panel as well

It appears that the left side of the app is working, I need the right side to function the same way. Hope that I'm making sense, thanks!

Answer 1

You need to manage how the space is allocated when the split panes are resized. This is done by using the setResizeWeight() method. By default the value is 0.0f which means the "left" component is fixed. So you need to manipulate this property on one of the split panes. Read the API for more information on how this property works.

I don't use MigLayout, but doing a simple test using a standard BorderLayout all you need to add is:

splitpane.setResizeWeight(1.0f);

Also, when you post a SSCCE don't forget to include the main() method so we can just copy/paste/execute the code. We should not need to do any extra work.