使用 Electron 的自定义形状的独立 windows 应用程序

Question

我想知道是否可以从 electron 应用程序启动自定义形状的独立 window/element。类似于我们在 android 中为 Facebook 应用程序提供的聊天头像。

我应该从哪里开始？如果不是在 electron 中，是否可以使用任何其他 html 框架来解决这个问题。

在 android 中看到的示例。但是我正在考虑 mac/windows/linux

Answer 1

我认为您正在寻找的是 Electron 中的 frameless-windows。当您构建 BrowserWindow 对象时，将 transparent: true 作为选项传递。

var win = new BrowserWindow({ transparent: true});

如果您不想在 window 周围添加边框，您可能还想将 frame: false 作为一个选项传递。

var win = new BrowserWindow({ transparent: true, frame: false});

注意：很遗憾，您还不能点击框架-window，因为他们仍在努力。详细了解 here。

Answer 2

Kristian Poslek 在 Medium 上有一个具有类似无框架 window 概念的教程：https://medium.com/developers-writing/building-a-desktop-application-with-electron-204203eeb658#.n82fds6ra. It's a nice article and he provides a repo at https://github.com/bojzi/sound-machine-electron-guide.git。

他演示的自定义应用程序是矩形的，没有 "window chrome" 或菜单，除了 Mac - 默认应用程序菜单出现。