Ash*_*lin 3 html javascript css node.js electron
每次窗口开始加载新的 html 或向服务器发出请求时，窗口将变为白色，直到页面完成加载或服务器响应请求。这看起来一点也不好看，而且可能会很刺耳。我怎么能阻止这个？
如果你想看它的代码
app.js
const {app, BrowserWindow} = require('electron');
const path = require('path');
const url = require('url');
let win;
function createWindow () {
// Create the browser window.
win = new BrowserWindow({width: 800, height: 600});
win.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}));
win.on('closed', () => {
win = null;
})
}
app.on('ready', createWindow);
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
if (win === null) {
createWindow()
}
});
inedx.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body style="background-color: #222222">
<a href="index.html" style="color: white">Click on me to see a flash</a>
</body>
</html>
据我所知（就像这里：构建跨平台电子应用程序的 4 个必须知道的技巧）设置窗口的背景颜色是至少减轻“闪光”的典型方法。也许您可能会喜欢CSS在加载之前淡出窗口内容，然后在新内容加载后淡入的过渡？
从那个网站：
2.1 指定 BrowserWindow 背景色 如果您的应用程序具有非白色背景色，请确保在您的 BrowserWindow 选项中指定它。这不会在您的应用程序加载时阻止纯色方块，但至少它也不会在中途改变颜色：
mainWindow = new BrowserWindow({
title: 'ElectronApp',
backgroundColor: '#002b36',
};
2.2 在页面加载之前隐藏您的应用程序：因为我们实际上是在浏览器中，所以我们可以选择隐藏窗口，直到我们知道所有资源都已加载。启动时，请确保隐藏您的浏览器窗口：
var mainWindow = new BrowserWindow({
title: 'ElectronApp',
show: false,
};
然后，当所有内容都加载完毕后，显示窗口并聚焦它，以便为用户弹出。您可以使用 'ready-to-show' 事件
BrowserWindow（推荐）或 webContents 上的 'did-finish-load' 事件来执行此操作。
mainWindow.on('ready-to-show', function() {
mainWindow.show();
mainWindow.focus();
});
| 归档时间： |
|
| 查看次数： |
5288 次 |
| 最近记录： |