如何在 Electron 应用程序上获得圆角？

Question

我目前正在尝试在我正在制作的 Electron 应用程序上获得圆角。我已经尝试了目前在线提供的几乎所有解决方案，但没有一个有任何区别。

如何圆润我的 Electron 应用程序的角落？

Answer 1

制作无框透明窗

const myWindow = new BrowserWindow({
    transparent: true, 
    frame: false
})

并在渲染器中添加类似的内容，或者将样式直接应用到 body 标签

<div style="width: 500px; height: 500px; border-radius: 5px">My window content</div>

只需确保还添加一个具有

-webkit-app-region: drag

的自定义窗口标题栏，以便使窗口可从此元素拖动。

查看 Electron 文档以获取更多信息；） https://github.com/electron/electron/blob/master/docs/api/frameless-window.md#transparent-window

Answer 2

对我来说，就是这样工作的：

const myWindow = new BrowserWindow({ 背景颜色: '#00FFFFFF', 框架：假