Imgui: Align label on the left, and Widget on the right

[Folling]

Version: 1.7.1
Branch: docking

Back-end/Renderer/Compiler/OS

Back-ends: imgui_impl_glfw3.cpp
Compiler: clang
Operating System: arch-linux 64bit

My Issue/Question:

I am currently trying to figure out how to align a label/text on the left, and some form of input node on the right.
The input node on the right is determined through a variable in a model-class and then is drawn as one of the following:
Checkbox
IntegerTextfield
Textfield
ComboBox
Text

this is all rendered in a window and currently looks like this:

However, what I would like to achieve, is that the text is left-aligned, and the input-widget is right aligned, as well as limited to 50% of the window width, which would look something like this (rough estimate for the width, but it should be 50%):

I was unable to achieve this with SameLine, as the checkbox would then be aligned on the left and I'm unable to get the size of the widget since SameLine must be called before drawing the widget.
This is the result using SameLine and pushing a width for the item:

[Folling]

In addition: The separator usually is one pixel off:

For anyone encountering the same issue, it can be fixed by changing:
float thickness_layout = 0.0f;
to
float thickness_layout = 1.0f in SeperatorEx.

[ocornut]

“I'm unable to get the width of the input-widget before it's drawn”

That width is set by PushItemWidth() or SetNextItemWidth(), so I am not sure to understand what is your problem.

You should be able to use something like

int total_w = GetContentRegionAvail().x; Text(); SameLine(total_w); SetNextItemWidth(total_w); SomeWidget().

[Folling]

Well I have the width before hand, but using:
PushItemWidth(usableWindowWidth/2) to assign the widget 50% of the remaining area puts the checkbox on the left, instead of on the right as I'd like it to be - as can be seen in the last screenshot.

[ocornut]

Separator() having a vertical effect on layout was changed then reverted very recently because it created backward compatibility issues with existing idioms.

Will probably expose it as a SeparatorFlags later, until then you can use a Dummy() or SetCursorPosY() to manipulate the cursor if needed. Please don’t discuss 2 unrelated issues in same issue #.

[ocornut]

Then your initial question was unclear because you didn’t particularly mention checkbox as the one odd out. Checkbox is not affected by ItemWidth so you can either position it in the middle, or if you want it on the right you have to assume that checkboxes are square where each side == FrameHeight.

Also linking to #395.
Note that this isn’t supported at this type of layout puts more burden on clipping and makes it more difficult to have multiple widgets on the same line.