UI: Make 3D Viewport header transparent #109735

Pablo Vazquez · 2023-07-05T12:45:54+02:00

Pablo Vazquez commented

2023-07-05 12:45:54 +02:00

Back in Blender 3.0, the header and toolbar position were swapped to
follow hierarchy of settings. However, due to the header having usually
less buttons than the toolbar, it looked weird so it was decided to
make it fully opaque.

Based on user feedback it is preferred to have transparency and gain that
extra bit of space, even if at times it could look weird due to the header
having less items.

This PR makes it so the header supports region overlap, and makes it fully
transparent.

Fixes #92844

Related PR !107094

Back in Blender 3.0, the header and toolbar position were swapped to follow hierarchy of settings. However, due to the header having usually less buttons than the toolbar, it looked weird so it was decided to make it fully opaque. Based on user feedback it is preferred to have transparency and gain that extra bit of space, even if at times it could look weird due to the header having less items. This PR makes it so the header supports region overlap, and makes it fully transparent. ![image](/attachments/9399c50b-ab87-415d-9662-e71a2219bcad) Fixes #92844 Related PR !107094

image.png

33 KiB

👍 6 😕 4 ❤️ 2 🎉 1

Pablo Vazquez added 1 commit 2023-07-05 12:46:07 +02:00

2fe67d044f UI: Make 3D Viewport header transparent

Back in Blender 3.0, the header and toolbar position were swapped to
follow hierarchy of settings. However, due to the header having usually
less buttons than the toolbar, it looked weird so it was decided to
make it fully opaque.

Based on user feedback it is preferred to have transparency and gain that
extra bit of space, even if at times it could look weird due to the header
having less items.

This PR makes it so the header supports region overlap, and makes it fully
transparent.


Fixes #92844

Related PR !107094

Pablo Vazquez added this to the User Interface project 2023-07-05 12:46:46 +02:00

Pablo Vazquez added the

Module

User Interface

label 2023-07-05 12:46:59 +02:00

Nika Kutsniashvili commented

2023-07-05 15:01:38 +02:00

Will we not be able to turn alpha to 1 and keep it as it is in 3.6?

Pablo Vazquez commented

2023-07-05 15:10:12 +02:00

Will we not be able to turn alpha to 1 and keep it as it is in 3.6?

It is still possible to set alpha to any value, the difference is that it now affects both header and toolbar, not just the toolbar.

This is with alpha 0.9:

> Will we not be able to turn alpha to 1 and keep it as it is in 3.6? It is still possible to set alpha to any value, the difference is that it now affects both header and toolbar, not just the toolbar. This is with alpha 0.9: ![image](/attachments/3aaf85d8-993c-4be0-b16f-679a433e9e38)

image.png

33 KiB

Lloyd commented

2023-07-10 08:34:27 +02:00

First-time contributor

Tried it with the [8/7] 4.0 build. Still cannot change the Header Alpha.

Pablo Vazquez commented

2023-07-11 12:46:56 +02:00

Tried it with the [8/7] 4.0 build. Still cannot change the Header Alpha.

@LloydAlmeida did you apply the patch or compile the branch? In the top-left you can see this PR is in Open state which means it hasn't been merged to main.

> Tried it with the [8/7] 4.0 build. Still cannot change the Header Alpha. @LloydAlmeida did you apply the patch or compile the branch? In the top-left you can see this PR is in `Open` state which means it hasn't been merged to main.

Nika Kutsniashvili commented

2023-07-11 13:19:37 +02:00

Would you consider header and toolbar having different color and alphas? It would give more flexibility to themes and for those of us on custom themes who don't want the transparent header we will be able to keep as it is in 3.6

Lloyd commented

2023-07-14 09:40:27 +02:00

First-time contributor

@pablovazquez Who needs to sign off this patch so that it can be merged into main ?

Julien Kaspar commented

2023-07-14 11:46:20 +02:00

I'm kinda torn on this. For some editors and modes this works well.

It also adds a (tbh negligibly slim) space to the clickable area
Visually it can be very appealing, like in object and edit mode.

But on the other side it leads to

Very awkward arrangements on most modes in the 3D view and also the Image/UV Editors
Some buttons and icons with no backdrop or can even be clicked through

These few icons would definitely still need a background color (like pin icon in image editor, mirror icon in paint modes and tool icons on a hidden toolbar).

The "Inner" theme color of "Pulldowns" should also get an Alpha of 1.0 to avoid transparent menu buttons.

I'm kinda torn on this. For some editors and modes this works well. - It also adds a (tbh negligibly slim) space to the clickable area - Visually it can be very appealing, like in object and edit mode. But on the other side it leads to - Very awkward arrangements on most modes in the 3D view and also the Image/UV Editors - Some buttons and icons with no backdrop or can even be clicked through These few icons would definitely still need a background color (like pin icon in image editor, mirror icon in paint modes and tool icons on a hidden toolbar). ![image](/attachments/c433d4ff-bba8-4e82-85bf-cd8bbe6d623f) ![image](/attachments/41ac030f-f342-4d1f-9194-ff07e8c3cbe3) ![image](/attachments/d1100727-2148-4a65-b311-7cf854ce5f86) The "Inner" theme color of "Pulldowns" should also get an Alpha of 1.0 to avoid transparent menu buttons.

image.png

22 KiB

image.png

26 KiB

image.png

18 KiB

👍 3

Lloyd commented

2023-07-14 15:10:53 +02:00

First-time contributor

@JulienKaspar This patch doesn't change anything. The issues you mentioned "Some buttons and icons with no backdrop or can even be clicked through" currently exist n master. This Patch just allows the Header transparency to be changed as currently it does not.

Julien Kaspar commented

2023-07-14 16:46:35 +02:00

It does change the header transparency to 0 and makes you able to click through though.
This makes these problems more obvious. That's why I brought them up.

It does change the header transparency to 0 and makes you able to click through though. This makes these problems more obvious. That's why I brought them up.

Lloyd commented

2023-07-14 17:08:23 +02:00

First-time contributor

@JulienKaspar So is there a simpler way to just get the Header to be transparent as well. This regression has existed for more than 2 years. Its was suddenly changed [ I could be wrong but I did not come across any discussion when the change was done ]

Not everyone uses the Tool Settings under the Header.

@JulienKaspar So is there a simpler way to just get the Header to be transparent as well. This regression has existed for more than 2 years. Its was suddenly changed [ I could be wrong but I did not come across any discussion when the change was done ] Not everyone uses the Tool Settings under the Header.

Julien Kaspar commented

2023-07-20 10:30:47 +02:00

I'm all for bringing the option back to turn the header transparent. If it's just that and making it by default something between alpha 0.7 and 0.9, this is fine 👍

But making it click-through can lead to problems. Also making it alpha 0 by default leads to readability issues.
I'd say those topics could be separated from this patch.
Here's just some screenshots for comparison on the most offending modes. Since on the default gray background it doesn't make a difference I switched to Eevee.

I'm all for bringing the option back to turn the header transparent. If it's just that and making it by default something between alpha 0.7 and 0.9, this is fine 👍 But making it click-through can lead to problems. Also making it alpha 0 by default leads to readability issues. I'd say those topics could be separated from this patch. Here's just some screenshots for comparison on the most offending modes. Since on the default gray background it doesn't make a difference I switched to Eevee.

header_current.png

2.1 MiB

header_alpha0.png

2.0 MiB

❤️ 1

Harley Acheson commented

2023-07-20 19:56:50 +02:00

Personally I'd consider just changing the overlap behavior (the area.cc change) without any of the rest for now. Then later consider the colors/values with other theme changes.

Note however that your change also makes the header of Image Editor behave similarly. If this is intentional you should probably note it in the comment, otherwise you'd have to restructure the code. Personally I like Image Editor like that though.

Personally I'd consider just changing the overlap behavior (the area.cc change) without any of the rest for now. Then later consider the colors/values with other theme changes. Note however that your change also makes the header of Image Editor behave similarly. If this is intentional you should probably note it in the comment, otherwise you'd have to restructure the code. Personally I like Image Editor like that though.

Lloyd commented

2023-08-07 08:28:11 +02:00

First-time contributor

Tried this on blender-4.0.0-alpha+main.d870f9e841a5 Aug 6 build. Still unable to change the Alpha.

IMO the Alpha does not have to be 0 by Default as long as Users can change it.

Tried this on blender-4.0.0-alpha+main.d870f9e841a5 Aug 6 build. Still unable to change the Alpha. IMO the Alpha does not have to be 0 by Default as long as Users can change it.

Harley Acheson commented

2023-08-09 00:11:30 +02:00

@LloydAlmeida - Tried this on blender-4.0.0-alpha+main.d870f9e841a5 Aug 6 build. Still unable to change the Alpha.

As mentioned previously in this thread, the status of this is shown at the top-left as "open". This feature won't be in a release version of Blender until it is approved and merged. At that point the status will change.

> @LloydAlmeida - Tried this on blender-4.0.0-alpha+main.d870f9e841a5 Aug 6 build. Still unable to change the Alpha. As mentioned previously in this thread, the status of this is shown at the top-left as "open". This feature won't be in a release version of Blender until it is approved and merged. At that point the status will change.

Lloyd commented

2023-08-11 08:14:08 +02:00

First-time contributor

@Harley So who do we need to tag so that this Patch can be reviewed ? Is there someone who leads the UI/UX Module ? Ive posted a link to this Patch in blender Chat [UI and Coders section] and requested someone to have a a look at it multiple times but nothing seems to happen.

Harley Acheson commented

2023-08-11 19:15:30 +02:00

@LloydAlmeida - So who do we need to tag so that this Patch can be reviewed ? Is there someone who leads the UI/UX Module ?

With this particular PR I'm not too worried about the listed reviewers. There are some review comments above to address, but If Pablo wants this we can make it happen before the end of Bcon1 (Aug 22). He's been off at Siggraph so we'll try to talk about this next week.

> @LloydAlmeida - So who do we need to tag so that this Patch can be reviewed ? Is there someone who leads the UI/UX Module ? With this _particular_ PR I'm not too worried about the listed reviewers. There are some review comments above to address, but If Pablo wants this we can make it happen before the end of Bcon1 (Aug 22). He's been off at Siggraph so we'll try to talk about this next week.

❤️ 1

Pablo Vazquez commented

2023-08-16 19:04:58 +02:00

As discussed in the latest UI Module meeting, the decision is to go with enabling Region Overlap in the 3D Viewport, but not on other editors in order to prevent issues like the ones in the image editor mentioned here. @Harley will take over this over the coming days.

Theme changes will be done as a separate patch when needed.

As discussed in the latest UI Module meeting, the decision is to go with enabling Region Overlap in the 3D Viewport, but not on other editors in order to prevent issues like the ones in the image editor mentioned here. @Harley will take over this over the coming days. Theme changes will be done as a separate patch when needed.

😕 1

Pablo Vazquez closed this pull request

2023-08-16 19:05:00 +02:00

Pablo Vazquez deleted branch temp-ui-view3d-header

2023-08-16 19:05:18 +02:00

Paul Kotelevets commented

2023-08-30 20:31:29 +02:00

First-time contributor

Header transparency is a feature which is nice to have, but not sure about defaults.
For example, the reason we don't use region overlap is that our content we work with is a global captcha which makes any transparent elements barely distinguishable.

Header transparency is a feature which is nice to have, but not sure about defaults. For example, the reason we don't use region overlap is that our content we work with is a global captcha which makes any transparent elements barely distinguishable. ![image](/attachments/aadeb9d7-71f8-4410-948b-d05dec7c5df0)

image.png

2.4 MiB

Philipp Oeser referenced this pull request

2023-12-01 10:35:11 +01:00

Unable to right click on header sometimes (to show Tool Settings or Menus or Hide header) #115632