GTK+: Layout alignment issue

Question

I have a simple problem that may be hard to describe.

My GTK+ window is like the following:

Imagine that it has 3 components: 2 toolbars of buttons and one drawing area.

On the left I have a vertical toolbar of buttons, on the right there is the drawing area (which is big) and bellow it there is a horizontal toolbar of buttons.

I am trying to have the left vertical toolbar be exactly in the middle of the drawing area, but the horizontal be below the drawing area, but the first button should start exactly where the drawing area starts.

I am able to get one (any of my conditions) but not both!

Is it possible for me to align my components in the way I intend please?

I am creating a vbox for the vertical toolbar where I put buttons. I have another vertical component with the drawing area and the horizontal toolbar (which is it's own hbox). After that, I create a center alignment and put the vertical toolbar of buttons in it. Finally, I put those two elements back together in a hbox.

The outcome is that the horizontal bar is below the drawing area at it's right place, but the vertical bar on the left is at the center of both the drawing area and the horizontal bar (and not just the horizontal area).

I am putting the code below, but hopefully it's not too hard to read:

    GtkWidget *infoBox = gtk_vbox_new(FALSE, 10);
    GtkWidget *drawingArea = gtk_drawing_area_new();

    GtkWidget *toolBar = gtk_vbox_new(FALSE, 10);
    /* Put the buttons (vertical bar on the left) */

    GtkWidget *deviceButtons = gtk_hbox_new(FALSE, 5);
    /* Put the buttons (horizontal bar below the drawing area) */

    GtkWidget *verticalView = gtk_vbox_new(FALSE, 10);

    GtkWidget *centerAlignment = gtk_alignment_new(0, 0.5, 0, 0);
    gtk_container_add(GTK_CONTAINER(centerAlignment), toolBar);

    GtkWidget *actionView = gtk_hbox_new(FALSE, 15);
    gtk_box_pack_start(GTK_BOX(actionView), centerAlignment, FALSE, FALSE, 0);
    gtk_box_pack_start(GTK_BOX(verticalView), drawingArea, FALSE, FALSE, 0);
    gtk_box_pack_start(GTK_BOX(verticalView), deviceButtons, FALSE, FALSE, 0);
    gtk_box_pack_start(GTK_BOX(actionView), verticalView, FALSE, FALSE, 0);
    GtkWidget *deviceView = gtk_vbox_new(FALSE, 10);
    gtk_box_pack_start(GTK_BOX(deviceView), actionView, FALSE, FALSE, 0);

    gtk_box_pack_start(GTK_BOX(infoBox), deviceView, FALSE, FALSE, 0);

    gtk_container_add(GTK_CONTAINER(deviceWindow), infoBox);

I'd really like to know if my problem is solvable. I think I am defining the positions of two containers (or elements, the bars of buttons) based on the position of one element (the drawing area) and I don't know if that is possible.

Thank you very much.

Answer 1

You can use a 2x2 GtkTable and keep the bottom left cell empty.

Answer 2

As Johannes said, you should use a GtkTable for that. The problem is that the space at the lower left-hand corner will always be taken into account on size computation, wether it's in a HBox or a VBox. So none of your toolbars should be in a container that expands there.

See this picture:

The red zone cant be allocated to any of you toolbars, otherwise it won't be aligned the way you want. Alignments won't help you here I think. So the only solution I see is using GtkTable. Moreover, in GTK3, the GtkHBox and GtkVBox have been deprecated, as well as GtkTable, and replaced by GtkGrid, which works more or less like GtkTable.