Griffon + Flexdock

import java.awt.Color

application(title:'dock', size:[600,400],
  locationByPlatform:true,
  iconImage: imageIcon('/griffon-icon-48x48.png').image,
  iconImages: [imageIcon('/griffon-icon-48x48.png').image,
               imageIcon('/griffon-icon-32x32.png').image,
               imageIcon('/griffon-icon-16x16.png').image]) {
   tabbedPane {
      panel(title: "Simple") {
         borderLayout(hgap: 5, vgap: 5)
         dockingPort(constraints: context.CENTER, background: Color.ORANGE, preferredSize: [100,100])
         [[title: "Blue",   color: Color.BLUE,   constraints: context.NORTH],
          [title: "Red",    color: Color.RED,    constraints: context.SOUTH],
          [title: "Green",  color: Color.GREEN,  constraints: context.EAST],
          [title: "Yellow", color: Color.YELLOW, constraints: context.WEST]].each { entry ->
            dockingPort(description: entry.title, constraints: entry.constraints, preferredSize: [100,100]) {
               panel(background: entry.color) {
                  label("Drag me")
               }
            }
         }
      }
      panel(title: "TabbedPane") {
         borderLayout(hgap: 5, vgap: 5)
         dockingPort(constraints: context.CENTER, background: Color.GRAY, preferredSize: [200,100])
         [context.NORTH, context.SOUTH, context.EAST, context.WEST].each { coord ->
            dockingPort(description: coord, constraints: coord,
                        background: Color.GRAY, preferredSize: [200,100]) {
               def title = " "+coord
               dockable(tabText: title, id: "d") {
                  panel {
                     borderLayout()
                     label(title, foreground: Color.WHITE, background: Color.BLUE, opaque: true, constraints: context.NORTH)
                     panel {
                        gridLayout(cols: 3, rows: 2)
                        (1..6).each{ n -> button("Button $n") }
                     }
                  }
               }
            }
         }
      }
   }
}