解决Electron使用透明窗口无效

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了解决Electron使用透明窗口无效相关的知识,希望对你有一定的参考价值。

参考技术A 在electron中使用透明窗口时,遇到了一些坑,这里总结一下

frame设置为false是为了用无边窗口,transparent设置为true是使用窗口的透明效果。
而这里又设置了backgroundColor为一个透明的颜色,是因为BrowserWindow默认的背景颜色是白色,设置透明之后,才能够真正地看到透明的效果。有的文章提到,开发模式开启devtool也有可能导致背景白色,这里主动设置BrowserWindow的颜色的话,可以不用关注开发模式的一些区别。

如果发现经过上述设置之后,窗口仍然不能透明的话,可能和Windows的设置有关
在Win7下,需要开启aero功能,在Win10下,需要开启颜色->透明效果

私货:
字节跳动技术中台团队现在正在火热校招中,欢迎想要来校招、实习生、社招小伙伴联系我~

以上是关于解决Electron使用透明窗口无效的主要内容,如果未能解决你的问题,请参考以下文章

vuejs electron webpack集成使用

Electron应用结构

使用 Electron 在 Angular 2 应用程序中访问文件系统

Electron曲线解决无边框窗口模式下,关闭缓慢的问题。

在electron中使用sqlite3,win10系统

Electron常见问题 59 - 解决窗口位置显示错乱问题