我正在尝试使用 ElectronJs 制作一个透明窗口，但我获得了黑色背景。
我在 Linux (Debian Jessie)
我尝试了不同的版本:最新版本、测试版本和每晚版本，结果相同。
我有一个 NW.js 版本，可以在同一台机器上运行，所以我认为这是一个 Electron 问题。
这是我的代码 main.js :
const {app, BrowserWindow} = require('electron');
let mainWindow;
function createWindow () {
mainWindow = new BrowserWindow({width: 920, height: 300, frame:true, transparent:true, backgroundColor: '#00FFFFFF'});
mainWindow.loadFile('index.html');
mainWindow.on('closed', function () {
mainWindow = null;
});
}
app.on('ready', createWindow);
这是我的代码
index.html :<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
</head>
<body style="background-color:rgba(255,255,255,0); color:lightgrey;">
<h1>Hello World!</h1>
<!-- All of the Node.js APIs are available in this renderer process. -->
We are using Node.js <script>document.write(process.versions.node)</script>,
Chromium <script>document.write(process.versions.chrome)</script>,
and Electron <script>document.write(process.versions.electron)</script>.
<script>
// You can also require other files to run in this process
// require('./renderer.js')
</script>
</body>
</html>
问题是背景不是透明的而是黑色的:
尝试过不同的事情但没有成功(例如
app.disableHardwareAcceleration() )有人知道解决方案或有完整的工作示例吗？
谢谢
-
编辑 1:
也试过有没有
--enable-transparent-visuals --disable-gpu如前所述here
最佳答案
这是 Electron 项目中一个非常古老的回归错误。
见 https://github.com/electron/electron/issues/15947
要绕过这个问题，只需降级到 1.4.16 2.0.16 ，最后一个工作版本。
编辑 1:如果您在准备好事件后等待至少 300 毫秒以打开窗口，它将正常工作
app.on('ready', () => setTimeout(onAppReady, 300));
--disable-gpu package.json 中的选项"start": "electron --enable-transparent-visuals ."
编辑 2:
要使其开箱即用，请使用此存储库:https://gitlab.com/doom-fr/electron-transparency-demo
git clone https://gitlab.com/doom-fr/electron-transparency-demo
cd electron-transparency-demo
npm install
npm start
# or npm run startWithTransparentOption
# or npm run startWithAllOptions
npm start 合作和 npm run startWithTransparentOption编辑 3:
也请查看@Thalinda Bandara answer below :
它可能很有趣(未经测试，但已经在其他地方看到过)。
关于javascript - 无法在 Electron 中成功制作透明窗口(javascript)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53538215/