防止页面加载之间发生白色闪烁电子

每次窗口开始加载新的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>

来源

2017-02-04 Ashlin

据我所看到的（喜欢这里：4 must-know tips for building cross platform Electron apps）设置的背景颜色该窗口是至少减轻“闪光”的典型方式。也许你可能会喜欢CSS转换，以加载之前淡出窗口内容，然后在新内容加载后淡入其中？

从上述站点：

2.1指定BrowserWindow背景色如果您的应用程序具有非白色背景颜色，请确保您 BrowserWindow选项来指定。这不会阻止方的固色，而您的应用程序加载，但至少它不会也中途改变颜色：

mainWindow = new BrowserWindow({ 
    title: 'ElectronApp', 
    backgroundColor: '#002b36', 
    };

2.2隐藏您的应用程序，直到你页面加载：因为我们在浏览器实际上是，我们可以选择隐藏窗口，直到我们知道我们所有的资源都在被加载在启动，确保隐藏浏览器窗口。

var mainWindow = new BrowserWindow({ 
     title: 'ElectronApp', 
     show: false, 
    };

然后，当一切都加载完毕后，显示窗口并将其聚焦，以便为用户弹出。您可以通过BrowserWindow（推荐）或 'did-finish-load'事件在您的webContents上的“准备好展示”事件来实现。

mainWindow.on('ready-to-show', function() { 
     mainWindow.show(); 
     mainWindow.focus(); 
    });

来源

2017-02-04 05:19:05

不幸的是这并没有固定的问题，当它开始和其他的变化都没有明显的effect.I不明白为什么电子做到这一点，因为没有其他Web浏览器这样的行为与背景颜色只影响应用程序。 – Ashlin

我可能只需使用单个页面应用程序 – Ashlin

我面临同样的问题 – Jay

防止页面加载之间发生白色闪烁电子

回答

相关问题