= Gtk Box Packing =

Two useful widgets for packing are `HBox`, for packing widgets across the screen, and `VBox`, for packing widgets down the screen.  Widgets can be added to these boxes using `packStart`.  Parameters to the box constructor and `packStart` control how the packed widgets are laid out, and how they change when the containing window changes size.

 * `HBox/VBox` take two parameters: 
   1. boolean parameter, `homogeneous`, to indicate if widgets should all be the same size
   2. integer parameter, `spacing`, to give the amount of space between widgets
 * `packStart` takes four parameters:
   1. the widget to pack
   2. boolean parameter, `expand`, to indicate if widgets should expand if there is more space available
   3. boolean parameter, `fill`, to indicate if widgets should fill the space available to them (only applies if `expand` is true)
   4. integer parameter, `padding`, to give the amount of space between widgets

The following program is used for illustration: parameters are changed in the `addWidgets` method to show different packing behaviours.

{{{
#!cobra
# @args -pkg:gtk-sharp-2.0  # remove initial '#'
use Gtk

class DemoWindow inherits Window
	cue init
		base.init("Demo 1")
		.setDefaultSize(200, 100)
		listen .deleteEvent, ref .onDeleteEvent
		.addWidgets

	def addWidgets
		box = HBox(false, 0) # create a box to hold widgets
		button1 = Button("Gtk")
		button2 = Button("is a graphical user interface toolkit")

		box.packStart(button1, false, false, 0) # add button1 to box
		box.packStart(button2, false, false, 0) # add button2 to box
		.add(box) # add the box to our window

	def onDeleteEvent(obj, args as DeleteEventArgs)
		Application.quit

class MainProgram
	def main
		Application.init
		window = DemoWindow()
		window.showAll
		Application.run
}}}

== Example 1 ==

With the following parameters, the widgets in the box can be different sizes (HBox has homogeneous set to false), and neither 
button will expand to fill their surrounding space when the window is resized.

{{{
#!cobra
box = HBox(false, 0)
box.packStart(button1, false, false, 0)
box.packStart(button2, false, false, 0)
}}}

[[Image(packing1.png)]]

(Window on the left is before resizing, on the right after resizing.)

== Example 2 ==

By changing the box definition so homogeneous is true, the two buttons will have the same size.

{{{
#!cobra
box = HBox(true, 0)
box.packStart(button1, false, false, 0)
box.packStart(button2, false, false, 0)
}}}

[[Image(packing2.png)]]

== Example 3 ==

By packing the first button with a true value for the expand property, the button's area will grow to fill the available space in the window.  However, the button itself does not increase in size.

{{{
#!cobra
box = HBox(false, 0)
box.packStart(button1, true, false, 0)
box.packStart(button2, false, false, 0)
}}}

[[Image(packing3.png)]]

== Example 4 ==

By packing the first button with a true value for the expand and fill properties, the button will grow to fill the available space in the window.

{{{
#!cobra
box = HBox(false, 0)
box.packStart(button1, true, true, 0)
box.packStart(button2, false, false, 0)
}}}

[[Image(packing4.png)]]

== Example 5 ==

Set the `spacing` parameter for the box to put some space in between the widgets.

{{{
#!cobra
box = HBox(true, 20)
box.packStart(button1, true, true, 0)
box.packStart(button2, true, true, 0)
}}}

[[Image(packing5.png)]]

== Example 6 ==

Set the `padding` parameter in `packStart` to put space on either side of the widget.

{{{
#!cobra
box = HBox(true, 0)
box.packStart(button1, true, true, 20)
box.packStart(button2, true, true, 20)
}}}

[[Image(packing6.png)]]

== And There's More ... ==

Complex layouts can be managed by nesting boxes, and adjusting the parameters illustrated above. 

 * `packStart` packs widgets by starting from the left (for `HBox`) or top (for `VBox`) and working to the right (or down).

 * `packEnd` is also available, to start packing from the right or bottom of the container.