电子在浏览器中加载页面时如何显示加载旋转器

Question

我正在构建一个电子浏览器应用程序。该应用将加载外部URL(仅(我的问题是如何在加载页面时添加旋转器(GIF图像(。我知道甚至还有一个"启动载荷"。这很好，但是我没有找到一种向跑步者展示的方法。另外，电子/浏览器中没有状态栏选项。放它会有我的最爱。

有什么想法如何做？

Answer 1

可能会创建一个启动应用程序后立即打开的第二个窗口。基本上只是带有旋转器的飞溅屏幕。您的主窗口应在加载时隐藏，但是一旦did-finish-load发射，您可以关闭飞溅屏幕并显示主窗口。

Answer 2

如果您只是在寻找一个基本指示，即WebApp正在加载某些URL内容，则此代码可能会有所帮助。它更改窗口的标题并显示一个进度栏(您可能还可以更改图标等(。创建主窗口后：

const mainWindow = new BrowserWindow({ .... });      
mainWindow.webContents.on('did-start-loading', () => {
    mainWindow.setTitle(APP_NAME + ' * Loading ....');
    mainWindow.setProgressBar(2, { mode: 'indeterminate' }) // second parameter optional
});
mainWindow.webContents.on('did-stop-loading', () => {
    mainWindow.setTitle(APP_NAME);
    mainWindow.setProgressBar(-1);
});

如果有人可以为动画标题提供某些手段，很高兴听到(可能是setInterval/clearInterval捆绑包，尚未弄清楚(。

也可以在加载时进行mainWindow.setOpacity(0.8)，但对我来说看起来不好。