javascript - 如何为node-webkit创建加载屏幕？

Question

我创建了一个node-webkit桌面应用程序，但在我单击 .exe 后需要很长时间才能加载。有什么办法可以显示加载屏幕。我正在寻找解决方案，但没有找到。

Answer 1

要在加载主应用程序屏幕时显示加载屏幕或启动屏幕，请考虑以下步骤:

1. 启动应用程序并将主窗口设置为隐藏。
2. 由于您的主窗口已隐藏，因此请打开另一个窗口，该窗口将充当启动屏幕或加载屏幕。
3. 当您的主应用程序完全加载并准备就绪后，关闭启动屏幕窗口并显示隐藏的主窗口。

<小时/>

第 1 步要在隐藏主窗口的情况下启动应用程序:

在 manifest 中设置 Window 属性的 show: false

{
  "main": "index.html",
  "name": "nw-demo",
  "description": "demo app of node-webkit",
  "version": "0.1.0",
  "keywords": [ "demo", "node-webkit" ],
  "window": {
    "title": "node-webkit demo",
    "icon": "link.png",
    "show": false,
    "toolbar": false,
    "width": 800,
    "height": 500,
    "position": "mouse",
    "min_width": 400,
    "min_height": 200
  }
}

"show": false 属性在应用程序启动时不会显示主窗口。

第 2 步打开加载或启动窗口:

在index.html中编写一个脚本，该脚本将打开另一个窗口，该窗口将充当启动屏幕。

var guiWin = require('nw.gui');   
this.splashScreen = guiWin.open('path/to/splash.html', {
                "transparent": true,
                'frame': false,
                "icon": "path/to/icon.png",
                'position': 'center',
                'always-on-top': true,
                "width": 475,
                "height": 250,
                "resizable": false,
                "toolbar": false,
                "fullscreen": false
            });

第 3 步。当应用程序准备就绪时，关闭启动屏幕并显示主窗口:

当主应用程序完全加载后，您可以通过调用此方法关闭启动窗口并显示主窗口。

function hideSplash() {
    this._splashScreen.close(true);
    guiWin.get().show();            // get the current window and show
    this.splashScreen = null;            
}