Differences btw Gtk.Table and Gtk.Grid

Althought Gtk.table is deprecated, I am getting better results with it, instead of the recommended Gtk.Grid.

It is probably my mistake, but I couldn't find the problem.

My aim is to create a Gtk window with a notebook at the top and two buttons below. These buttons should be horizontally aligned.

My code with table, works as expected:

uses Gtk

class TestWindow : Window
    init
        // General characteristics of the window
        title = "Gtk Containers"
        default_height = 250
        default_width = 250
        window_position = WindowPosition.CENTER
        destroy.connect(Gtk.main_quit)

        // Now building the notebook
        var notebook = new Gtk.Notebook()
        var label1 = new Gtk.Label("Page one")
        var label2 = new Gtk.Label("Page two")
        var child1 = new Gtk.Label("Go to page 2 for the answer")
        var child2 = new Gtk.Label("Go to page 1 for the answer")
        notebook.append_page(child1, label1)
        notebook.append_page(child2, label2)

        // Now building the table
        var table = new Table(2,2,true)
        var button1 = new Gtk.Button.with_mnemonic("Button_1")
        var button2 = new Button.with_mnemonic("Button_2")

        // Attaching all elements into the table
        table.attach_defaults(notebook, 0,2,0,1)
        table.attach_defaults(button1, 0,1,1,2)
        table.attach_defaults(button2, 1,2,1,2)
        add(table)

init
    Gtk.init (ref args)
    var test = new TestWindow ()
    test.show_all ()
    Gtk.main ()

However, the same code with the recommended Gtk.Grid gives me the two buttons without the notebook:

uses Gtk

class TestWindow : Window
    init
        // General characteristics of the window
        title = "Gtk Containers"
        default_height = 250
        default_width = 250
        window_position = WindowPosition.CENTER
        destroy.connect(Gtk.main_quit)

        // Now building the notebook
        var notebook = new Gtk.Notebook()
        var label1 = new Gtk.Label("Page one")
        var label2 = new Gtk.Label("Page two")
        var child1 = new Gtk.Label("Go to page 2 for the answer")
        var child2 = new Gtk.Label("Go to page 1 for the answer")
        notebook.append_page(child1, label1)
        notebook.append_page(child2, label2)

        // Now building the grid
        var grid = new Grid()
        var button1 = new Gtk.Button.with_mnemonic("Button_1")
        var button2 = new Button.with_mnemonic("Button_2")

        // Attaching all elements into the grid
        grid.attach(notebook, 0,2,0,1)
        grid.attach(button1, 0,1,1,2)
        grid.attach(button2, 1,2,1,2)

init
    Gtk.init (ref args)
    var test = new TestWindow ()
    test.show_all ()
    Gtk.main ()

How to achieve the aim using Grid instead of Tables? Not asking for code, just a pointer.

Solution

gtk_table_attach_defaults() and gtk_grid_attach() operate differently. The official documentation in C points this out.

Given

        thing.attach(widget, a,b,c,d)

For GtkTable, the four numbers a, b, c, and d are the actual column and row numbers that the given edge of the widget should occupy. a is the left edge, b is the right edge, c is the top edge, and d is the bottom edge.

For GtkGrid, a is the column and b is the row that the top-left corner of the widget should occupy, c is the number of columns wide the widget is, and d is the number of rows tall the widget is.

Or in other words,

        table.attach_defaults(widget, left, right, top, bottom)

is the same as

        grid.attach(widget, left, top,
            right - left + 1, bottom - top + 1)

Hopefully some part of that explanation clears things up.

The quick fix for your code would be

        grid.attach(notebook, 0,0,2,1)
        grid.attach(button1, 0,1,1,1)
        grid.attach(button2, 1,1,1,1)