Changes between Initial Version and Version 1 of GtkBoxPacking

Timestamp:

10/31/11 19:05:57 (13 years ago)

Author:

callisto

Comment:

--

GtkBoxPacking

@@ +1 @@
+= 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)]]
+
+== 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.