codesbiome/electron-react-webpack-typescript-2024

Multiple Window Close/Enlarge buttons

LeonardoGentile opened this issue · 2 comments

Hello,
I've just cloned the repo and launched the demo without editing any files and this is what I see in the generated window on macOs

image

As you can see the window has the default MacOs window buttons on the left AND the default Windows buttons on the right.
Is this something expected on dev mode or it is due to the inclusion of the Custom Window module?

Hello @LeonardoGentile, thank you for reaching out.

This project is developed in Windows environment, that's why testing of these MacOS specific things was tricky.


As you can see the window has the default MacOs window buttons on the left AND the default Windows buttons on the right.

Default Traffic Light buttons you can hide using following after new BrowserWindow() declaration. (Reference)

src/main/appWindow.ts

  // Create new window instance
  appWindow = new BrowserWindow({ .... });

  // hides the traffic lights
  appWindow.setWindowButtonVisibility(false);

And you can change custom titlebar "Windows" buttons by using mac platform in appRenderer.tsx

<WindowFrame title='ERWT Boilerplate' platform='mac'>

Thanks,
I'm new to electron so I'll take a better look into this.
But it would feel more natural as a user to show the standard MacOs traffic lights buttons in the app build for Mac os (while hiding the windows ones) and vice-versa if the app build target is Windows.

I guess this should be feasible but I'm not sure if it is/should be included in your boilerplate.