Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The background color of ImGui windows seems not correct when it is set to transparent white #628

Open
zhangliang07 opened this issue Oct 5, 2024 · 5 comments

Comments

@zhangliang07
Copy link

zhangliang07 commented Oct 5, 2024

It seems like a problem for a long time, and still exists in recent versions.
The color of the ImGui's windows' background in DiligentCore apps is incorrect, when the background color is set to transparent white, such as this code:
ImGui::GetStyle().Colors[ImGuiCol_WindowBg] = ImVec4(1.0f, 1.0f, 1.0f, 0.5f);

The background color shows a transparent dark gray, but it should be transparent white.
With the same setting, the color is correct in the independent ImGui app without DiligentEngine.
In 2.5.3 the color shows right. This is the environment I used with when the problem occurs:
DiligentCore: v2.5.4~v2.5.6
Integrated ImGui: 1.89.1, 1.91.3
OS: Windows 11 with d3d11, d3d12, opengl, and valkan

I hope it can be fixed because I really need a light translucent style :)

The background color in DiligentEngine:
Wrong background color in DiligentEngine

Hoped background color of ImGui app without DiligentEngine:
Correct background color of ImGui app without DiligentEngine

@zhangliang07 zhangliang07 changed the title The background color of ImGui windows is not correct when it is set to transparent white. The background color of ImGui windows is not correct when it is set to transparent white Oct 5, 2024
@zhangliang07 zhangliang07 changed the title The background color of ImGui windows is not correct when it is set to transparent white The background color of ImGui windows seems not correct when it is set to transparent white Oct 5, 2024
@TheMostDiligent
Copy link
Contributor

TheMostDiligent commented Oct 7, 2024

This unfortunately is a much more complicated issue than it looks.
The core problem is that ImGui samples due to historic reasons perform alpha blending in Gamma space, which is mathematically incorrect.
Diligent performs blending in linear space, but to make ImGui colors look similar to what everyone expects, most notable, to make color pickers look correctly, it has to perform some shenanigans with colors.
In particular, the colors get alpha-premultiplied, otherwise all text will be broken.
The solution to your problem would've been to set colors to 2.0, but ImGui clamps color channels to 1.0.

@zhangliang07
Copy link
Author

This unfortunately is a much more complicated issue than it looks. The core problem is that ImGui samples due to historic reasons perform alpha blending in Gamma space, which is mathematically incorrect. Diligent performs blending in linear space, but to make ImGui colors look similar to what everyone expects, most notable, to make color pickers look correctly, it has to perform some shenanigans with colors. In particular, the colors get alpha-premultiplied, otherwise all text will be broken. The solution to your problem would've been to set colors to 2.0, but ImGui clamps color channels to 1.0.

Thanks for your detailed response very much.
I am not familiar with the graphics. You mean that the color in Diligent is correct in mathematics, which the color shown in ImGui is not.
I'll have a try to remove the color clamp in ImGui's code. Thanks a lot.

@TheMostDiligent
Copy link
Contributor

It is not possible to remove color clamp in ImGui because it packs 0.0-1.0 floats into 8 bits.
If you want the same color behavior as in ImGui examples, you can create a RGBA8_UNORM swap chain instead of UNORM_SRGB.
You can take a look at this example
Set

Attribs.SCDesc.RenderTargetFormat = TEX_FORMAT_RGBA8_UNORM;

@zhangliang07
Copy link
Author

It is not possible to remove color clamp in ImGui because it packs 0.0-1.0 floats into 8 bits. If you want the same color behavior as in ImGui examples, you can create a RGBA8_UNORM swap chain instead of UNORM_SRGB. You can take a look at this example Set

Attribs.SCDesc.RenderTargetFormat = TEX_FORMAT_RGBA8_UNORM;

It looks like a little difficult for me, but I will have a try of the above method.
Thank you so much for your help.

@TheMostDiligent
Copy link
Contributor

Use the example I sent - this should not be too complicated.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants