Search code examples
c++gtkmm

How do we add "Spacer"s in GTKmm?

In Qt if you want widgets in a single layout to be separated physically, you add a spacer in between, do we have something like that in GTKmm?
enter image description here

Here the label (Gtk::Label m_label;) and the buttons (Gtk::Button m_open_button, m_delete_button;) are in the same box (Gtk::HBox m_control_HBox;):

m_control_HBox.pack_start(m_label, Gtk::PACK_EXPAND_PADDING);
m_control_HBox.pack_start(m_open_button, Gtk::PACK_SHRINK);
m_control_HBox.pack_start(m_delete_button, Gtk::PACK_SHRINK);

I would like the label to be pushed further left while buttons remain in their place. How do I do that?

Solution

  • Currently you have the label widget as wide as necessary to accommodate the text, and the widget is centered in the available space. (The spaces to the sides of the label are part of the HBox.)

    -----------------------------------------------
|        | Label |        | Button || Button ||
-----------------------------------------------
 ^^^^^^^^         ^^^^^^^^
These spaces are the padding that was expanded, as requested.

    To get the text all the way to the left, you need to change that setup. I can provide two options.

    Expand the widget and move the text

    It might be useful (for mouse events?) to have the label widget fill the available space, completely hiding the HBox.

    -----------------------------------------------
|| Label                 || Button || Button ||
-----------------------------------------------

    This can be accomplished by changing its packing from Gtk::PACK_EXPAND_PADDING to Gtk::PACK_EXPAND_WIDGET.

    By itself, though, this change won't appear to have done anything, since the text is by default centered in the label widget. So you will also want to call set_xalign(). The parameter to this function is a floating point value from 0 to 1, where 0 is far-left and 1 is far-right.

    Your code would look something like the following.

    m_label.set_xalign(0.0f);                                    // <-- set text alignment
m_control_HBox.pack_start(m_label, Gtk::PACK_EXPAND_WIDGET); // <-- change packing
m_control_HBox.pack_start(m_open_button, Gtk::PACK_SHRINK);
m_control_HBox.pack_start(m_delete_button, Gtk::PACK_SHRINK);

    Move the label

    Another option would be to keep the width of the label widget, but move it all the way to the left.

    -----------------------------------------------
|| Label |                | Button || Button ||
-----------------------------------------------
          ^^^^^^^^^^^^^^^^
This space within the HBox has no widgets covering it.

    To start, you're going to give the label the same packing as the buttons, Gtk::PACK_SHRINK. The trick here is to keep the buttons to the right. This is the purpose of the pack_end() function. Pack the label from the start, and the buttons from the end.

    m_control_HBox.pack_start(m_label, Gtk::PACK_SHRINK);       // <-- Change packing
m_control_HBox.pack_end(m_open_button, Gtk::PACK_SHRINK);   // <-- pack_end
m_control_HBox.pack_end(m_delete_button, Gtk::PACK_SHRINK); // <-- pack_end