Verhindern weißer Blitz zwischen Seitenlasten Elektron

Jedes Mal, wenn das Fenster beginnt, neues HTML zu laden oder eine Anfrage an den Server stellt, wird das Fenster weiß, bis die Seite fertig geladen ist oder der Server auf die Anfrage geantwortet hat. Das sieht überhaupt nicht gut aus und kann ziemlich störend sein. Wie kann ich das stoppen?Verhindern weißer Blitz zwischen Seitenlasten Elektron

Der Code, wenn Sie möchten, es sehen
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>

Quelle

2017-02-04 Ashlin

Soweit ich (wie hier: 4 must-know tips for building cross platform Electron apps) gesehen haben, die Einstellung der Hintergrundfarbe Das Fenster ist der typische Weg, um den "Blitz" zumindest zu mildern. Vielleicht könntest du mit einem CSS Übergang dazu kommen, den Fensterinhalt vor dem Laden auszublenden und dann einzublenden, sobald der neue Inhalt geladen ist?

Von diesem Standort:

2,1 Geben Sie einen Browserfenster Hintergrundfarbe Wenn Ihre Anwendung eine nicht-weiße Hintergrundfarbe hat, stellen Sie sicher, dass es in Ihren Browserfenster Optionen angeben. Dadurch wird der Platz-of-unifarbenen , während die Anwendung geladen wird nicht verhindern, aber zumindest ist es nicht auch Farbe zur Hälfte ändern:

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

2,2 Verstecken Sie Ihre Anwendung, bis die Seite geladen wird: Weil wir tatsächlich im Browser sind, können wir die Fenster verstecken wählen, bis wir alle unsere Ressourcen geladen wurden wissen nach dem Start, sicher machen Ihre Browser-Fenster zu verstecken.

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

Dann, wenn alles geladen ist, zeigen Sie das Fenster und fokussieren Sie es, so dass es erscheint für den Benutzer. Sie können dies mit dem "ready-to-show" -Ereignis auf Ihrem BrowserWindow, das empfohlen wird, oder dem "did-final-load" -Ereignis auf Ihrem webContents tun.

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

Quelle

2017-02-04 05:19:05

leider hat das nicht Problem behoben, die Hintergrundfarbe wirkt sich nur auf die App, wenn es beginnt, und die anderen Änderungen haben keine merklichen effect.I kann nicht verstehen, warum Elektron tut dies wie kein anderer Web-Browser auf diese Weise verhält. – Ashlin

Ich könnte nur eine einzige Seite Anwendung verwenden müssen – Ashlin

Ich habe das gleiche Problem – Jay

Verhindern weißer Blitz zwischen Seitenlasten Elektron

Antwort

Verwandte Themen