電子ローディングアニメーション

Question

電子アプリの読み込みアニメーションを実装するのに手伝ってもらえますか？ 私はこの新しい技術を学んでおり、正しい方法を理解することはうれしいでしょう。

私のような何かについて考えています：ready（唯一の例外は唯一のMacOSで利用可能will-finish-launchingです）前

app.on('ready',() => { 
    // show main content 
}) 

app.on('not-ready',() => { 
    // show loading animation 
}) 

Answer 1

は、私の知る限りではappから放射されたイベントがありません。

さらにがreadyになる前にBrowserWindowを開くことはできませんので、実際に待つ必要があります。

しかし、メインアプリケーションウィンドウの読み込みが非常に遅い場合は、その前に「読み込みウィンドウ」を開いてメインウィンドウの準備ができたら切り替えてください。

const { app, BrowserWindow } = require('electron') 

app.on('ready',() => { 
    let main = null 
    let loading = new BrowserWindow({show: false, frame: false}) 

    loading.once('show',() => { 
    main = new BrowserWindow({show: false}) 
    main.webContents.once('dom-ready',() => { 
     console.log('main loaded') 
     main.show() 
     loading.hide() 
     loading.close() 
    }) 
    // long loading html 
    main.loadURL('http://spacecrafts3d.org') 
    }) 
    loading.loadURL('loding.html') 
    loading.show() 
}) 

---

window.open()

あなたはwindow.open()によってレンダリングプロセスで開かれBrowserWindowのために同じことを行いたい場合はnativeWindowOpenがtrue

main = new BrowserWindow({ 
    webPreferences: { 
    nativeWindowOpen: true 
    } 
}) 
main.webContents.on('new-window', (event, url) => { 
    // there are more args not used here 
    event.preventDefault() 
    const win = new BrowserWindow({show: false}) 
    win.webContents.once('dom-ready',() => { 
    win.show() 
    loading.hide() // don't destroy in this case 
    }) 
    win.loadURL(url) 
    loading.show() 
    event.newGuest = win 
}) 

であれば、あなたは webContentsの new-windowイベントを使用することができます