TC10.50b3: Dark mode: white line under main menu

[Erik-DJ]

In dark mode there is an ugly white line under the main menu. I know it’s drawn by Windows itself (main menu is a standard Windows component) but it messes up the nice dark mode of TC. Perhaps some options:

• I know you did some custom drawing to the main menu. Perhaps you could remove the white line too (or some canvas line drawing over it)?

• Draw a dark colored flat/small TPanel over the white line of the main menu.

• In my own Delphi applications (VCL custom dark mode) I hide the TMainMenu and use a TToolbar for it. This works (no ugly lines) but it has some other issues, like not drawing icons in the menu (or it becomes ugly).
  MainMenuToolBar.Menu := MainMenu1;
  MainForm.Menu := nil;

• Hide the main menu completely (optional) until the user presses Alt or F10 or a new button called ‘show main menu’ (like in XYplorer).

I think most users of dark mode also like a clean user interface (less lines). Thanks!

[Erik-DJ]

Hi Cristian, I did some testing in Lazarus to paint over a MainMenu, trying to hide the white line. Something like this can work but you have to trigger the redrawing (and end-of-drawing) of the MainMenu:

var
XFrame, YFrame; {X and Y size of Sizeable area of Frame}
begin
{Get size of form frame}
XFrame := GetSystemMetrics(SM_CXFRAME);
YFrame := GetSystemMetrics(SM_CYFRAME);

Canvas.Handle := GetWindowDC(Self.Handle); {Get Device context for drawing}
try
Canvas.Brush.Color:= clBlack;
Canvas.FillRect(XFrame + 0, YFrame + 40, XFrame + 1000, YFrame + 50);
finally
ReleaseDC(Self.Handle, Canvas.Handle);
Canvas.Handle := 0;
end;

// From: http://www.delphicorner.f9.co.uk/articles/forms6.htm

[ghisler(Author)]

I tried that a while ago and tried it just now by handling WM_NCPAINT.
It seems to work, the line is overdrawn as it should. However, when I switch focus to a different app (small, so TC is still visible) the white line reappears, and WM_NCPAINT isn't called. It looks like Windows draws the white line by itself in this case.

Once the white line is back, it stays visible even when I switch back to TC. In only disappears when I open one of the main menu items.

[Erik-DJ]

Okee let's hang in here, it's almost fixed
I was testing in Lazarus but the WM_NCPAINT message is not implemented yet?
But if it works for you then you only have to trigger on the application deactivation event.

In Lazarus you have the component TApplicationProperties with the events Deactivate and Activate. In Delphi you have the component TApplicationEvents also with Deactivate and Activate.

If you do the repaint over the white line also on Deactivate (and Activate) then hopefully it works (it works in my test-application).

Also please do not repaint it with the TC border-line-color but with TC background-color so no line is visible at all. The less lines the better I think.

[ghisler(Author)]

I was testing in Lazarus but the WM_NCPAINT message is not implemented yet?

Yes, you need to subclass the main window because WM_NCPAINT wasn't passed to the app.

If you do the repaint over the white line also on Deactivate (and Activate) then hopefully it works (it works in my test-application).

That brought me to the right solution: I need to handle WM_NCACTIVATE in addition to WM_NCPAINT!

So far it seems to work fine. I didn't like the hard coded +40 value, so I looked for a better solution. Here is the code I'm using now:

Code: Select all

    fillchar(mbifo,sizeof(mbifo),#0);
    mbifo.cbSize:=sizeof(mbifo);
    if darkmode and GetMenuBarInfo(Ahwnd,OBJID_MENU,0,@mbifo) then begin
      windows.GetWindowRect(Ahwnd,RW);
      windowtop:=rw.top;
      MapWindowPoints(0,Ahwnd,RW,2);
      OffsetRect(RW,-RW.Left,-RW.Top);
      dc := GetWindowDC(Ahwnd);
      br:=CreateSolidBrush(darkmode_inactiveborder);
      r2:=RW;
      r2.top:=mbifo.rcBar.bottom-windowtop;
      r2.bottom:=r2.top+1;
      FillRect(dc,r2,br);
      DeleteObject(br);
      ReleaseDC(Ahwnd, dc);
    end;

[Erik-DJ]

Well that sounds great! Looking forward to beta 4. Thanks.

[Paul Mountit]

this is great, but this line:

Code: Select all

    
          br:=CreateSolidBrush(darkmode_inactiveborder);

worries me: darkmode_inactiveborder as for now is not user configurable. please make this a user configurable color.
something like darkmode_replacewhitelineundermenu, to be defined in the color settings dialog

[ghisler(Author)]

It is configurable in TC 10.50 beta!
You can set it on the Color page, section "Dark mode:": "Border".

It's the same color as the other dividers on the main form.

[Paul Mountit]

It is configurable in TC 10.50 beta!
You can set it on the Color page, section "Dark mode:": "Border".

It's the same color as the other dividers on the main form.

ok, I thought that "border" and "inactiveborder" was 2 different things
I'd like anyway if this settings could be different from the other dividers, to be able to make the border between menu and buttons bar disappear completly. or maybe could it be selectable between border color and background color?

[ghisler(Author)]

There are two borders, the inactive border for controls which don't have the focus, and the active border (e.g. when an edit box has the focus), which uses the same color as the font.

[Paul Mountit]

There are two borders, the inactive border for controls which don't have the focus, and the active border (e.g. when an edit box has the focus), which uses the same color as the font.

ok. all is clear now. Anyway I'd really like to be able to choose a custom colour for this setting.

[ghisler(Author)]

Wouldn't it look as bad as it does now when the line above the button bar has a different color than the line below it? That's why I'm using the same (configurable) color.

[Paul Mountit]

this is what I'd like to be able to do with the dark theme: get rid of the 3 lines in the left image to make it look like vs 2022 in the right image, so the result is shown in the bottom image
Image: https://drive.google.com/file/d/1ulnpnkG_n0Berm2J1sPJTPMLzvltUwjm/view?usp=sharing

[petermad]

01.05.22 Fixed: Dark mode: Overdraw white line under the main menu with dark mode border color, configurable via Configuration-Options-Color (32/64)

Confirmed fixed in TC 10.50b4

[ghisler(Author)]

this is what I'd like to be able to do with the dark theme: get rid of the 3 lines in the left image to make it look like vs 2022

Well, you can set the separator line color to the background color, but then you will not have lines in most dialogs either...