Imgui: Border-corner render artefact with line-antialiasing switched off

[floooh]

As discusses in this twitter thread: https://twitter.com/FlohOfWoe/status/715994448484761600

I can reproduce the problem in the original imgui examples (tested in opengl3_example, opengl_example and directx11_example, see screenshots below). I am compiling from my 'fips' wrapper project here, however, this shouldn't make a difference (e.g. the problem can't be in the render-wrapper of my Oryol engine, since the original samples are used).

To reproduce:

• start one of the samples (opengl3_example, opengl_example, directx11_example)
• under Window Options:
  
  
  
  • switch off the 'No border' checkmark
  
  
  • toggle the 'Anti-aliased lines' checkmark on and off
  
  
• note how the missing pixel in the top or bottom right corner of the border of the collapse-bar widgets
• DO NOT RESIZE THE WINDOW, sometimes the artefact disappears completely after the windows is resized, but it is also possible to make the missing pixel appear and disappear by slowly resizing the window (almost sounds like a rounding bug)? anyway, I can always reproduce the missing pixel right after application start after enabled borders and switching off line-antialising
• ...and at least on the OpenGL renderers, there's brighter pixel (2x rendered?) on the opposite corner

Screenshots:

opengl3_example, OSX, anti-aliased lines off:

opengl3_example, OSX, anti-aliased lines on:

...and some DX11 screenshots coming up (need to switch machines):

directx11_example, antialiased lines off:

directx11_example, antialiased lines on:

Windows screenshots unfortunately appear blurry probably because the examples don't set the DPI-Awareness, but the bottom-right pixel is missing, and the top-level-pixel appears brighter

Btw, here's how I handle HighDPI on Windows in Oryol (at the the dpiAwarenessProc() or dpiAwareProc() functions should be called to prevent Windows from 'guessing' and do backward-compatibility-upscaling): https://github.com/floooh/oryol/blob/master/code/Modules/Gfx/win/winDisplayMgr.cc#L233)

[ocornut]

Thanks!
Which setting did you use to create this shot? It has a missing pixel on the upper-right of frames.

[floooh]

These are the settings I'm using there:

    ImGuiStyle style = ImGui::GetStyle();
    style.WindowRounding = 0.0f;
    style.Alpha = 1.0f;
    style.WindowFillAlphaDefault = 1.0f;
    style.WindowTitleAlign = ImGuiAlign_Center;
    style.TouchExtraPadding = ImVec2(5.0f, 5.0f);
    style.AntiAliasedLines = false;
    style.AntiAliasedShapes = false;

https://github.com/floooh/yakc/blob/master/src/ui/UI.cc#L38

[floooh]

...but the culprit is the definitely the AntiAliasedLines flag, switching this on fixes the issue completely in the emulator's UI (I switched AA off because one of the 2 anti-alias options caused a noticeable performance drop on really low-end devices (older mobile and RaspberryPi) if I remember right).

[ocornut]

You'd want to look at ImDrawList::AddRect() > PathRect > PathStroke > AddPolyline sequence. Actual rendering is in AddPolyline it is a generic poly line tracer that generate 2 triangles for each line.

You may experimentally alter some of the value in some of those functions or attempt to unroll that loop with known value to get a better understanding of it and begin to find a solution.
This is looking fairly tricky. Too exhausted to look today :/

DO NOT RESIZE THE WINDOW

Do you mean the imgui window or the host window and framebuffer?

[floooh]

The imgui window.

In the meantime I've uploaded a new version of the emulator which has anti-aliased lines on, so that the artefact disappears, but it is possible to get the old behaviour with a new menu-item under "Settings".

Another interesting thing I just noticed: whether the missing pixel is in the top-right-corner or bottom-right-corner seems to flip from build to build (at least in the emscripten version). I had one build where the missing pixel was bottom-right, and the next build it was top-left, but it seems to be consistent between restarts of the the same build.

I'll see if I can put some time into analyzing the problem, but it's not super-critical for me (especially since switching on AA for lines fixes it).

[ocornut]

Btw the Metrics Window now allows you to inspect individual vertices.

Here the top 2 triangles are the background frame, and the 8 following triangles are the 4 lines around the frame (2 triangles per line).

[ocornut]

Stumbled on this ooold issue while looking for something.. This has been fixed last year in #1646.