Page MenuHome

Fix topbar padding to fit the tool icons
Needs RevisionPublic

Authored by Pablo Dobarro (pablodp606) on Mon, Sep 23, 1:22 AM.

Diff Detail

rB Blender
fix-topbar-y (branched from master)
Build Status
Buildable 5064
Build 5064: arc lint + arc unit

Event Timeline

Might be worth considering also increasing vertical widget size then, like we do it in the file browser or the preferences. If we increase size of the region to fit some elements anyway, why not use the space?
The alternative solution would be to draw the icon smaller. I personally don't mind much.

@Pablo Dobarro (pablodp606) could you also add one or two sentences to the patch description explaining what this does? It took me a moment to understand that, in the screenshots the difference is quite suttle, and there are multiple things changing in them.

indeed the icons look cramped in the top bar currently.

Either we could make the icons smaller or make the top bar a tiny bit taller to accommodate.

Julian Eisel (Severin) requested changes to this revision.Mon, Sep 23, 5:13 PM

Also, topbar is the wrong term. We use it for the global bar with the workspace tabs. The region is now called tool header, so maybe use ED_area_toolheader_size() as name.

Otherwise code is fine.

This revision now requires changes to proceed.Mon, Sep 23, 5:13 PM
Pablo Dobarro (pablodp606) edited the summary of this revision. (Show Details)
  • Add more padding and rename function

The problem with adding just a little bit of padding is that it breaks the alignment with other editors.

I think that if we add a little bit more of padding it looks better and it makes that alignment difference look intentional.

@Pablo Dobarro (pablodp606) indeed, your 2nd image looks better I think too. For me this seems fine, if the code is accepted.

Code wise fine. I'm not too sure about the visual side though, the bar now takes quite some height and it doesn't use it really. So I'd still suggest to at least increase vertical layout size (see uiLayout.scale_y).
This is a rather visible change, so I think this should get approval by other UI team heads too. @Pablo Vazquez (pablovazquez), any opinion?

Brecht Van Lommel (brecht) requested changes to this revision.EditedMon, Sep 30, 12:51 AM

This does not look good to me, and I don't like the inconsistency between editors that this brings. Even within a single editor hiding and showing the tool settings bar will be inconsistent. Why not just draw the icon smaller?

This revision now requires changes to proceed.Mon, Sep 30, 12:51 AM

I haven't seen opinion yet, so will probably not be a popular one, but...

If the topbar looks cramped, doesn't that really apply to all similar things? Why not consider making all headers a bit taller to give the content more breathing room while keeping them all consistent?

I agree with @Harley Acheson (harley), maybe we should add a little bit of extra padding to these kind of bars in the UI. We can also reduce the size of the icon, but that would mean having the same icon repeated in the toolbar and in the topbar with two slightly different sizes, and that does not look good.

Blender's UI elements are already bigger than most pro apps, and we keep adding extra bars, making things bigger, and adding more spacing so that less space remains for the actual content.

When we do this we really need a good justification, because these things have been adding up for a while. I don't see a good reason to do it here.

@Brecht Van Lommel (brecht) - ...adding more spacing so that less space remains for the actual content.

I would only consider a couple pixels of padding above and below. I don't think we'd seriously miss much content that can fit the 6-8 of vertical pixels lost in a typical workspace. Many users get bent out the shape over every pixel, but we really end up looking very cramped. It is quite often the padding around elements that make them easier to see and use. Negative space is important space.

I guess my biggest point is that any desire to make one header-shaped space look less cramped applies to all of them. So adding padding to one will not only make things not line up but will subsequently make other similar areas look more cramped comparatively.

And just for completeness, I should probably mention that what we see isn't always what we expect or what others see...

Right now most of our header-shaped things are defined to be 26 pixels high at 1X scale. But when we draw the lines between editors we (strangely) overdraw them by an amount that varies by scale and line-width. So at 1X scale most headers (that are at an edge) show only 24 or 25 of those pixels. A toolbar below the header might show all 26 pixels. When viewing at 2X scale what you see is not twice these numbers, so it sometimes hard to judge the padding well or get it right.

So at 1X scale our UI items are generally 20 pixels high with a 1 pixel shadow below for a total of 21 vertical pixels. At that scale a typical header will be defined at 26 but show 24 since two are cut off the top. So to vertically align that element in that area you have 2 pixels above and and one below. Unless the header is showing 25 pixels then it is 2 and 2.

But at 2X scale that typical header might show 50 1/2 pixels. With a UI element that is 40 high and a 1 pixel shadow so 41 in total. So you get padding of approximately 5 pixels above and below. Because of these differences the padding at 2X looks nicer than at 1X because it more than doubles. All because of our variable inter-area line overlap and the fact that the UI shadow doesn't scale.

In short, the padding is very small and varies in ways that are not obvious. Even adding a single pixel above and below - so defining headers to be 28 pixels rather than 26 makes a lot of these issues less noticeable.

Making all the headers a little bit higher as in the first patch may be ok, but as much in the current patch seems excessive. Maybe that's what was meant anyway.

Best to update the patch with the proposed change, then we can check what it does exactly.

Blender's UI elements are definitely larger than what you'll see in 2D creative suites, but the same isn't true for 3D suites. With Autodesk using ribbons and Modo using a three-bar header, Blender isn't a significant outlier in terms of header height. UI element width and the lack of a vertical rule separator element are larger issues for the tool header right now.

That said, I'd vote for shrinking the icon over changing the header size. The icon is barely a tertiary state signal in sculpt and paint mode, given that the brush name is displayed in the tool header, and the footer provides similar state info for object and edit mode. I'd rather see changes made to the other 3d viewport header, as making changes there won't create visual conflicts with the rest of the UI and there's more room there for tool-independent settings.

@Asher (ThatAsherGuy) - ...the lack of a vertical rule separator element are larger issues for the tool header right now.

Sorry to focus on this off-topic item, but I've always wanted to redo how we do separators now so we could get a vertical rule for tool headers. Right now now we basically have one separator that turns into a space or rule fairly arbitrarily. I'd love the choice of a vertical separator in headers, and would also love to have horizontal rules in popovers. I just didn't know anyone else wanted those things so have never done anything with the idea.

Would prefer to keep all these bars the same size, having small differences in height feels unnecessary and will probably look wonky when there are ares split side-by-side with some regions a little taller.

Think it's reasonable to make sure all the content in these regions fits properly.