Sunday, 12 February 2012

SwingBuilder Series: Layouts - GridBagLayout



GridBagLayout is a more sophisticated layout. One of its features is that it can arrange components inside areas without requiring the components to be of the same size. The jdk complete documentation is here.

The node inside the SwingBuilder is gridBagLayout(). In my opinion if you wanted to do something complicated you'd better use MIGlayout, everything else can be arrange with BorderLayout,GridLayout, and BoxLayout.

This example looks like this:


And here's the code:

import static java.awt.GridBagConstraints.*
import javax.swing.*
import java.awt.*

def defaultInsets = [0,0,10,0]

panel(border:BorderFactory.createEmptyBorder(10,10,10,10)){
gridBagLayout()
label(
text:"Name",
constraints: gbc(gridx:0,gridy:0,fill:HORIZONTAL,insets:defaultInsets)
)
textField(
preferredSize:new Dimension(300,20),
constraints:gbc(gridx:1,gridy:0,gridwidth:REMAINDER,fill:HORIZONTAL,insets:defaultInsets)
)
label(
text:"Address",
constraints:gbc(gridx:0,gridy:1,fill:HORIZONTAL,insets:defaultInsets)
)
comboBox(
items:["Street","Avenue"],
preferredSize: new Dimension(100,20),
constraints:gbc(gridx:1,gridy:1,fill:HORIZONTAL,insets:defaultInsets)
)
textField(
constraints:gbc(gridx:3,gridy:1,gridwidth:REMAINDER, fill:HORIZONTAL,insets:defaultInsets)
)
label(
text:"Age",
constraints:gbc(gridx:0,gridy:2,fill:HORIZONTAL,insets:defaultInsets)
)
spinner(
preferredSize: new Dimension(50,20),
constraints:gbc(gridx:1,gridy:2,anchor:WEST,insets:defaultInsets)
)
button(
text:'Save Record',
constraints:gbc(gridx:0,gridy:3,insets:[10,0,0,0],gridwidth:3,anchor:WEST)
)
}

Basically for each component you have to think as if you were ordering components inside a x,y grid using grids,gridy respectivelly. Then you can tell the component to be resized when the layout is resized (fill:HORIZONTAL).

I also want components to have a margin, that's why I set the insets property. I'm using the anchor property to tell the layout that I want the age spinner aligned to the left. Finally I want the save button to span all columns but to be align to the left. So:
  • gridx,gridy to arrange components
  • fill: to tell the component how to resize itself
  • insets: margins between components
  • anchor: to align the component within the grid area

Of course there're more options to use with GridBagLayout. By the way I forgot to mention a very good tutorial on how to use the JDK layouts.






1 comment:

  1. Very Old post, perhaps you will never see it. But, I give a shot.
    I tried this(2016) and this isn't work. I use 2.4.7 Groovy version and I gain a StackOverflow Expection, so I tried since 1.8 and the same error. If you are here.
    My emal is: andremb1@gmail.com

    ReplyDelete