Getting Started With MigLayout

When I was in my college year, my Professors are teaching the basics on how to construct a simple Java GUI Application using the Layout Manager bundled in the JDK.

I found it hard to cope up at first but with small amount of time taking a read on some java swing tutorials on google, I can almost do exactly the way I want the GUI to look like. But the only thing that upset me is the fact that there's like a hundred lines of code before you achieved your ever wanting GUI Design.

And then I came across with this MigLayout. This Layout Manager simplifies your coding in Java.

You must have to read the Quick Start in MigLayout website because it is very handy.

I'm going to list some of the constraints I usually used when I'm working with MigLayout:

wrap - It makes the next component down to the next row. For Example:

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;

import net.miginfocom.swing.MigLayout;
public class TestMigLayout extends JFrame{
 
 public TestMigLayout(){
  super("MigLayout Basic");
  setLayout(new MigLayout("", "[grow]", "[grow]"));
  add(new JLabel("Hello"), "wrap, center");
  add(new JButton("Exit"), "center");
  setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  pack();
  setLocationRelativeTo(null);
  setVisible(true);
 }
 public static void main(String args[]){
  new TestMigLayout();
 }
}

Output:

As you can see, the "wrap" parameter is responsible for making new row for the next component. 

The "center" parameter in the JPanel instance is to make the component to be on center position. You can also try to use "left" and "right".

growx - To make the component "grow" ONLY in its X axis. This is useful for Textbox or Button. There is also growy and simply, grow: for both x and y.

In the next example, we will try to make a simple login screen with "remember me" component. But with no implementations:

import javax.swing.JButton;
import javax.swing.JCheckBox;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPasswordField;
import javax.swing.JTextField;

import net.miginfocom.swing.MigLayout;
public class TestMigLayout extends JFrame{
 
 public TestMigLayout(){
  super("MigLayout Basic");
  setLayout(new MigLayout("", "[grow]", "[grow]"));
  add(new JLabel("Username:"), "right");
  add(new JTextField(), "growx, left, wrap, w 100");
  add(new JLabel("Password:"), "right");
  add(new JPasswordField(), "growx, left, wrap, w 100");
  add(new JCheckBox("Remember Me"), "center, wrap, span");
  add(new JButton("Login"), "split 2, span 2, center");
  add(new JButton("Close"));
  setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  pack();
  setLocationRelativeTo(null);
  setVisible(true);
 }
 public static void main(String args[]){
  new TestMigLayout();
 }
}

Output:

Pretty easy, right?! :)

The span constraint make the component to "eat" the specified number of column/row. This makes the component grow larger. In this case, its span 2, meaning we want our button to span 2 columns and 2 rows. Then the split constraint means the component cell can be occupied by specified number of column/row. In this case, we want our component to split into 2 so the next button will not jump to the next row.

Thanks for reading! Will be publish more about MigLayout soon.