Aller au contenu principal

BrowserWindow

Création et gestion des fenêtres navigateur.

Process: Main

Ce module ne peut pas être utilisé tant que l'événement ready du module app n'est pas émis.

// Dans le processus main.
const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ width: 800, height: 600 })

// Charge à partir d'une URL distante
win.loadURL('https://github.com')

// Ou à partir d'un fichier HTML local
win.loadFile('index.html')

Personnalisation de la fenêtre

La classe BrowserWindow permet de modifier l'apparence et le comportement des fenêtres de votre application de diverses façons. For more details, see the Window Customization tutorial.

Affichage gracieux de la fenêtre

Lors du chargement direct d’une page dans la fenêtre, les utilisateurs peuvent voir la page se charger progressivement, ce qui ne fait pas bonne impression pour une application native. Pour afficher la fenêtre sans ce flash visuel, il existe deux solutions pour des situations différentes.

À l'aide de l'événement ready-to-show

Pendant le chargement de la page, l'événement ready-to-show sera émis lorsque le processus de rendu aura affiché la page pour la première fois si la fenêtre n'a pas encore été rendue. Afficher la fenêtre seulement après cet événement permet d'éviter tout flash visuel :

const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ show: false })
win.once('ready-to-show', () => {
win.show()
})

Cet événement est généralement émis après l’événement did-finish-load, mais, attention, pour les pages accédant à beaucoup de ressources distantes, il peut être émis avant l’événement did-finish-load.

Veuillez noter que l'utilisation de cet événement implique que le moteur de rendu est présumé "visible" et rafraîchit, même si show est à false. Cet événement ne se déclenchera jamais si vous utilisez paintWhenInitiallyHidden: false

Définition de la propriété backgroundColor

Pour une application complexe, l’événement ready-to-show peut être émis trop tard, donnant une impression de lenteur. Dans ce cas, il est recommandé d'afficher la fenêtre immédiatement et d'utiliser un backgroundColor proche de la couleur de fond de votre application :

const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ backgroundColor: '#2e2c29' })
win.loadURL('https://github.com')

Notez que même pour les applications qui utilisent l'événement ready-to-show , il est tout de même recommandé de définir backgroundColor pour que l'application semble plus native.

Voici quelques exemples de valeurs de backgroundColor :

const win = new BrowserWindow()
win.setBackgroundColor('hsl(230, 100%, 50%)')
win.setBackgroundColor('rgb(255, 145, 145)')
win.setBackgroundColor('#ff00a3')
win.setBackgroundColor('blueviolet')

For more information about these color types see valid options in win.setBackgroundColor.

Fenêtres parent et enfant

En utilisant l'option parent, vous pouvez créer une fenêtre enfant:

const { BrowserWindow } = require('electron')

const top = new BrowserWindow()
const child = new BrowserWindow({ parent: top })
child.show()
top.show()

La fenêtre child sera toujours au dessus de la fenêtre top.

Fenêtres modales

Une fenêtre modale est une fenêtre enfant qui désactive la fenêtre parente. To create a modal window, you have to set both the parent and modal options:

const { BrowserWindow } = require('electron')

const top = new BrowserWindow()
const child = new BrowserWindow({ parent: top, modal: true, show: false })
child.loadURL('https://github.com')
child.once('ready-to-show', () => {
child.show()
})

Visibilité de la page

L'API Page Visibility fonctionne comme indiqué ci-dessous :

  • Sur toutes les plateformes, l'état de visibilité suit l'état de la fenêtre cachée/minimisée ou pas.
  • De plus, sur macOS, l'état de visibilité suit également l'état d'occlusion de la fenêtre. Si la fenêtre est occultée (c'est-à-dire entièrement recouverte) par une autre fenêtre, l'état de visibilité sera hidden. Sur les autres plateformes, l'état de visibilité sera hidden seulement lorsque la fenêtre est minimisée ou cachée explicitement avec win.hide().
  • Si une BrowserWindow est crée avec show:false, l'état de visibilité initial sera visible même si la fenêtre est cachée.
  • Si backgroundThrottling est désactivé, l'état de visibilité restera visible même si la fenêtre est minimisée, occultée ou cachée.

Il est recommandé de mettre en pause les opérations coûteuses lorsque l'état de visibilité est hidden afin de minimiser la consommation d'énergie.

Avertissement sur les plateformes

  • Sur macOS, les fenêtres modales seront affichés comme des feuilles attachées à la fenêtre parent.
  • Sur macOS, la fenêtre enfant va garder la position relative à la fenêtre parent lorsque la fenêtre parent bouge. Sur Windows et Linux, la fenêtre enfant ne bougera pas.
  • Sur Linux, le type des fenêtre modales sera remplacé par dialog.
  • Sur Linux, beaucoup d'environnements bureau ne peuvent pas cacher une fenêtre modale.

Class: BrowserWindow extends BaseWindow

Création et gestion des fenêtres navigateur.

Process: Main

BrowserWindow est un EventEmitter.

Cela crée une nouvelle BrowserWindow avec les propriétés natives définies par les options.

new BrowserWindow([options])

  • options BrowserWindowConstructorOptions (optional)
    • webPreferences WebPreferences (optional) - Settings of web page's features.
      • devTools boolean (facultatif) - Active ou non les DevTools. Si défini comme à false on ne pourra pas utiliser BrowserWindow.webContents.openDevTools() pour ouvrir les DevTools. La valeur par défaut est true.
      • nodeIntegration boolean (facultatif) - Indique si l'intégration de node est activée. Par défaut la valeur est false.
      • nodeIntegrationInWorker boolean (facultatif) - Indique si l'intégration de node est activée dans les workflows web. Par défaut la valeur est false. More about this can be found in Multithreading.
      • nodeIntegrationInSubFrames boolean (facultatif) - Option expérimentale pour activer le support de Node.js dans les sous-cadres tels que les iframes et les fenêtres enfants. Tous vos préchargements seront chargés pour chaque iframe, vous pouvez utiliser process.isMainFrame pour déterminer si vous êtes dans le cadre principal ou non.
      • preload string (facultatif) - Spécifie un script qui sera chargé avant les autres scripts exécutés dans la page. Ce script aura toujours accès aux API de node peu importe si l'intégration de node est activée ou désactivée. La valeur doit être le chemin absolu vers le script. Lorsque l'intégration des nœuds est désactivée, le script de préchargement peut réintroduire les symboles globaux de nœud dans la portée globale. See example here.
      • sandbox booléen (facultatif) - Si défini, le moteur de rendu associé à la fenêtre, la rendre compatible avec le bac à sable Chromium au niveau du système d'exploitation et la désactivation du nœud. s moteur. Ce n'est pas la même chose que l'option nodeIntegration et les API disponibles pour le script de préchargement sont plus limitées. Read more about the option here.
      • session Session (optional) - Sets the session used by the page. Au lieu de passer l'objet Session directement, vous pouvez également choisir d'utiliser l'option partition à la place, qui accepte une chaîne de partition. Lorsque session et partition sont fournies, session sera préférée. La session par défaut est celle par défaut.
      • partition string (facultatif) - Définit la session utilisée par la page en fonction de la chaîne de partition de la session . Si partition commence par persist:, la page utilisera une session persistante disponible pour toutes les pages de l'application avec le même partition. S'il n'y a pas de préfixe persistant:, la page utilisera une session en mémoire . En assignant la même partition, plusieurs pages peuvent partager la même session. La session par défaut est celle par défaut.
      • zoomFactor number (facultatif) - Facteur de zoom par défaut de la page, 3.0 signifie 300%. La valeur par défaut est 1.0.
      • javascript boolean (facultatif) - Active la prise en charge de JavaScript. La valeur par défaut est true.
      • webSecurity boolean (facultatif) - Lorsque false, il désactivera la politique de même origine (généralement en utilisant des sites de test par des personnes), et définissez allowRunningInsecureContent à true si cette option n'a pas été définie par l'utilisateur. La valeur par défaut est true.
      • allowRunningInsecureContent boolean (facultatif) - Permet à une page https d'exécuter du JavaScript, CSS ou des plugins à partir d'URL http. Par défaut la valeur est false.
      • images boolean (facultatif) - Active le support des images. La valeur par défaut est true.
      • imageAnimationPolicy string (facultatif) - Spécifie comment exécuter les animations d’image (par exemple,. GIFs). Les valeurs possibles sont animate, animateOnce, ou noAnimation. La valeur par défaut est animate.
      • textAreasAreResizable boolean (facultatif) - Rend les éléments TextArea redimensionnables. La valeur par défaut est true.
      • webgl boolean (facultatif) - Active le support WebGL. La valeur par défaut est true.
      • plugins boolean (facultatif) - Indique si les plugins doivent être activés. Par défaut la valeur est false.
      • experimentalFeatures boolean (facultatif) - Active les fonctionnalités expérimentales de Chromium. Par défaut la valeur est false.
      • scrollBounce boolean (facultatif) macOS - Active l'effet scroll bounce(effet élastique) sur macOS. Par défaut la valeur est false.
      • enableBlinkFeatures string (facultatif) - Liste de chaînes de caractères séparées par des ,, comme CSSVariables,KeyEventKey représentant les fonctionnalités à activer. La liste complète des chaînes de caractères supportées peut être trouvée dans le fichier RuntimeEnabledFeatures.json5 .
      • disableBlinkFeatures string (facultatif) - Liste de chaînes de caractères séparées par des, comme par exemple CSSVariables,KeyboardEventKey représentant les fonctionnalités à désactiver. La liste complète des chaînes des fonctionnalités supportées peut être trouvée dans le fichier RuntimeEnabledFeatures.json5 .
      • defaultFontFamily Object (facultatif) - Définit la police par défaut pour la font-family.
        • standard string (facultatif) - Par défaut Times New Roman.
        • serif string (facultatif) - Par défaut Times New Roman.
        • sansSerif string (facultatif) - Arial.
        • monospace string (facultatif) - Courrier New.
        • cursive string (facultatif) - Par défaut Script.
        • fantasy string (facultatif) - Par défaut Impact.
        • math string (facultatif) - Valeur par défaut Latin Modern Math.
      • defaultFontSize Integer (facultatif) - 16.
      • defaultMonospaceFontSize Integer (facultatif) - 13.
      • minimumFontSize Integer (facultatif) - 0.
      • defaultEncoding string (facultatif) - Par défaut ISO-8859-1.
      • backgroundThrottling boolean (facultatif) - Indique si on désire controler les animations et les timers lorsque la page passe en arrière-plan. This also affects the Page Visibility API. Lorsqu’au moins un webContents est affiché dans une seule browserWindow a son backgroundThrottling désactive, les frames seront alors dessinés et échangés pour toute la fenêtre et tout autre webContents affiché. true par défaut.
      • offscreen boolean (facultatif) - Active le rendu hors écran pour la fenêtre du navigateur. Par défaut, false. See the offscreen rendering tutorial for more details.
        • useSharedTexture boolean (facultatif) Expérimental - Utiliser ou non la texture partagée GPU pour un événement de peinture accéléré . Par défaut, false. See the offscreen rendering tutorial for more details.
      • contextIsolation boolean (facultatif) - Indique si les API Electron et le script preload spécifié s'exécuteront dans un contexte JavaScript séparé. Est à true par défaut. Le contexte dans lequel le script preload s’exécute n’aura accès qu'à ses propres document , globales de window et ensemble de types JavaScript intégrés (Array, Object, JSON, etc.), ceux-ci seront tous invisibles pour le contenu chargé. L'API Electron ne sera donc disponible que dans le script de preload et pas dans la page chargée. Cette option doit être utilisée lors du chargement de contenu distant potentiellement non fiable afin de se prémunit de toute utilisation frauduleuse du script preload ou des APIs Electron. Cette option utilise la même technique que celle utilisée par les Chrome Content Scripts. Vous pouvez accéder à ce contexte dans les outils de développement en sélectionnant l'entrée 'Electron Isolated Context' de la liste déroulante en haut de l'onglet Console.
      • webviewTag boolean (optional) - Whether to enable the <webview> tag. Par défaut, false. Remarque : Le script preload configuré pour la <webview> aura l'intégration de node activée lorsqu'il est exécuté, donc vous devez vous assurer que le contenu distant/non fiable n'est pas en mesure de créer une balise <webview> avec un script de preloadpotentiellement malveillant. You can use the will-attach-webview event on webContents to strip away the preload script and to validate or alter the <webview>'s initial settings.
      • additionalArguments string[] (facultatif) - Liste de chaînes qui seront ajoutées au process.argv dans le processus de rendu de cette application. Cette option est utile afin de transmettre de petites informations aux scripts de préchargement du processus de rendu.
      • safeDialogs boolean (facultatif) - Indique s’il faut activer la protection pour les boîtes de dialogue consécutives à la mode "navigateur". Par défaut la valeur est false.
      • safeDialogsMessage string (facultatif) - Le message à afficher lorsque la protection consécutive des dialogues est déclenchée. Si non défini, le message par défaut serait utilisé, notez que le message par défaut est actuellement en anglais et non localisé.
      • disableDialogs boolean (facultatif) - Indique si l faut désactiver complètement les dialogues . Surcharge safeDialogs. Par défaut la valeur est false.
      • navigateOnDragDrop boolean (facultatif) - Indique si le glisser-déposer d'un fichier ou d'un lien sur la page provoque une navigation. Par défaut la valeur est false.
      • autoplayPolicy string (facultatif) - La politique de lecture automatique à appliquer au contenu dans la fenêtre, peut être no-user-gesture-required, user-gesture-required, document-user-activation-required. Par défaut, no-user-gesture-required.
      • disableHtmlFullscreenWindowResize boolean (facultatif) - Indqiue si vous désirez empêcher la fenêtre de se redimensionner lorsque vous passer en plein écran HTML. La valeur par défaut est false.
      • accessibleTitle string (facultatif) définit un titre alternatif fourni uniquement aux outils d'accessibilité tels que les lecteurs d'écran. Cette chaîne n'est pas directement visible par les utilisateurs.
      • spellcheck boolean (facultatif) - Indique si il faut activer le vérifiacateur orthographique intégré. La valeur par défaut est true.
      • enableWebSQL boolean (facultatif) : Inindique s’il faut activer l’api WebSQL . La valeur par défaut est true.
      • v8CacheOptions string (facultatif) - Applique la stratégie de mise en cache du code v8 utilisée par blink. Les valeurs acceptées sont
        • none - Désactive la mise en cache du code
        • code - Mise en cache de code heuristique
        • bypassHeatCheck - Bypass la mise en cache de code heuristique mais avec compilation paresseuse
        • bypassHeatCheckAndEagerCompile - identique à ce qui précède mais la compilation est immédiate. La statégie par défaut est code.
      • enablePreferredSizeMode boolean (facultatif) - Active ou non le mode de taille préféré. La taille préférée est la taille minimale requise pour contenir la mise en page du document sans avoir besoin de le faire défiler. Lorqu' activé ceci provoquera l'émission de l'événement preferred-size-changed sur le WebContents lorsque la taille préférée change. Par défaut la valeur est false.
      • transparent boolean (facultatif) - Permet d'activer la transparence en arrière-plan de la page hôte. La valeur par défaut est true. Note: The guest page's text and background colors are derived from the color scheme of its root element. Lorsque la transparence est activée, la couleur du texte changera toujours en conséquence mais l’arrière-plan restera transparent.
    • paintWhenInitiallyHidden boolean (facultatif) - Indique si le moteur de rendu doit être actif lorsque show est false et qu'il vient d'être créé. Afin que document.visibilityState fonctionne correctement lors du premier chargement avec show: false vous devez définir ceci à false. Mettre ceci à false fera que l'événement ready-to-show ne sera pas déclenché. La valeur par défaut est true.

Événements d’instance

Les objets crées avec new BrowserWindow émettent les évenements suivants :

Remarque : Certains événements sont seulement disponibles sur des systèmes d'exploitation spécifiques et sont étiquetés comme tels.

Événement : 'page-title-updated'

Retourne :

  • event Event
  • title string
  • explicitSet boolean

Émis lorsque le document a modifié son titre, l'appel à event.preventDefault() empêchera le titre de la fenêtre native de changer. explicitSet est faux lorsque le titre est synthétisé à partir de l'URL du fichier.

Événement : 'close'

Retourne :

  • event Event

Emis lorsque la fenêtre va être fermée. Émis avant les événements beforeunload et unload du DOM. L'appel à event.preventDefault() annulera la fermeture.

Normalement, vous devriez utiliser le gestionnaire de beforeunload pour décider si une fenêtre doit être fermée, celui-ci sera aussi appelé lorsque la fenêtre est rechargée. Dans Electron, n'importe quelle valeur retournée autre que undefined annulera la fermeture. Par exemple :

window.onbeforeunload = (e) => {
console.log('I do not want to be closed')

// Unlike usual browsers that a message box will be prompted to users, returning
// a non-void value will silently cancel the close.
// Il est recommandé d'utiliser l'API de dialogue afin de laisser l'utilisateur confirmer la fermeture de
// l'application.
e.returnValue = false
}

Note: Il existe une différence subtile entre les comportements de window.onbeforeunload = handler et de window.addEventListener('beforeunload', handler). Il est recommendé de toujours spécifier l' event.returnValue explicitement, plutôt que de seulement retourner une valeur, car cette méthode fonctionne mieux avec Electron.

Événement : 'closed'

Il est emis lorsque la fenêtre est fermée. Après réception de cet événement, vous devez supprimer la référence vers la fenêtre et, bien sur, éviter de la ré-utiliser.

Événement : 'session-end' Windows

Émis lorsque la session va se terminer à cause d'un redémarrage, un arrêt forcé ou une déconnexion.

Événement : 'unresponsive'

Émis lorsque la page web cesse de répondre.

Événement : 'responsive'

Émis lorsque la page web répond à nouveau.

Événement : 'blur'

Émis lorsque la fenêtre perd le focus.

Événement : 'focus'

Émis lorsque la fenêtre obtient le focus.

Événement : 'show'

Émis lorsque la fenêtre est affichée.

Événement : 'hide'

Émis lorsque la fenêtre est masquée.

Événement : 'ready-to-show'

Émis lorsque la page web à été chargée (tout en n'étant pas affichée) et la fenêtre peut être affichée sans flash visuel.

Veuillez noter que l'utilisation de cet événement implique que le moteur de rendu est présumé "visible" et rafraîchit, même si show est à false. Cet événement ne se déclenchera jamais si vous utilisez paintWhenInitiallyHidden: false

Événement : 'maximize'

Émis lorsque la fenêtre est agrandie.

Événement : 'unmaximize'

Émis lorsque la fenêtre quitte un état maximisé.

Événement : 'minimize'

Émis lorsque la fenêtre est minimisée.

Événement : 'restore'

Émis lorsque la fenêtre est restaurée à partir d’un état réduit.

Événement : 'will-resize' macOS Windows

Retourne :

  • event Event
  • newBounds Rectangle - Size the window is being resized to.
  • Objet details
    • edge (string) - Bord de la fenêtre manipulé pour redimensionner. Peut être bottom, left, right, top-left, top-right, bottom-left ou bottom-right.

Émis avant que la fenêtre ne soit redimensionnée. L’appel à event.preventDefault() empêchera le redimensionnement de la fenêtre.

Notez que cet événement n'est émis que lorsque la fenêtre est redimensionnée manuellement. Le redimensionnement de la fenêtre avec setBounds/setSize n’émettra donc pas cet événement.

Les valeurs et comportements possibles de l'option edge dépendent de la plateforme. Les valeurs possibles étant:

  • Sous Windows, ces valeurs sont bottom, top, left, right, top-left, top-right, bottom-left, bottom-right.
  • Sous macOS, les valeurs possibles ne sont bottom et right.
    • La valeur bottom est utilisée pour indiquer un redimensionnement vertical.
    • La valeur right est utilisée pour indiquer un redimensionnement horizontal.

Événement : 'resize'

Émis après que la fenêtre soit redimensionnée.

Événement : 'resized' macOS Windows

Émis une fois que la fenêtre a fini d'être redimensionnée.

Généralement émis lorsque la fenêtre a été redimensionnée manuellement. Sur macOS, le redimensionnement de la fenêtre avec setBounds/setSize et le réglage du paramètre animate à true émettra également cet événement une fois le redimensionnement terminé.

Événement : 'will-move' macOS Windows

Retourne :

  • event Event
  • newBounds Rectangle - Location the window is being moved to.

Émis juste avant que la fenêtre ne soit déplacée. Sous Windows, l'appel à event.preventDefault() empêchera le déplacement de la fenêtre.

Notez bien qu'il ne sera émis que lorsque la fenêtre est déplacée manuellement. Donc un déplacement de fenêtre utilisant setPosition/setBounds/center n'émettra pas cet événement.

Événement : 'move'

Émis lorsque la fenêtre est déplacée vers une nouvelle position.

Événement : 'moved' macOS Windows

Émis une fois lorsque la fenêtre est déplacée vers une nouvelle position.

Note : Sous macOS, cet événement est un alias de move.

Événement : 'enter-full-screen'

Émis lorsque la fenêtre passe à un état de plein écran.

Événement : 'leave-full-screen'

Émis lorsque la fenêtre revient d'un état de plein écran.

Événement : 'enter-html-full-screen'

Émis lorsque la fenêtre entre dans un état de plein écran déclenchée par l’API HTML.

Événement : 'leave-html-full-screen'

Émis lorsque la fenêtre revient d'un état de plein écran déclenchée par l’API HTML.

Événement : 'always-on-top-changed'

Retourne :

  • event Event
  • isAlwaysOnTop boolean

Émis lorsque la fenêtre est définie ou non définie pour toujours afficher au dessus des autres fenêtres.

Événement : 'app-command' Windows Linux

Retourne :

  • event Event
  • command string

Émis lorsqu'une App Command est appelée. Généralement lié aux touches multimédia du clavier ou aux commandes du navigateur, ainsi que le bouton "Retour" intégré à certaines souris sous Windows.

Les commandes sont en minuscules, les traits de soulignement sont remplacés par des traits d'union, et le préfixe APPCOMMAND_ est supprimé. par exemple APPCOMMAND_BROWSER_BACKWARD est émis sous la forme browser-backward.

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
win.on('app-command', (e, cmd) => {
// Navigate the window back when the user hits their mouse back button
if (cmd === 'browser-backward' && win.webContents.canGoBack()) {
win.webContents.goBack()
}
})

Les commandes d'application suivantes sont explicitement prises en charge sur Linux :

  • browser-backward
  • browser-forward

Événement : 'swipe' macOS

Retourne :

  • event Event
  • direction string

Émis sur un balayage à 3 doigts. Les directions possibles sont up, right, down, left.

La méthode sous-jacente à cet événement est construite afin de pouvoir gérer les glissements sur trackpad selon le styles des 'anciens macOS, où le contenu sur l'écran ne se déplace pas avec le glissement. La plupart des trackpads sur macOS ne sont pas configurés pour continuer à permettre ce type de glissement donc pour que la préférence 'Swipe between pages' dans System Preferences > Trackpad > More Gestures doit être définie à 'Swipe with two or three fingers'.

Événement : 'rotate-gesture' macOS

Retourne :

  • event Event
  • rotation Float

Émis lors du mouvement de rotation du trackpad. Émission continue jusqu'à la fin du geste de rotation. La valeur rotation sur chaque émission est l'angle en degrés tourné depuis la dernière émission. Le dernier événement émis lors d'un geste de rotation sera toujours de la valeur 0. Les valeurs de rotation dans le sens inverse des aiguilles d'une montre sont positives, tandis que les valeurs dans le sens horaire sont négatives.

Événement : 'sheet-begin' macOS

Émis lorsque la fenêtre ouvre une feuille.

Événement : 'sheet-end' macOS

Émis lorsque la fenêtre a fermé une feuille.

Événement : 'new-window-for-tab' macOS

Émis lorsque le bouton natif du nouvel onglet est cliqué.

Événement : 'system-context-menu' Windows

Retourne :

  • event Event
  • point Point - The screen coordinates the context menu was triggered at

Émis lorsque le menu contextuel du système est déclenché dans la fenêtre, ceci est normalement uniquement déclenché lorsque l'utilisateur fait un clic droit sur la zone non-client de votre fenêtre. Dans une fenêtre sans bordure c'est la barre de titre de la fenêtre ou n'importe quelle zone que vous avez déclaré en tant que -webkit-app-region: drag.

L'appel à event.preventDefault() empêchera l'affichage du menu.

Méthodes statiques

La classe BrowserWindow dispose des méthodes statiques suivantes :

BrowserWindow.getAllWindows()

Retourne BrowserWindow[] - Un tableau de toutes les fenêtres ouvertes.

BrowserWindow.getFocusedWindow()

Retourne BrowserWindow | null - Fenêtre ayant le focus dans cette application, sinon retourne null.

BrowserWindow.fromWebContents(webContents)

Retourne BrowserWindow | null - Fenêtre propriétaire du webContents ou null si celui-ci n'est possédé par aucune fenêtre.

BrowserWindow.fromBrowserView(browserView) __ obsolète

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

Retourne BrowserWindow | null - Fenêtre possèdant la browserView. Retournera null. si la vue n'est attachée à aucune fenêtre.

BrowserWindow.fromId(id)

  • id Integer

Retourne BrowserWindow | null - La fenêtre avec l'id donné.

Propriétés d'instance

Les objets créés avec new BrowserWindow ont les propriétés suivantes :

const { BrowserWindow } = require('electron')
// Dans cet exemple `win` est notre instance
const win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('https://github.com')

win.webContents Readonly

Objet WebContents possèdé par cette fenêtre. Tous les événements liés à la page web et les opérations se feront par son intermédiaire.

See the webContents documentation for its methods and events.

win.id Readonly

Propriété de type Integer représentant l'ID unique de la fenêtre. Chaque ID est unique parmi ceux des instances de BrowserWindow de l'application Electron.

win.tabbingIdentifier macOS Readonly

Propriété de type string (facultative) égale au tabbingIdentifier transmise au constructeur de BrowserWindow ou undefined si aucune n’a été définie.

win.autoHideMenuBar

Propriété de type boolean qui détermine si la barre de menu de la fenêtre doit se cacher automatiquement. Une fois définie, la barre de menu ne s'affichera que lorsque les utilisateurs appuient sur la touche Alt seule.

Si la barre de menu est déjà visible, l'assignation à true de cette propriété ne cachera pas immédiatement la fenêtre.

win.simpleFullScreen

Propriété de type boolean déterminant si la fenêtre est en mode plein écran simple (pré-Lion).

win.fullScreen

Propriété de type boolean déterminant si la fenêtre est en mode plein écran.

win.focusable Windows macOS

Propriété de type boolean déterminant si cette fenêtre peut prendre le focus.

win.visibleOnAllWorkspaces macOS Linux

Propriété de type boolean déterminant si la fenêtre est visible sur tous les espaces de travail.

Note: Renvoie toujours false sur Windows.

win.shadow

Propriété de type boolean déterminant si la fenêtre est ombrée.

win.menuBarVisible Windows Linux

Propriété de type boolean déterminant si la barre de menu doit être visible.

Note: Si la barre de menu est masquée automatiquement, les utilisateurs peuvent toujours afficher la barre de menu en appuyant seulement sur la touche Alt.

win.kiosk

Propriété de type boolean déterminant si la fenêtre est en mode kiosque.

win.documentEdited macOS

Propriété de type boolean indiquant si le document de la fenêtre a été modifié.

Lorsque sa valeur est à true l'icône dans la barre de titre devient grisée.

win.representedFilename macOS

Propriété de type string qui détermine le chemin d'accès du fichier que la fenêtre représente, l'icône du fichier s'affichera dans la barre de titre de la fenêtre.

win.title

Propriété de type string déterminant le titre de la fenêtre native.

Note: : Le titre de la page web peut être différent du titre de la fenêtre native.

win.minimizable macOS Windows

Propriété de type boolean déterminant si la fenêtre peut être minimisée manuellement par l'utilisateur.

Sur Linux, le setter est un no-op, bien que le getter retourne true.

win.maximizable macOS Windows

Propriété de type boolean déterminant si la fenêtre peut être agrandie manuellement par l'utilisateur.

Sur Linux, le setter est un no-op, bien que le getter retourne true.

win.fullScreenable

Propriété de type boolean déterminant si le bouton maximiser/zoom de la fenêtre active le mode plein écran ou maximise la fenêtre.

win.resizable

Propriété de type boolean déterminant si la fenêtre peut être redimensionnée manuellement par l'utilisateur.

win.closable macOS Windows

Propriété de type boolean déterminant si la fenêtre peut être fermée manuellement par l'utilisateur.

Sur Linux, le setter est un no-op, bien que le getter retourne true.

win.movable macOS Windows

Propriété de type boolean déterminant si la fenêtre peut être déplacée par l'utilisateur.

Sur Linux, le setter est un no-op, bien que le getter retourne true.

win.excludedFromShownWindowsMenu macOS

Propriété de type boolean déterminant si la fenêtre est exclue du menu Windows de l'application. false par défaut.

const win = new BrowserWindow({ height: 600, width: 600 })

const template = [
{
role: 'windowmenu'
}
]

gagne. xcludedFromShownWindowsMenu = true

const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)

win.accessibleTitle

Propriété de type string définissant un titre alternatif fourni uniquement aux outils d'accessibilité tels que les lecteurs d'écran. Cette chaîne n'est pas directement visible par les utilisateurs.

Méthodes d’instance

Les objets créés avec new BrowserWindow disposent des méthodes d'instance suivantes :

Note : Certaines méthodes ne sont seulement disponibles que sur des systèmes d'exploitation spécifiques et sont étiquetés comme tels.

win.destroy()

Force la fermeture de la fenêtre, les événement unload et beforeunload ne seront pas émis pour la page web ainsi que l'évènement close qui ne sera pas non plus émis pour cette fenêtre, mais l'événement closed est garantit d'être émis.

win.close()

Essaye de fermer la fenêtre. Ceci a le même effet qu'un utilisateur cliquant manuellement sur le bouton de fermeture de la fenêtre. La page Web, elle, peut cependant annuler la fermeture. Voir l'événement close event.

win.focus()

Ramène la fenêtre au premier plan.

win.blur()

Retire le focus de la fenêtre.

win.isFocused()

Retourne un boolean qui indique si la fenêtre a le focus.

win.isDestroyed()

Retourne un boolean qui indique si la fenêtre est détruite.

win.show()

Affiche la fenêtre et la ramène au premier plan.

win.showInactive()

Affiche la fenêtre, sans la ramener au premier plan.

win.hide()

Masque la fenêtre.

win.isVisible()

Retourne un boolean qui indique si la fenêtre est visible par l'utilisateur au premier plan de l'application.

win.isModal()

Retourne boolean - Indique si la fenêtre actuelle est une fenêtre modale ou non.

win.maximize()

Maximise la fenêtre. Cela affichera également la fenêtre (mais sans lui donner le focus) si elle n'est pas déjà affichée.

win.unmaximize()

Réduit la fenêtre à sa taille initiale.

win.isMaximized()

Retourne boolean - Indique si la taille de la fenêtre est maximisée ou non.

win.minimize()

Minimise la fenêtre Sur certaines plates-formes, la fenêtre réduite sera affichée dans le Dock.

win.restore()

Restaure la fenêtre depuis l'état réduit à son état précédent.

win.isMinimized()

Retourne boolean - Indique si la fenêtre est minimisée.

win.setFullScreen(flag)

  • flag boolean

Définit si la fenêtre doit être en mode plein écran.

Remarque : Sur macOS, les transitions vers le plein écran se déroulent de manière asynchrone. If further actions depend on the fullscreen state, use the 'enter-full-screen' or 'leave-full-screen' events.

win.isFullScreen()

Retourne boolean - Indique si la fenêtre est en plein écran ou non.

Remarque : Sur macOS, les transitions vers le plein écran se déroulent de manière asynchrone. Lorsque vous demandez le statut plein écran d'une BrowserWindow, vous devez vous assurer que les événements 'enter-full-screen' ou 'leave-full-screen' ont été émis.

win.setSimpleFullScreen(flag) macOS

  • flag boolean

Entre ou sort du mode plein-écran simple.

Le mode plein-écran simple émule le comportement en plein-écran natif trouvé sur les versions de Mac OS X antérieures à Lion (10.7).

win.isSimpleFullScreen() macOS

Retourne boolean - Indique si la fenêtre est en mode plein-écran simple (pré-Lion) ou non.

win.isNormal()

Retourne boolean - Indique si la fenêtre est dans son état normal (ni maximisée, ni minimisée, ni en plein écran).

win.setAspectRatio(aspectRatio[, extraSize])

  • aspectRatio Float - L'aspect ratio à maintenir pour une partie de la vue de contenu .
  • extraSize Size (optional) macOS - The extra size not to be included while maintaining the aspect ratio.

Fera que la fenêtre maintiendra un certain rapport hauteur/largeur. La taille supplémentaire permet à un développeur d'avoir de l'espace, spécifié en pixels, non inclus dans les calculs de ratio de l'aspect. Cette API prend déjà en compte la différence entre la taille d'une fenêtre et la taille de son contenu.

Considérons une fenêtre normale avec un lecteur vidéo HD et des commandes associées. Il y a peut-être 15 pixels de contrôles sur le bord gauche, 25 pixels de contrôles sur le bord droit et 50 pixels de contrôles sous le lecteur. In order to maintain a 16:9 aspect ratio (standard aspect ratio for HD @1920x1080) within the player itself we would call this function with arguments of 16/9 and { width: 40, height: 50 }. Le deuxième argument n'a pas d'importance tant que les largeur et hauteur supplémentaires restent dans les limites de la vue du contenu. On ajoutera toute largeur supplémentaire et les zones de hauteur que vous avez dans la vue de contenu globale.

Le ratio hauteur/largeur n'est pas respecté lorsque la fenêtre est redimensionnée par programme avec des APIs comme win.setSize.

Pour réinitialiser un rapport d'aspect, passez 0 comme valeur d'aspectRatio à : win.setAspectRatio(0).

win.setBackgroundColor(backgroundColor)

  • backgroundColor string - Couleur en Hex, RGB, ARGB, HSL, HSLA ou une couleur CSS nommée. Le canal alpha est facultatif pour le type hexadécimal.

Exemples de valeurs valides pour backgroundColor :

  • Hex
    • #fff (RVB raccourci)
    • #ffff (ARGB raccourci )
    • #ffffff (RGB)
    • #ffffffff (ARGB)
  • RGB
    • rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)
      • e.g. rgb(255, 255, 255)
  • RGBA
    • rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)
      • e.g. rgba(255, 255, 255, 1.0)
  • HSL
    • hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)
      • e.g. hsl(200, 20%, 50%)
  • HSLA
    • hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)
      • e.g. hsla(200, 20%, 50%, 0.5)
  • Couleur nommée
    • Les options sont listées dans SkParseColor.cpp
    • Similaire aux mots-clés de CSS Color Module Level 3, mais sensible à la casse.
      • e.g. blueviolet or red

Définit la couleur de l'arrière-plan de la fenêtre. Voir Configuration de backgroundColor.

win.previewFile(path[, displayName]) macOS

  • path string - Le chemin absolu vers le fichier à prévisualiser avec QuickLook. Ceci est important car Quick Look utilise le nom de fichier et l'extension de fichier sur le chemin pour déterminer le type de contenu du fichier à ouvrir.
  • displayName string (facultatif) - Le nom du fichier à afficher dans la vue modale de Quick Look . Ceci est purement visuel et n'affecte pas le type de contenu du fichier. Par défaut, chemin.

Utilise Quick Look pour prévisualiser un fichier avec un chemin donné.

win.closeFilePreview() macOS

Ferme le panneau Quick Look actuellement ouvert.

win.setBounds(bounds[, animate])

  • bounds Partial<Rectangle>
  • animate boolean (facultatif) macOS

Redimensionne et déplace la fenêtre vers les limites fournies. Toutes les propriétés qui ne sont pas fournies seront par défaut à leurs valeurs actuelles.

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

// définit toutes les propriétés limites
gagner. etBounds({ x: 440, y: 225, width: 800, height: 600 })

// a fixé une propriété de simples limites
gagner. etBounds({ width: 100 })

// { x: 440, y: 225, width: 100, height: 600 }
console.log(win.getBounds())

Note: On macOS, the y-coordinate value cannot be smaller than the Tray height. La hauteur du tray a changé au fil du temps et dépend du système d'exploitation, mais elle est comprise entre 20 et 40 px. Passer une valeur inférieure à la hauteur du tray résultera en une fenêtre supprimée du tray.

win.getBounds()

Returns Rectangle - The bounds of the window as Object.

Note: On macOS, the y-coordinate value returned will be at minimum the Tray height. Par exemple, appeler win.setBounds({ x: 25, y: 20, width: 800, height: 600 }) avec une hauteur de tray de 38 signifie que win.getBounds() retournera { x: 25, y: 38, width: 800, height: 600 }.

win.getBackgroundColor()

Retourne string - Indique la couleur d'arrière-plan de la fenêtre au format hexadécimal (#RRGGBB).

Voir Configuration de backgroundColor.

Note: La valeur du canal alpha _n'est pas _ retournée en même temps que les valeurs rouge, vert et bleu.

win.setContentBounds(bounds[, animate])

  • bounds Rectangle
  • animate boolean (facultatif) macOS

Redimensionne et déplace la zone client de la fenêtre (par exemple la page web) vers les limites fournies.

win.getContentBounds()

Returns Rectangle - The bounds of the window's client area as Object.

win.getNormalBounds()

Returns Rectangle - Contains the window bounds of the normal state

Remarque : quel que soit l'état actuel de la fenêtre : maximisé, minimisé ou en plein écran, retourne toujours la position et la taille de la fenêtre en état normal. In normal state, getBounds and getNormalBounds returns the same Rectangle.

win.setEnabled(enable)

  • enable boolean

Active ou désactive la fenêtre.

win.isEnabled()

Retourne boolean - Indique si la fenêtre est activée.

win.setSize(width, height[, animate])

  • width Integer
  • height Integer
  • animate boolean (facultatif) macOS

Redimensionne la fenêtre à width x height. Si la largeur width ou la hauteur height sont inférieures aux minima définis, la fenêtre se limitera à sa taille minimale.

win.getSize()

Retourne Integer[] - Contient la largeur et la hauteur de la fenêtre.

win.setContentSize(width, height[, animate])

  • width Integer
  • height Integer
  • animate boolean (facultatif) macOS

Redimensionne la zone client de la fenêtre (par exemple la page web) à largeur et hauteur.

win.getContentSize()

Retourne Integer[] - Tableau contenant la largeur et la hauteur de la zone client de la fenêtre.

win.setMinimumSize(width, height)

  • width Integer
  • height Integer

Définit la taille minimale de la fenêtre à width et height.

win.getMinimumSize()

Retourne Integer[] - Contient la largeur et la hauteur minimale de la fenêtre.

win.setMaximumSize(width, height)

  • width Integer
  • height Integer

Définit la taille maximale de la fenêtre à width et height.

win.getMaximumSize()

Retourne Integer[] - Contient la largeur et la hauteur maximale de la fenêtre.

win.setResizable(resizable)

  • resizable boolean

Définit si la fenêtre peut être redimensionnée ou pas par l’utilisateur.

win.isResizable()

Retourne boolean - Indique si la fenêtre peut être redimensionnée manuellement par l'utilisateur.

win.setMovable(movable) macOS Windows

  • movable boolean

Définit si la fenêtre peut être déplacée par l’utilisateur. N'a aucun effet sous Linux.

win.isMovable() macOS Windows

Retourne boolean - Indique si la fenêtre peut être déplacée par l'utilisateur.

Sous Linux, retourne toujours true.

win.setMinimizable(minimizable) macOS Windows

  • minimizable boolean

Définit si la fenêtre peut être minimisée par l’utilisateur. N'a aucun effet sous Linux.

win.isMinimizable() macOS Windows

Retourne boolean - Indique si la fenêtre peut être minimisée par l'utilisateur.

Sous Linux, retourne toujours true.

win.setMaximizable(maximizable) macOS Windows

  • maximizable boolean

Définit si la fenêtre peut être maximalisée par l’utilisateur. N'a aucun effet sous Linux.

win.isMaximizable() macOS Windows

Retourne boolean - Indique si la fenêtre peut être maximalisée manuellement par l'utilisateur.

Sous Linux, retourne toujours true.

win.setFullScreenable(fullscreenable)

  • fullscreenable boolean

Définit si le bouton agrandir/zoom de la fenêtre active/désactive le mode plein écran ou agrandit la fenêtre.

win.isFullScreenable()

Retourne boolean - Indique si le bouton agrandir/zoom de la fenêtre fait basculer en mode plein écran ou agrandit la fenêtre.

win.setClosable(closable) macOS Windows

  • closable boolean

Définit si la fenêtre peut être fermée manuellement par l'utilisateur. N'a aucun effet sous Linux.

win.isClosable() macOS Windows

Retourne boolean - Indique si la fenêtre peut être fermée manuellement par l'utilisateur.

Sous Linux, retourne toujours true.

win.setHiddenInMissionControl(hidden) macOS

  • hidden boolean

Définit si la fenêtre sera masquée lorsque l'utilisateur uitilise Mission Control.

win.isHiddenInMissionControl() macOS

Retourne boolean - Indique si la fenêtre sera masquée lorsque l'utilisateur utilise Mission Control.

win.setAlwaysOnTop(flag[, level][, relativeLevel])

  • flag boolean
  • level string (facultatif) macOS Windows - Les valeurs possibles sont normal, floating, torn-off-menu, modal-panel, main-menu, status, pop-up-menu, screen-saver, et ~dock~~ (déprécié). La valeur par défaut est floating lorsque flag est vrai. Le niveau est réinitialisé à normal lorsque le drapeau est faux. Notez que de flottant à statut inclus, la fenêtre est placée sous le Dock sur macOS et sous la barre des tâches sous Windows. De pop-up-menu à une valeur supérieure, il est affiché au-dessus du Dock sur macOS et au-dessus de la barre des tâches sur Windows. Voir la documentation macOS pour plus de détails.
  • relativeLevel Integer (facultatif) macOS - Le nombre de calques supérieurs à définir pour cette fenêtre par rapport au level donné. Par défaut, 0. Notez qu'Apple décourage les réglages de niveau supérieur à 1 au-dessus de screen-saver.

Définit si la fenêtre doit toujours s'afficher au-dessus des autres fenêtres. Après être définie comme telle, la fenêtre est toujours une fenêtre normale et non pas une fenêtre d'outils ne pouvant pas prendre le focus.

win.isAlwaysOnTop()

Retourne boolean - Indique si la fenêtre est toujours au-dessus des autres fenêtres ou pas.

win.moveAbove(mediaSourceId)

  • mediaSourceId string - Id de la fenêtre au format de l'id DesktopCapturerSource. Par exemple "window:1869:0".

Déplace la fenêtre au-dessus de la fenêtre source dans l'ordre du z-order. Si le mediaSourceId n'est pas du type window ou si la fenêtre n'existe pas, alors cette méthode lance une erreur.

win.moveTop()

Déplace la fenêtre sur le dessus (dans l'ordre z) peu importe qu'elle ait le focus ou non

win.center()

Déplace la fenêtre vers le centre de l’écran.

win.setPosition(x, y[, animate])

  • x Integer
  • y Integer
  • animate boolean (facultatif) macOS

Déplace la fenêtre à la position x et y.

win.getPosition()

Retourne Integer[] - Contient la position actuelle de la fenêtre.

win.setTitle(title)

  • title string

Remplace le titre de la fenêtre native par title.

win.getTitle()

Retourne string - Titre de la fenêtre native.

Note: : Le titre de la page web peut être différent du titre de la fenêtre native.

win.setSheetOffset(offsetY[, offsetX]) macOS

  • offsetY Float
  • offsetX Float (facultatif)

Modifie le point d'attachement des feuilles sur macOS. Par défaut, les feuilles sont attachées juste sous le cadre de la fenêtre, mais vous pouvez les afficher sous une barre d'outils affichée. Par exemple :

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

const toolbarRect = document.getElementById('toolbar').getBoundingClientRect()
win.setSheetOffset(toolbarRect.height)

win.flashFrame(flag)

History
  • flag boolean

Démarre ou arrête de faire clignoter la fenêtre pour attirer l'attention de l'utilisateur.

win.setSkipTaskbar(skip) macOS Windows

  • skip boolean

Fait que la fenêtre ne soit pas affichée dans la barre des tâches.

win.setKiosk(flag)

  • flag boolean

Entre ou sort du mode kiosque.

win.isKiosk()

Retourne boolean - Indique si la fenêtre est en mode kiosque.

win.isTabletMode() Windows

Retourne boolean - Indique si la fenêtre est en mode Windows 10 tablet.

Etat donné que les utilisateurs de Windows 10 peuvent utiliser leur PC comme une tablette, dans ce mode, les applications peuvent choisir d'optimiser leur interface utilisateur pour les tablettes, par exemple en élargissant la barre de titre et en masquant les boutons de la barre de titre.

Le retour de cette API indique si la fenêtre est en mode tablette, et l'événement resize pourra dans ce cas être utilisé pour écouter les changements en mode tablette.

win.getMediaSourceId()

Retourne string - Id de fenêtre au format des id de DesktopCapturerSource. Par exemple "window:1324:0".

Plus précisément, le format est window:id:other_idid correspond au HWND sur Windows, et au CGWindowID (uint64_t) sur macOS et Window (unsigned long) sur Linux. other_id est utilisé pour identifier le contenu web (onglets) donc dans la même fenêtre de niveau supérieur.

win.getNativeWindowHandle()

Retourne Buffer - Le handle spécifique à la plate-forme de la fenêtre.

Le type natif du handle est HWND sous Windows, NSView* sur macOS, et Window (unsigned long) sous Linux.

win.hookWindowMessage(message, callback) Windows

  • message Integer
  • callback Function
    • wParam any - Le wParam qui a été fourni au WndProc
    • lParam any - Le lParam qui a été fourni au WndProc

Accroche un message de fenêtre. La callback est appelée lorsque le message est reçu dans le WndProc.

win.isWindowMessageHooked(message) Windows

  • message Integer

Retourne boolean - true ou false selon que le message est connecté.

win.unhookWindowMessage(message) Windows

  • message Integer

Décroche le message de fenêtre.

win.unhookAllWindowMessages() Windows

Décroche tous les messages de fenêtre.

win.setRepresentedFilename(filename) macOS

  • filename string

Définit le chemin d'accès du fichier que la fenêtre représente, et l'icône du fichier s'affichera dans la barre de titre de la fenêtre.

win.getRepresentedFilename() macOS

Retourne string - Le chemin du fichier que la fenêtre représente.

win.setDocumentEdited(edited) macOS

  • edited boolean

Spécifie si le document de la fenêtre a été modifié, et l'icône de la barre de titre deviendra grisé lorsque la valeur est à true.

win.isDocumentEdited() macOS

Retourne boolean - Indique si le document de la fenêtre a été modifié.

win.focusOnWebView()

win.blurWebView()

win.capturePage([rect, opts])

  • rect Rectangle (optional) - The bounds to capture
  • opts Object (facultatif)
    • stayHidden boolean (facultatif) - Maintient la page cachée au lieu de visible. Par défaut la valeur est false.
    • stayAwake boolean (facultatif) - Maintient le système hors veille. Par défaut la valeur est false.

Returns Promise<NativeImage> - Resolves with a NativeImage

Capture un instantané de la zone de la page définie par rect. Une capture de la page entière sera réalisée en l'absence de rect. Si la page n'est pas visible, rect peut être vide. La page est considérée visible lorsque sa BrowserWindow est cachée et que le nombre de captations n'est pas nul. Si vous souhaitez que la page reste cachée, vous devez vous assurer que stayHidden soit bien défini à true.

win.loadURL(url[, options])

  • url string
  • options Object (facultatif)
    • httpReferrer (string | Referrer) (optional) - An HTTP Referrer URL.
    • userAgent string (optionnel) - L'agent utilisateur à l'origine de la requête.
    • extraHeaders string (optionnel) - Headers supplémentaires séparés par "\n"
    • postData (UploadRawData | UploadFile)[] (optional)
    • baseURLForDataURL string (facultatif) - URL de base (avec séparateur de chemin de pointe) pour que les fichiers soient chargés par l'URL de données. Ceci n'est nécessaire que si l'url spécifiée est une URL de données et a besoin de charger d'autres fichiers.

Returns Promise<void> - the promise will resolve when the page has finished loading (see did-finish-load), and rejects if the page fails to load (see did-fail-load).

Same as webContents.loadURL(url[, options]).

L'url peut être une adresse distante (par exemple http://) ou un chemin vers un fichier HTML local en utilisant le protocole file://.

Pour s'assurer que les URL de fichier sont correctement formatées, il est recommandé d'utiliser la méthode url.format de Node. :

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

const url = require('url').format({
protocol: 'file',
slashes: true,
pathname: require('node:path').join(__dirname, 'index.html')
})

win.loadURL(url)

Vous pouvez charger une URL en utilisant une requête POST avec des données encodées par URL en faisant ce qui suit :

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

win.loadURL('http://localhost:8000/post', {
postData: [{
type: 'rawData',
bytes: Buffer.from('hello=world')
}],
extraHeaders: 'Content-Type: application/x-www-form-urlencoded'
})

win.loadFile(filePath[, options])

  • filePath string
  • options Object (facultatif)
    • query Record<string, string> (optional) - Passed to url.format().
    • search string (facultatif) - Passé à url.format().
    • hash string (facultatif) - Passé à url.format().

Returns Promise<void> - the promise will resolve when the page has finished loading (see did-finish-load), and rejects if the page fails to load (see did-fail-load).

Comme pour webContents.loadFile, filePath doit être un chemin relatif à la racine de votre application et pointant vers un fichier HTML. Voir la documentation de webContents pour plus d'informations.

win.reload()

Identique à webContents.reload.

win.setMenu(menu) Linux Windows

  • menu Menu | null

Définit menu comme barre de menu de la fenêtre.

win.removeMenu() Linux Windows

Retire la barre de menu de la fenêtre.

win.setProgressBar(progress[, options])

  • progress Double
  • options Object (facultatif)
    • mode string Windows - Mode pour la barre de progression. Peut prendre une des valeurs suivantes: none, normal, indeterminate, error ou paused.

Définit la valeur de progression dans la barre de progression. La plage valide est [0, 1.0].

Supprime la barre de progression lorsque progress est < 0 ; Et Passe en mode indéterminé lorsque progress > 1.

Sur la plate-forme Linux, ne prend en charge que l'environnement de bureau Unity, vous devez spécifier le nom du fichier *.desktop pour le champ desktopName de package.json. Par défaut, {app.name}.desktop sera assumé.

Sous Windows, un mode peut être fournit. Les valeurs acceptées étant none, normal, indeterminate, error, et paused. Si vous appelez setProgressBar sans avoir défini de mode (mais avec une valeur dans la plage valide), normal sera utilisé.

win.setOverlayIcon(overlay, description) Windows

  • overlay NativeImage | null - the icon to display on the bottom right corner of the taskbar icon. Si ce paramètre est null, l'overlay est effacé
  • description chaîne - une description qui sera fournie aux lecteurs d'écran d'accessibilité

Définit un overlay de 16 x 16 pixels sur l'icône actuelle de la barre des tâches, ceci est généralement utilisé pour transmettre une sorte de statut d'application ou pour notifier passivement l'utilisateur.

win.invalidateShadow() macOS

Invalide l’ombre de fenêtre afin qu’elle soit recalculée en fonction de la forme de fenêtre actuelle.

Les BrowserWindows transparentes peuvent parfois laisser des artefacts visuels sur macOS. Cette méthode peut être utilisée pour effacer ces artefacts lorsque, par exemple, une animation est réalisée.

win.setHasShadow(hasShadow)

  • hasShadow boolean

Définit si la fenêtre doit être ombrée ou non.

win.hasShadow()

Retourne boolean - Indique si la fenêtre est ombrée.

win.setOpacity(opacity) Windows macOS

  • opacité nombre - entre 0.0 (entièrement transparent) et 1.0 (entièrement opaque)

Définit l'opacité de la fenêtre. N'a aucun effet sous Linux. Les valeurs hors de limite sont restreintes dans la plage [0, 1].

win.getOpacity()

Retourne number - entre 0.0 (entièrement transparent) et 1.0 (entièrement opaque). Sur Linux, renvoie toujours 1.

win.setShape(rects) Windows Linux Experimental

  • rects Rectangle[] - Sets a shape on the window. Le passage d'une liste vide fait revenir la fenêtre à la forme rectangulaire.

Définir une forme de fenêtre détermine la zone dans la fenêtre où le système permet de dessiner et d'interagir avec l'utilisateur. En dehors de la région donnée, aucun pixel ne sera dessiné et aucun événement de souris ne sera enregistré. Les événements de souris en dehors de la région ne seront pas reçus par cette fenêtre, mais seront transmis à tout ce qui se trouve derrière la fenêtre.

win.setThumbarButtons(buttons) Windows

Retourne boolean - Indique si les boutons ont été ajoutés avec succès

Ajouter une barre d'outils miniature avec un ensemble de boutons spécifié à l'image de miniature d'une fenêtre dans la disposition d'un bouton de la barre des tâches. Retourne boolean - Indique si l'a miniature a été ajoutée avec succès.

Le nombre de boutons dans la barre d'outils miniature ne doit pas dépasser 7 en raison de l'espace limité disponible. Une fois que vous avez configuré la barre d'outils miniature, la barre d'outils ne peut pas être retirée en raison de limitation de la plateforme. Mais vous pouvez appeler l'API avec un tableau vide pour supprimer les boutons.

buttons est un tableau d'objets de type Button:

  • Object Button
    • icon NativeImage - The icon showing in thumbnail toolbar.
    • click Function
    • tooltip string (facultatif) - Le texte dans l'info-bulle du bouton.
    • flags string[] (facultatif) - Contrôle les états et comportements spécifiques du bouton. Par défaut, il est ['activé'].

Le flags est un tableau pouvant inclure ces strings suivant :

  • enabled - Le bouton est actif et disponible à l'utilisateur.
  • désactivé - Le bouton est désactivé. Il est présent, mais a un état visuel indiquant qu'il ne répondra pas à l'action de l'utilisateur.
  • dismissonclick - Lorsque le bouton est cliqué, la fenêtre de miniature se ferme immédiatement.
  • nobackground - Utilise uniquement l'image et ne dessine pas de bordure sur le bouton.
  • hidden - Le bouton n'est pas affiché à l'utilisateur.
  • non interactif - Le bouton est activé mais non interactif ; aucun état de bouton n'est dessiné. Cette valeur est destinée aux cas où le bouton est utilisé dans une notification.

win.setThumbnailClip(region) Windows

Définit la région de la fenêtre à afficher comme image de miniature affichée lors du survol de la fenêtre dans la barre des tâches. Vous pouvez réinitialiser la miniature afin qu'elle occupe toute la fenêtre en spécifiant une région vide : { x: 0, y: 0, width: 0, height: 0 }.

win.setThumbnailToolTip(toolTip) Windows

  • toolTip string

Définit l'infobulle qui s'affiche en survolant la vignette de la fenêtre dans la barre des tâches.

win.setAppDetails(options) Windows

  • Objet options
    • appId string (facultatif) - Fenêtre App User Model ID. Elle doit être définie, sinon les autres options n'auront aucun effet.
    • appIconPath string (facultatif) - Fenêtre Icône de relance.
    • appIconIndex Integer (facultatif) - Index de l'icône dans appIconPath. Ignoré lorsque appIconPath n'est pas défini. La valeur par défaut est 0.
    • relaunchCommand string (facultatif) - La Relaunch Commandde Windows.
    • relaunchDisplayName string (facultatif) - Window's Relaunch Display Name.

Définit les propriétés du bouton de la barre des tâches de la fenêtre.

Note: relaunchCommand et relaunchDisplayName doivent toujours être définies ensemble. Si l'une de ces propriétés n'est pas définie, aucune d'elles ne sera utilisable.

win.showDefinitionForSelection() macOS

Identique à webContents.showDefinitionForSelection().

win.setIcon(icon) Windows Linux

Change l'icône de la fenêtre.

win.setWindowButtonVisibility(visible) macOS

  • visible boolean

Définit si les boutons feux de circulation de la fenêtre doivent être visibles.

win.setAutoHideMenuBar(hide) Windows Linux

  • hide boolean

Définit si la barre de menus de la fenêtre doit se cacher automatiquement. Une fois définie, la barre de menu ne s'affichera que lorsque les utilisateurs appuient sur la seule touche Alt.

Si la barre de menu est déjà visible, l'appel à setAutoHideMenuBar(true) ne la cachera pas immédiatement.

win.isMenuBarAutoHide() Windows Linux

Retourne boolean - Indique si la barre de menu se cache automatiquement.

win.setMenuBarVisibility(visible) Windows Linux

  • visible boolean

Définit si la barre de menu doit être visible. Si la barre de menu est definie comme auto-hide, les utilisateurs peuvent toujours afficher la barre de menu en appuyant sur la seule touche Alt.

win.isMenuBarVisible() Windows Linux

Retourne boolean - Indique si la barre de menu est visible.

win.setVisibleOnAllWorkspaces(visible[, options]) macOS Linux

  • visible boolean
  • options Object (facultatif)
    • visibleOnFullScreen booléen (facultatif) macOS - Définit si la fenêtre doit être visible au-dessus des fenêtres plein écran.
    • skipTransformProcessType booléen (facultatif) macOS - Par défaut, l'appel à setVisibleOnAllWorkspaces change le type UIElementApplication du processus pour ForegroundApplication afin d''avoir le comportement adéquat. Cependant, cela masquera la fenêtre et le dock pendant une courte période à chaque appel de la fonction. Si votre fenêtre est déjà de type UIElementApplication, vous pouvez contourner cette transformation en définissant skipTransformProcessType à true.

Définit si la fenêtre doit être visible sur tous les espaces de travail.

Note: Cette API ne fonctionne pas sous Windows.

win.isVisibleOnAllWorkspaces() macOS Linux

Retourne boolean - Indique si la fenêtre est visible sur tous les espaces de travail.

**Remarque **: Cette API retourne toujours false sur Windows.

win.setIgnoreMouseEvents(ignore[, options])

  • ignore boolean
  • options Object (facultatif)
    • Avancer boolean (facultatif) macOS Windows - Si vrai, transférez la souris messages vers Chromium, en activant les événements liés à la souris tels que souris. Utilisé uniquement lorsque ignore est vrai. Si ignore est faux, le transfert est toujours désactivé quelle que soit cette valeur.

Fait que la fenêtre ignore tous les événements de la souris.

Tous les événements survenus dans cette fenêtre seront transmis à la fenêtre sous cette fenêtre, mais si cette fenêtre a le focus, elle recevra toujours les événements du clavier .

win.setContentProtection(enable) macOS Windows

  • enable boolean

Empêche le contenu de la fenêtre d'être capturé par d'autres applications.

Sous macOS, cela attribue la valeurNSWindowSharingNone au type de partage de NSWindows . Sous Windows, effectue l'appel à SetWindowDisplayAffinity avec WDA_EXCLUDEFROMCAPTURE. Pour Windows 10 version 2004 et supérieures, la fenêtre sera complètement exclue de la capture, les anciennes versions de Windows se comportent comme si WDA_MONITOR était appliqué, capturant une fenêtre noire.

win.setFocusable(focusable) macOS Windows

  • focusable boolean

Fait que la fenêtre peut prendre ou non le focus.

Sur macOS, ne supprime pas le focus de la fenêtre.

win.isFocusable() macOS Windows

Retourne boolean - Indique si la fenêtre peut prendre le focus.

win.setParentWindow(parent)

  • parent BrowserWindow | null

Définit parent comme la fenêtre parent de la fenêtre actuelle, le passage de null transformera la fenêtre actuelle en une fenêtre de niveau supérieur.

win.getParentWindow()

Retourne BrowserWindow | null - La fenêtre parente ou null s'il n'y a pas de parent.

win.getChildWindows()

Retourne BrowserWindow[] - Toutes les fenêtres enfants.

win.setAutoHideCursor(autoHide) macOS

  • autoHide boolean

Contrôle s'il faut masquer le curseur lors de la saisie.

win.selectPreviousTab() macOS

Sélectionne l'onglet précédent lorsque les onglets natifs sont activés et qu'il y a d'autres onglets dans la fenêtre.

win.selectNextTab() macOS

Sélectionne l'onglet suivant lorsque les onglets natifs sont activés et qu'il y a d'autres onglets dans la fenêtre.

win.showAllTabs() macOS

Affiche ou masque la vue d’ensemble des onglets natifs lorsque ceux-ci sont activés.

win.mergeAllWindows() macOS

Fusionne toutes les fenêtres en une seule fenêtre avec plusieurs onglets lorsque les onglets natifs sont activés et qu'il y a plus d'une fenêtre ouverte.

win.moveTabToNewWindow() macOS

Déplace l'onglet actuel dans une nouvelle fenêtre si les onglets natifs sont activés et qu'il y a plus d'un onglet dans la fenêtre actuelle.

win.toggleTabBar() macOS

Active/désactive la visibilité de la barre d’onglets si les onglets natifs sont activés et qu'il n’y a qu’un seul onglet dans la fenêtre actuelle.

win.addTabbedWindow(browserWindow) macOS

  • browserWindow BrowserWindow

Ajoute une fenêtre sous la forme d'un onglet après l'onglet de l'instance de fenêtre.

win.setVibrancy(type) macOS

  • type string | null - Les valeurs possibles sont titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, ou under-page. Voir la documentation macOS pour plus de détails.

Ajoute un effet de vibration à la fenêtre du navigateur. Le passage en paramètre de null ou d'une chaîne vide supprimera l’effet de vibration sur la fenêtre.

win.setBackgroundMaterial(material) Windows

  • material string
    • auto - Indique que le Gestionnaire de fenêtres de bureau (DWM) décidera automatiquement de la toile de fond tracée par le système pour cette fenêtre. C'est le comportement par défaut.
    • none - Ne pas dessiner d'arrière-plan système.
    • mica - Dessine l’arrière-plan correspondant à une fenêtre de longue durée.
    • acrylic - Dessine l'effet de matériau d'arrière-plan correspondant à une fenêtre transitoire.
    • tabbed - Dessine l'arrière-plan correspondant à une fenêtre avec barre de titre à onglets.

Cette méthode définit l'arrière-plan de la fenêtre du navigateur, y compris derrière la zone non-client.

Consultez la documentation de Windows pour plus de détails.

Remarque : Cette méthode n'est prise en charge qu'à partir de Windows 11 22H2.

win.setWindowButtonPosition(position) macOS

Définit une position personnalisée pour les boutons de feux de signalisation dans une fenêtre sans cadre. Le passage de null réinitialisera la position par défaut.

win.getWindowButtonPosition() macOS

Retourne Point | null - La position personnalisée pour les boutons de feux de circulation dans la fenêtre sans cadres, null sera retournée lorsqu'il n'y a pas de position personnalisée.

win.setTouchBar(touchBar) macOS

  • touchBar TouchBar | null

Définit la disposition de la touchBar pour la fenêtre actuelle. La spécification de null ou d' undefined efface la barre tactile. Cette méthode n'a d'effet que si la machine a une touch bar.

Remarque : L’API TouchBar est actuellement expérimentale et peut changer ou être supprimée dans les futures mises à jour d'Electron.

win.setBrowserView(browserView) Experimental Deprecated

  • browserView BrowserView | null - Attach browserView to win. Si d'autres BrowserView sont déjà attachées, elles seront supprimées de cette fenêtre.

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

win.getBrowserView() Experimental Deprecated

Retourne BrowserView | null - La BrowserView attachée à win. Retourne null si aucune n'est attachée. Déclenche une erreur si plusieurs BrowserView sont attachées.

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

win.addBrowserView(browserView) Experimental Deprecated

API de remplacement pour setBrowserView prenant en charge le travail avec plusieurs BrowserView.

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

win.removeBrowserView(browserView) Experimental Deprecated

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

win.setTopBrowserView(browserView) Experimental Deprecated

Hisse la browserView au-dessus des autres BrowserViews attachées à win. Une erreur est lancée si browserView n'est pas attaché à win.

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

win.getBrowserViews() Expérimental Déprécié

Retourne un BrowserView[] - tableau de toutes les BrowserViews trié par leur z-index et qui ont été attachées à l'aide de addBrowserView ou de setBrowserView. La BrowserView du dessus étant le dernier élément du tableau.

Note The BrowserView class is deprecated, and replaced by the new WebContentsView class.

win.setTitleBarOverlay(options) Windows Linux

  • Objet options
    • color String (optional) - The CSS color of the Window Controls Overlay when enabled.
    • symbolColor String (optional) - The CSS color of the symbols on the Window Controls Overlay when enabled.
    • height Integer (optional) - The height of the title bar and Window Controls Overlay in pixels.

On a window with Window Controls Overlay already enabled, this method updates the style of the title bar overlay.

On Linux, the symbolColor is automatically calculated to have minimum accessible contrast to the color if not explicitly set.