Feature request: centered titlebar #222

Closed
opened 2015-05-12 09:17:26 +00:00 by petrihakkinen · 10 comments
petrihakkinen commented 2015-05-12 09:17:26 +00:00 (Migrated from github.com)

Could you please add a flag for centering window's titlebar horizontally? I think this feature would be useful for customizing the look & feel of the UI.

Could you please add a flag for centering window's titlebar horizontally? I think this feature would be useful for customizing the look & feel of the UI.
ocornut commented 2015-05-12 09:41:33 +00:00 (Migrated from github.com)

Will do!

Will do!
petrihakkinen commented 2015-05-12 09:57:54 +00:00 (Migrated from github.com)

Thanks! You're great, I just become a patron (Ctrl Alt Ninja)!

Thanks! You're great, I just become a patron (Ctrl Alt Ninja)!
ocornut commented 2015-05-12 10:06:57 +00:00 (Migrated from github.com)

Oh it was you :) I was wondering. Thanks a lot :)

I'll be adding a new set of flags for alignment parameters (left/center/right/top/bottom) so title bar can be the first use of that.

Oh it was you :) I was wondering. Thanks a lot :) I'll be adding a new set of flags for alignment parameters (left/center/right/top/bottom) so title bar can be the first use of that.
ocornut commented 2015-05-12 10:50:37 +00:00 (Migrated from github.com)

Added it, you can do:

style.WindowTitleAlign = ImGuiAlign_Center;

I removed the vertical alignment features because they aren't useful yet. This is the first feature using explicit alignment option and I imagine more will follow.

Added it, you can do: ``` style.WindowTitleAlign = ImGuiAlign_Center; ``` I removed the vertical alignment features because they aren't useful yet. This is the first feature using explicit alignment option and I imagine more will follow.
petrihakkinen commented 2015-05-12 11:58:47 +00:00 (Migrated from github.com)

If it's not too complicated, I would prefer that the titlebar centering would not take the space of the collapsing button into account. As it is now, the titlebar seems to be a little off center because the collapse button pushes the title right.

E.g. see how the title of an OS X window is centered:
http://cdn.arstechnica.net/reviews/os/mac-os-x-10-5.media/leopard-window.png

btw. what is your policy of closing issues? I mean, do you mark them as closed, or would you prefer me to do it?

If it's not too complicated, I would prefer that the titlebar centering would not take the space of the collapsing button into account. As it is now, the titlebar seems to be a little off center because the collapse button pushes the title right. E.g. see how the title of an OS X window is centered: http://cdn.arstechnica.net/reviews/os/mac-os-x-10-5.media/leopard-window.png btw. what is your policy of closing issues? I mean, do you mark them as closed, or would you prefer me to do it?
ocornut commented 2015-05-12 12:08:31 +00:00 (Migrated from github.com)

That's actually because the spacing on the left is different from the one on the right, because in the case of clipping I want text to be clipped as far as possible (past the padding). I'll introduce different setting for alignment vs clipping internally.

align spacing

Either way is ok. Sometimes I'm not sure and I wait for the user to close the bug when they are happy, sometimes I close it myself.

That's actually because the spacing on the left is different from the one on the right, because in the case of clipping I want text to be clipped as far as possible (past the padding). I'll introduce different setting for alignment vs clipping internally. ![align spacing](https://cloud.githubusercontent.com/assets/8225057/7586734/cc04b8cc-f8a7-11e4-9af7-51ce9e01a123.PNG) Either way is ok. Sometimes I'm not sure and I wait for the user to close the bug when they are happy, sometimes I close it myself.
ocornut commented 2015-05-12 13:06:24 +00:00 (Migrated from github.com)

I reworked this.
For reference here where we want the alignment markers to be (regardless of the clipping marker which is always at the correct position and usually goes a little behind the "max" alignment marker, intentionally, to make clipped text most visibly "unfitting"). Notice how the two central cases which are now handled.

// -Text--------- // -----Text----- // ---------Text-
// ^            ^    ^            ^    ^            ^

// ###-Text------ // ###--Text----- // ###------Text-
//    ^         ^       ^      ^          ^         ^

// -Text------### // -----Text--### // ------Text-###
// ^         ^       ^            ^    ^         ^

// ###-Text---### // ###--Text--### // ###---Text-###
//    ^      ^          ^      ^          ^      ^

What does Leopard does when there's not enough room for the Leopard? I align it to the left in this case so you always see the beginning of the text.

I reworked this. For reference here where we want the alignment markers to be (regardless of the clipping marker which is always at the correct position and usually goes a little behind the "max" alignment marker, intentionally, to make clipped text most visibly "unfitting"). Notice how the two central cases which are now handled. ``` // -Text--------- // -----Text----- // ---------Text- // ^ ^ ^ ^ ^ ^ // ###-Text------ // ###--Text----- // ###------Text- // ^ ^ ^ ^ ^ ^ // -Text------### // -----Text--### // ------Text-### // ^ ^ ^ ^ ^ ^ // ###-Text---### // ###--Text--### // ###---Text-### // ^ ^ ^ ^ ^ ^ ``` What does Leopard does when there's not enough room for the Leopard? I align it to the left in this case so you always see the beginning of the text.
petrihakkinen commented 2015-05-12 14:57:34 +00:00 (Migrated from github.com)

Most OS X apps seem to set a sensible minimum window size, but for example resizing in Safari reveals that the window title x-coord is clamped to right edge of the red,yellow,green window buttons. So it's "left align" in case the text does not fit.

Most OS X apps seem to set a sensible minimum window size, but for example resizing in Safari reveals that the window title x-coord is clamped to right edge of the red,yellow,green window buttons. So it's "left align" in case the text does not fit.
ocornut commented 2015-05-12 15:01:35 +00:00 (Migrated from github.com)

Cool. That's what I'm doing now. I'll close this, let me know if there's an issue.

I added adhoc code which is bit short-sighted but it's a good base to evolve it into something more generic. Current alignment shift the entire block of text so it won't work for multi-lines which is not supported for titles anyway. Eventually it should find its way to the lower levels function.

Cool. That's what I'm doing now. I'll close this, let me know if there's an issue. I added adhoc code which is bit short-sighted but it's a good base to evolve it into something more generic. Current alignment shift the entire block of text so it won't work for multi-lines which is not supported for titles anyway. Eventually it should find its way to the lower levels function.
ocornut commented 2016-09-25 11:12:24 +00:00 (Migrated from github.com)

FYI @petrihakkinen
This got broken today, that code:

style.WindowTitleAlign = ImGuiAlign_Center;

becomes:

style.WindowTitleAlign = ImVec2(0.5f,0.5f)

It's more convenient/fast/simple to use vectors instead of enums, also potentially more flexible.
I might add some constants, e.g. ImGuiAlign_TopLeft = ImVec2(0,0) for reference.

The old ImGuiAlign_Center was technically equivalent to ImVec2(0.5f,0.0f) (horizontally centered, vertical top) but it doesn't make a difference for window titles and it was only publicly used for that, so I'll turn Center into (0.5f,0.5f)

FYI @petrihakkinen This got broken today, that code: ``` style.WindowTitleAlign = ImGuiAlign_Center; ``` becomes: ``` style.WindowTitleAlign = ImVec2(0.5f,0.5f) ``` It's more convenient/fast/simple to use vectors instead of enums, also potentially more flexible. I might add some constants, e.g. `ImGuiAlign_TopLeft = ImVec2(0,0)` for reference. The old `ImGuiAlign_Center` was technically equivalent to `ImVec2(0.5f,0.0f)` (horizontally centered, vertical top) but it doesn't make a difference for window titles and it was only publicly used for that, so I'll turn Center into (0.5f,0.5f)
Sign in to join this conversation.
No milestone
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
ocornut/imgui#222
No description provided.