BaseWindow

Create and control windows.

Process: Main

Note BaseWindow provides a flexible way to compose multiple web views in a single window. For windows with only a single, full-size web view, the BrowserWindow class may be a simpler option.

This module cannot be used until the ready event of the app module is emitted.

// In the main process.
const { BaseWindow, WebContentsView } = require('electron')

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

const leftView = new WebContentsView()
leftView.webContents.loadURL('https://electronjs.org')
win.contentView.addChildView(leftView)

const rightView = new WebContentsView()
rightView.webContents.loadURL('https://github.com/electron/electron')
win.contentView.addChildView(rightView)

leftView.setBounds({ x: 0, y: 0, width: 400, height: 600 })
rightView.setBounds({ x: 400, y: 0, width: 400, height: 600 })

父子窗口

By using parent option, you can create child windows:

const { BaseWindow } = require('electron')

const parent = new BaseWindow()
const child = new BaseWindow({ parent })

The child window will always show on top of the parent window.

模态窗口

A modal window is a child window that disables parent window. To create a modal window, you have to set both the parent and modal options:

const { BaseWindow } = require('electron')

const parent = new BaseWindow()
const child = new BaseWindow({ parent, modal: true })

平台相关的提示

在 macOS 上，modal 窗口将显示为附加到父窗口的工作表。
On macOS the child windows will keep the relative position to parent window when parent window moves, while on Windows and Linux child windows will not move.
On Linux the type of modal windows will be changed to dialog.
在Linux上，许多桌面环境不支持隐藏模态窗口。

Class: BaseWindow

Create and control windows.

Process: Main

BaseWindow is an EventEmitter.

It creates a new BaseWindow with native properties as set by the options.

`new BaseWindow([options])`

options BaseWindowConstructorOptions (optional)
- width Integer (optional) - Window's width in pixels. Default is 800.
- height Integer (optional) - Window's height in pixels. Default is 600.
- x Integer (optional) - (required if y is used) Window's left offset from screen. 默认值为将窗口居中。
- y Integer (optional) - (required if x is used) Window's top offset from screen. 默认值为将窗口居中。
- useContentSize boolean (optional) - The width and height would be used as web page's size, which means the actual window's size will include window frame's size and be slightly larger. Default is false.
- center boolean (optional) - Show window in the center of the screen. Default is false.
- minWidth Integer (optional) - Window's minimum width. Default is 0.
- minHeight Integer (optional) - Window's minimum height. Default is 0.
- maxWidth Integer (optional) - Window's maximum width. 默认值不限
- maxHeight Integer (optional) - Window's maximum height. 默认值不限
- resizable boolean (optional) - Whether window is resizable. Default is true.
- movable boolean (optional) macOS Windows - Whether window is movable. 在 Linux 上未实现。 Default is true.
- minimizable boolean (optional) macOS Windows - Whether window is minimizable. 在 Linux 上未实现。 Default is true.
- maximizable boolean (optional) macOS Windows - Whether window is maximizable. 在 Linux 上未实现。 Default is true.
- closable boolean (optional) macOS Windows - Whether window is closable. 在 Linux 上未实现。 Default is true.
- focusable boolean (optional) - Whether the window can be focused. Default is true. On Windows setting focusable: false also implies setting skipTaskbar: true. On Linux setting focusable: false makes the window stop interacting with wm, so the window will always stay on top in all workspaces.
- alwaysOnTop boolean (optional) - Whether the window should always stay on top of other windows. Default is false.
- fullscreen boolean (optional) - Whether the window should show in fullscreen. When explicitly set to false the fullscreen button will be hidden or disabled on macOS. Default is false.
- fullscreenable boolean (optional) - Whether the window can be put into fullscreen mode. On macOS, also whether the maximize/zoom button should toggle full screen mode or maximize window. Default is true.
- simpleFullscreen boolean (optional) macOS - Use pre-Lion fullscreen on macOS. Default is false.
- skipTaskbar boolean (optional) macOS Windows - Whether to show the window in taskbar. Default is false.
- hiddenInMissionControl boolean (optional) macOS - Whether window should be hidden when the user toggles into mission control.
- kiosk boolean (optional) - Whether the window is in kiosk mode. Default is false.
- title string (optional) - Default window title. Default is "Electron". If the HTML tag <title> is defined in the HTML file loaded by loadURL(), this property will be ignored.
- icon (NativeImage | string) (optional) - The window icon. On Windows it is recommended to use ICO icons to get best visual effects, you can also leave it undefined so the executable's icon will be used.
- show boolean (optional) - Whether window should be shown when created. Default is true.
- frame boolean (optional) - Specify false to create a frameless window. Default is true.
- parent BaseWindow (optional) - Specify parent window. Default is null.
- modal boolean (optional) - Whether this is a modal window. This only works when the window is a child window. Default is false.
- acceptFirstMouse boolean (optional) macOS - Whether clicking an inactive window will also click through to the web contents. Default is false on macOS. 此选项在其他平台上不可配置。
- disableAutoHideCursor boolean (optional) - Whether to hide cursor when typing. Default is false.
- autoHideMenuBar boolean (optional) - Auto hide the menu bar unless the Alt key is pressed. Default is false.
- enableLargerThanScreen boolean (optional) macOS - Enable the window to be resized larger than screen. Only relevant for macOS, as other OSes allow larger-than-screen windows by default. Default is false.
- backgroundColor string (optional) - The window's background color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha in #AARRGGBB format is supported if transparent is set to true. Default is #FFF (white). See win.setBackgroundColor for more information.
- hasShadow boolean (optional) - Whether window should have a shadow. Default is true.
- opacity number (optional) macOS Windows - Set the initial opacity of the window, between 0.0 (fully transparent) and 1.0 (fully opaque). This is only implemented on Windows and macOS.
- darkTheme boolean (optional) - Forces using dark theme for the window, only works on some GTK+3 desktop environments. Default is false.
- transparent boolean (optional) - Makes the window transparent. Default is false. 在Windows上，仅在无边框窗口下起作用。
- type string (optional) - The type of window, default is normal window. See more about this below.
- visualEffectState string (optional) macOS - Specify how the material appearance should reflect window activity state on macOS. Must be used with the vibrancy property. 可能的值有
  - followWindow - The backdrop should automatically appear active when the window is active, and inactive when it is not. 默认为该值。
  - active - The backdrop should always appear active.
  - inactive - The backdrop should always appear inactive.
- titleBarStyle string (optional) macOS Windows - The style of window title bar. Default is default. 可能的值有
  - default - Results in the standard title bar for macOS or Windows respectively.
  - hidden - Results in a hidden title bar and a full size content window. 在 macOS 内, 窗口将一直拥有位于左上的标准窗口控制器 (“traffic lights”)。 On Windows, when combined with titleBarOverlay: true it will activate the Window Controls Overlay (see titleBarOverlay for more information), otherwise no window controls will be shown.
  - hiddenInset macOS - Only on macOS, results in a hidden title bar with an alternative look where the traffic light buttons are slightly more inset from the window edge.
  - customButtonsOnHover macOS - Only on macOS, results in a hidden title bar and a full size content window, the traffic light buttons will display when being hovered over in the top left of the window. Note: This option is currently experimental.
- trafficLightPosition Point (optional) macOS - Set a custom position for the traffic light buttons in frameless windows.
- roundedCorners boolean (optional) macOS - Whether frameless window should have rounded corners on macOS. Default is true. Setting this property to false will prevent the window from being fullscreenable.
- thickFrame boolean (optional) - Use WS_THICKFRAME style for frameless windows on Windows, which adds standard window frame. Setting it to false will remove window shadow and window animations. Default is true.
- vibrancy string (optional) macOS - Add a type of vibrancy effect to the window, only on macOS. Can be appearance-based, titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, or under-page.
- backgroundMaterial string (optional) Windows - Set the window's system-drawn background material, including behind the non-client area. Can be auto, none, mica, acrylic or tabbed. See win.setBackgroundMaterial for more information.
- zoomToPageWidth boolean (optional) macOS - Controls the behavior on macOS when option-clicking the green stoplight button on the toolbar or by clicking the Window > Zoom menu item. If true, the window will grow to the preferred width of the web page when zoomed, false will cause it to zoom to the width of the screen. This will also affect the behavior when calling maximize() directly. Default is false.
- tabbingIdentifier string (optional) macOS - Tab group name, allows opening the window as a native tab. Windows with the same tabbing identifier will be grouped together. This also adds a native new tab button to your window's tab bar and allows your app and window to receive the new-window-for-tab event.

When setting minimum or maximum window size with minWidth/maxWidth/ minHeight/maxHeight, it only constrains the users. It won't prevent you from passing a size that does not follow size constraints to setBounds/setSize or to the constructor of BrowserWindow.

The possible values and behaviors of the type option are platform dependent. 可能的值有

On Linux, possible types are desktop, dock, toolbar, splash, notification.
- The desktop type places the window at the desktop background window level (kCGDesktopWindowLevel - 1). However, note that a desktop window will not receive focus, keyboard, or mouse events. You can still use globalShortcut to receive input sparingly.
- The dock type creates a dock-like window behavior.
- The toolbar type creates a window with a toolbar appearance.
- The splash type behaves in a specific way. It is not draggable, even if the CSS styling of the window's body contains -webkit-app-region: drag. This type is commonly used for splash screens.
- The notification type creates a window that behaves like a system notification.
On macOS, possible types are desktop, textured, panel.
- The textured type adds metal gradient appearance (NSWindowStyleMaskTexturedBackground).
- The desktop type places the window at the desktop background window level (kCGDesktopWindowLevel - 1). Note that desktop window will not receive focus, keyboard or mouse events, but you can use globalShortcut to receive input sparingly.
- The panel type enables the window to float on top of full-screened apps by adding the NSWindowStyleMaskNonactivatingPanel style mask,normally reserved for NSPanel, at runtime. Also, the window will appear on all spaces (desktops).
On Windows, possible type is toolbar.

实例事件

Objects created with new BaseWindow emit the following events:

Note: Some events are only available on specific operating systems and are labeled as such.

事件： 'close'

event Event

在窗口要关闭的时候触发。 It's emitted before the beforeunload and unload event of the DOM. Calling event.preventDefault() will cancel the close.

Usually you would want to use the beforeunload handler to decide whether the window should be closed, which will also be called when the window is reloaded. In Electron, returning any value other than undefined would cancel the close. 例如：

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.
  // It is recommended to use the dialog API to let the user confirm closing the
  // application.
  e.returnValue = false
}

Note: There is a subtle difference between the behaviors of window.onbeforeunload = handler and window.addEventListener('beforeunload', handler). It is recommended to always set the event.returnValue explicitly, instead of only returning a value, as the former works more consistently within Electron.

事件： 'closed'

在窗口关闭时触发当你接收到这个事件的时候, 你应当移除相应窗口的引用对象，避免再次使用它.

Event: 'session-end' Windows

因为强制关机或机器重启或会话注销而导致窗口会话结束时触发

事件: 'blur'

当窗口失去焦点时触发

事件: 'focus'

当窗口获得焦点时触发

事件: 'show'

当窗口显示时触发

事件: 'hide'

当窗口隐藏时触发

事件: 'maximize'

窗口最大化时触发

事件: 'unmaximize'

当窗口从最大化状态退出时触发

事件: 'minimize'

窗口最小化时触发

事件: 'restore'

当窗口从最小化状态恢复时触发

Event: 'will-resize' macOS Windows

event Event
newBounds Rectangle - Size the window is being resized to.
details Object
- edge (string) - The edge of the window being dragged for resizing. Can be bottom, left, right, top-left, top-right, bottom-left or bottom-right.

调整窗口大小前触发。 Calling event.preventDefault() will prevent the window from being resized.

请注意，该事件仅在手动调整窗口大小时触发。 Resizing the window with setBounds/setSize will not emit this event.

The possible values and behaviors of the edge option are platform dependent. 可能的值有

On Windows, possible values are bottom, top, left, right, top-left, top-right, bottom-left, bottom-right.
On macOS, possible values are bottom and right.
- The value bottom is used to denote vertical resizing.
- The value right is used to denote horizontal resizing.

事件: 'resize'

调整窗口大小后触发。

Event: 'resized' macOS Windows

当窗口完成调整大小后触发一次。

这通常在手动调整窗口大小后触发。 On macOS, resizing the window with setBounds/setSize and setting the animate parameter to true will also emit this event once resizing has finished.

Event: 'will-move' macOS Windows

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

窗口移动前触发。 On Windows, calling event.preventDefault() will prevent the window from being moved.

注意：仅当手动移动窗口时才会触发此消息。 Moving the window with setPosition/setBounds/center will not emit this event.

事件: 'move'

窗口移动到新位置时触发

Event: 'moved' macOS Windows

当窗口移动到新位置时触发一次

Note: On macOS this event is an alias of move.

事件: 'enter-full-screen'

窗口进入全屏状态时触发

事件: 'leave-full-screen'

窗口离开全屏状态时触发

事件: 'always-on-top-changed'

event Event
isAlwaysOnTop boolean

设置或取消设置窗口总是在其他窗口的顶部显示时触发。

Event: 'app-command' Windows Linux

event Event
command string

Emitted when an App Command is invoked. 典型的是键盘上的媒体键或浏览器命令, 以及在Windows上的一些鼠标中内置的“后退”按钮。

Commands are lowercased, underscores are replaced with hyphens, and the APPCOMMAND_ prefix is stripped off. e.g. APPCOMMAND_BROWSER_BACKWARD is emitted as browser-backward.

const { BaseWindow } = require('electron')
const win = new BaseWindow()
win.on('app-command', (e, cmd) => {
  // Navigate the window back when the user hits their mouse back button
  if (cmd === 'browser-backward') {
    // Find the appropriate WebContents to navigate.
  }
})

以下应用命令在 Linux 上有明确地支持：

browser-backward
browser-forward

Event: 'swipe' macOS

event Event
direction string

三指滑动时触发。 Possible directions are up, right, down, left.

此事件的基本方法是用来处理旧的macOS风格的触摸板滑动，屏幕内容不会随着滑动而移动。 Most macOS trackpads are not configured to allow this kind of swiping anymore, so in order for it to emit properly the 'Swipe between pages' preference in System Preferences > Trackpad > More Gestures must be set to 'Swipe with two or three fingers'.

Event: 'rotate-gesture' macOS

event Event
rotation Float

在触控板旋转手势上触发。持续触发直到旋转手势结束。 The rotation value on each emission is the angle in degrees rotated since the last emission. The last emitted event upon a rotation gesture will always be of value 0. 逆时针旋转值为正值，顺时针旋转值为负值。

Event: 'sheet-begin' macOS

窗口打开sheet(工作表) 时触发

Event: 'sheet-end' macOS

窗口关闭sheet(工作表) 时触发

Event: 'new-window-for-tab' macOS

当点击了系统的新标签按钮时触发

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

当系统上下文菜单在窗口上触发时发出，通常只在用户右键点击你窗口的非客户端区域时触发。 This is the window titlebar or any area you have declared as -webkit-app-region: drag in a frameless window.

Calling event.preventDefault() will prevent the menu from being displayed.

静态方法

The BaseWindow class has the following static methods:

`BaseWindow.getAllWindows()`

Returns BaseWindow[] - An array of all opened browser windows.

`BaseWindow.getFocusedWindow()`

Returns BaseWindow | null - The window that is focused in this application, otherwise returns null.

`BaseWindow.fromId(id)`

id Integer

Returns BaseWindow | null - The window with the given id.

实例属性

Objects created with new BaseWindow have the following properties:

const { BaseWindow } = require('electron')
// In this example `win` is our instance
const win = new BaseWindow({ width: 800, height: 600 })

`win.id` Readonly

A Integer property representing the unique ID of the window. Each ID is unique among all BaseWindow instances of the entire Electron application.

`win.contentView`

A View property for the content view of the window.

`win.tabbingIdentifier` macOS Readonly

A string (optional) property that is equal to the tabbingIdentifier passed to the BrowserWindow constructor or undefined if none was set.

`win.autoHideMenuBar`

A boolean property that determines whether the window menu bar should hide itself automatically. Once set, the menu bar will only show when users press the single Alt key.

If the menu bar is already visible, setting this property to true won't hide it immediately.

`win.simpleFullScreen`

A boolean property that determines whether the window is in simple (pre-Lion) fullscreen mode.

`win.fullScreen`

A boolean property that determines whether the window is in fullscreen mode.

`win.focusable` Windows macOS

A boolean property that determines whether the window is focusable.

`win.visibleOnAllWorkspaces` macOS Linux

A boolean property that determines whether the window is visible on all workspaces.

Note: Always returns false on Windows.

`win.shadow`

A boolean property that determines whether the window has a shadow.

`win.menuBarVisible` Windows Linux

A boolean property that determines whether the menu bar should be visible.

Note: If the menu bar is auto-hide, users can still bring up the menu bar by pressing the single Alt key.

`win.kiosk`

A boolean property that determines whether the window is in kiosk mode.

`win.documentEdited` macOS

A boolean property that specifies whether the window’s document has been edited.

The icon in title bar will become gray when set to true.

`win.representedFilename` macOS

A string property that determines the pathname of the file the window represents, and the icon of the file will show in window's title bar.

`win.title`

A string property that determines the title of the native window.

Note: The title of the web page can be different from the title of the native window.

`win.minimizable` macOS Windows

A boolean property that determines whether the window can be manually minimized by user.

On Linux the setter is a no-op, although the getter returns true.

`win.maximizable` macOS Windows

A boolean property that determines whether the window can be manually maximized by user.

On Linux the setter is a no-op, although the getter returns true.

`win.fullScreenable`

A boolean property that determines whether the maximize/zoom window button toggles fullscreen mode or maximizes the window.

`win.resizable`

A boolean property that determines whether the window can be manually resized by user.

`win.closable` macOS Windows

A boolean property that determines whether the window can be manually closed by user.

On Linux the setter is a no-op, although the getter returns true.

`win.movable` macOS Windows

A boolean property that determines Whether the window can be moved by user.

On Linux the setter is a no-op, although the getter returns true.

`win.excludedFromShownWindowsMenu` macOS

A boolean property that determines whether the window is excluded from the application’s Windows menu. false by default.

const { Menu, BaseWindow } = require('electron')
const win = new BaseWindow({ height: 600, width: 600 })

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

win.excludedFromShownWindowsMenu = true

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

`win.accessibleTitle`

A string property that defines an alternative title provided only to accessibility tools such as screen readers. 此字符串不直接对用户可见。

实例方法

Objects created with new BaseWindow have the following instance methods:

Note: Some methods are only available on specific operating systems and are labeled as such.

`win.setContentView(view)`

view View

Sets the content view of the window.

`win.getContentView()`

Returns View - The content view of the window.

`win.destroy()`

Force closing the window, the unload and beforeunload event won't be emitted for the web page, and close event will also not be emitted for this window, but it guarantees the closed event will be emitted.

`win.close()`

尝试关闭窗口。该方法与用户手动单击窗口的关闭按钮效果相同。但网页可能会取消这个关闭操作。 See the close event.

`win.focus()`

聚焦于窗口

`win.blur()`

取消窗口的聚焦

`win.isFocused()`

Returns boolean - Whether the window is focused.

`win.isDestroyed()`

Returns boolean - Whether the window is destroyed.

`win.show()`

显示并聚焦于窗口

`win.showInactive()`

显示但不聚焦于窗口

`win.hide()`

隐藏窗口

`win.isVisible()`

Returns boolean - Whether the window is visible to the user in the foreground of the app.

`win.isModal()`

Returns boolean - Whether current window is a modal window.

`win.maximize()`

最大化窗口。如果窗口尚未显示，该方法也会将其显示 (但不会聚焦)。

`win.unmaximize()`

取消窗口最大化

`win.isMaximized()`

Returns boolean - Whether the window is maximized.

`win.minimize()`

最小化窗口。在某些平台上, 最小化的窗口将显示在Dock中。

`win.restore()`

将窗口从最小化状态恢复到以前的状态。

`win.isMinimized()`

Returns boolean - Whether the window is minimized.

`win.setFullScreen(flag)`

flag boolean

设置窗口是否应处于全屏模式。

Note: On macOS, fullscreen transitions take place asynchronously. If further actions depend on the fullscreen state, use the 'enter-full-screen' or 'leave-full-screen' events.

`win.isFullScreen()`

Returns boolean - Whether the window is in fullscreen mode.

`win.setSimpleFullScreen(flag)` macOS

flag boolean

进入或离开简单的全屏模式。

简单全屏模式模拟了 Lion (10.7) 之前的macOS版本中的原生全屏行为。

`win.isSimpleFullScreen()` macOS

Returns boolean - Whether the window is in simple (pre-Lion) fullscreen mode.

`win.isNormal()`

Returns boolean - Whether the window is in normal state (not maximized, not minimized, not in fullscreen mode).

`win.setAspectRatio(aspectRatio[, extraSize])`

aspectRatio Float - The aspect ratio to maintain for some portion of the content view.
extraSize Size (optional) macOS - The extra size not to be included while maintaining the aspect ratio.

这将使窗口保持长宽比。额外的大小允许开发人员有空间 (以像素为单位), 不包括在纵横比计算中。此 API 已经考虑了窗口大小和内容大小之间的差异。

想象一个使用高清视频播放器和相关控件的普通窗口。假假如左边缘有15px, 右边缘有25px, 在播放器下面有50px. 为了保持播放器本身16:9 的长宽比 (标准的HD长宽比为1920x1080)，我们可以使用 16/9 和 { width: 40, height: 50 } 的参数调用这个函数。第二个参数不管网页中的额外的宽度和高度在什么位置, 只要它们存在就行. 在全部内部窗口中，加上任何额外的宽度和高度。

The aspect ratio is not respected when window is resized programmatically with APIs like win.setSize.

To reset an aspect ratio, pass 0 as the aspectRatio value: win.setAspectRatio(0).

`win.setBackgroundColor(backgroundColor)`

backgroundColor string - Color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. 对于 Hex 类型，透明通道为可选的。

Examples of valid backgroundColor values:

Hex
- #fff (shorthand RGB)
- #ffff (shorthand ARGB)
- #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)
Color name
- Options are listed in SkParseColor.cpp
- 类似 CSS Color Module Level 3 关键字，但大小写敏感。
  - e.g. blueviolet or red

设置窗口的背景颜色。 See Setting backgroundColor.

`win.previewFile(path[, displayName])` macOS

path string - The absolute path to the file to preview with QuickLook. This is important as Quick Look uses the file name and file extension on the path to determine the content type of the file to open.
displayName string (optional) - The name of the file to display on the Quick Look modal view. This is purely visual and does not affect the content type of the file. Defaults to path.

Uses Quick Look to preview a file at a given path.

`win.closeFilePreview()` macOS

Closes the currently open Quick Look panel.

`win.setBounds(bounds[, animate])`

bounds Partial<Rectangle>
animate boolean (optional) macOS

重置窗口，并且移动窗口到指定的位置. 任何未提供的属性将默认为其当前值。

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

// set all bounds properties
win.setBounds({ x: 440, y: 225, width: 800, height: 600 })

// set a single bounds property
win.setBounds({ 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. The tray height has changed over time and depends on the operating system, but is between 20-40px. Passing a value lower than the tray height will result in a window that is flush to the 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. For example, calling win.setBounds({ x: 25, y: 20, width: 800, height: 600 }) with a tray height of 38 means that win.getBounds() will return { x: 25, y: 38, width: 800, height: 600 }.

`win.getBackgroundColor()`

Returns string - Gets the background color of the window in Hex (#RRGGBB) format.

See Setting backgroundColor.

Note: The alpha value is not returned alongside the red, green, and blue values.

`win.setContentBounds(bounds[, animate])`

bounds Rectangle
animate boolean (optional) macOS

调整窗口的工作区 (如网页) 的大小并将其移动到所提供的边界。

`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

Note: whatever the current state of the window : maximized, minimized or in fullscreen, this function always returns the position and size of the window in normal state. In normal state, getBounds and getNormalBounds returns the same Rectangle.

`win.setEnabled(enable)`

enable boolean

禁用或者启用窗口。

`win.isEnabled()`

Returns boolean - whether the window is enabled.

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

width Integer
height Integer
animate boolean (optional) macOS

Resizes the window to width and height. If width or height are below any set minimum size constraints the window will snap to its minimum size.

`win.getSize()`

Returns Integer[] - Contains the window's width and height.

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

width Integer
height Integer
animate boolean (optional) macOS

Resizes the window's client area (e.g. the web page) to width and height.

`win.getContentSize()`

Returns Integer[] - Contains the window's client area's width and height.

`win.setMinimumSize(width, height)`

width Integer
height Integer

Sets the minimum size of window to width and height.

`win.getMinimumSize()`

Returns Integer[] - Contains the window's minimum width and height.

`win.setMaximumSize(width, height)`

width Integer
height Integer

Sets the maximum size of window to width and height.

`win.getMaximumSize()`

Returns Integer[] - Contains the window's maximum width and height.

`win.setResizable(resizable)`

resizable boolean

设置用户是否可以手动调整窗口大小。

`win.isResizable()`

Returns boolean - Whether the window can be manually resized by the user.

`win.setMovable(movable)` macOS Windows

movable boolean

设置用户是否可以移动窗口。在Linux上不起作用。

`win.isMovable()` macOS Windows

Returns boolean - Whether the window can be moved by user.

On Linux always returns true.

`win.setMinimizable(minimizable)` macOS Windows

minimizable boolean

设置用户是否可以手动将窗口最小化。在Linux上不起作用。

`win.isMinimizable()` macOS Windows

Returns boolean - Whether the window can be manually minimized by the user.

On Linux always returns true.

`win.setMaximizable(maximizable)` macOS Windows

maximizable boolean

设置用户是否可以手动最大化窗口。在Linux上不起作用。

`win.isMaximizable()` macOS Windows

Returns boolean - Whether the window can be manually maximized by user.

On Linux always returns true.

`win.setFullScreenable(fullscreenable)`

fullscreenable boolean

设置最大化/缩放窗口按钮是切换全屏模式还是最大化窗口。

`win.isFullScreenable()`

Returns boolean - Whether the maximize/zoom window button toggles fullscreen mode or maximizes the window.

`win.setClosable(closable)` macOS Windows

closable boolean

设置用户是否可以手动关闭窗口。在Linux上不起作用。

`win.isClosable()` macOS Windows

Returns boolean - Whether the window can be manually closed by user.

On Linux always returns true.

`win.setHiddenInMissionControl(hidden)` macOS

hidden boolean

Sets whether the window will be hidden when the user toggles into mission control.

`win.isHiddenInMissionControl()` macOS

Returns boolean - Whether the window will be hidden when the user toggles into mission control.

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

flag boolean
level string (optional) macOS Windows - Values include normal, floating, torn-off-menu, modal-panel, main-menu, status, pop-up-menu, screen-saver, and ~~dock~~ (Deprecated). The default is floating when flag is true. The level is reset to normal when the flag is false. Note that from floating to status included, the window is placed below the Dock on macOS and below the taskbar on Windows. From pop-up-menu to a higher it is shown above the Dock on macOS and above the taskbar on Windows. See the macOS docs for more details.
relativeLevel Integer (optional) macOS - The number of layers higher to set this window relative to the given level. The default is 0. Note that Apple discourages setting levels higher than 1 above screen-saver.

设置窗口是否应始终显示在其他窗口的前面。设置后，窗口仍然是一个正常窗口，而不是一个无法获取焦点的工具框窗口。

`win.isAlwaysOnTop()`

Returns boolean - Whether the window is always on top of other windows.

`win.moveAbove(mediaSourceId)`

mediaSourceId string - Window id in the format of DesktopCapturerSource's id. 例如 "window:1869:0"。

将窗口按z轴顺序移动到源窗口前面。 If the mediaSourceId is not of type window or if the window does not exist then this method throws an error.

`win.moveTop()`

无论焦点如何, 将窗口移至顶端(z轴上的顺序).

`win.center()`

将窗口移动到屏幕中央。

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

x Integer
y Integer
animate boolean (optional) macOS

Moves window to x and y.

`win.getPosition()`

Returns Integer[] - Contains the window's current position.

`win.setTitle(title)`

title string

Changes the title of native window to title.

`win.getTitle()`

Returns string - The title of the native window.

Note: The title of the web page can be different from the title of the native window.

`win.setSheetOffset(offsetY[, offsetX])` macOS

offsetY Float
offsetX Float (optional)

改变macOS上sheet组件的附着点。默认情况下，sheet贴在窗口边框正下方，但你可能需要在 HTML 渲染工具栏下方显示它们。例如：

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

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

`win.flashFrame(flag)`

flag boolean

启动或停止闪烁窗口, 以吸引用户的注意。

`win.setSkipTaskbar(skip)` macOS Windows

skip boolean

使窗口不显示在任务栏中。

`win.setKiosk(flag)`

flag boolean

进入或离开 kiosk 模式。

`win.isKiosk()`

Returns boolean - Whether the window is in kiosk mode.

`win.isTabletMode()` Windows

Returns boolean - Whether the window is in Windows 10 tablet mode.

Since Windows 10 users can use their PC as tablet, under this mode apps can choose to optimize their UI for tablets, such as enlarging the titlebar and hiding titlebar buttons.

This API returns whether the window is in tablet mode, and the resize event can be be used to listen to changes to tablet mode.

`win.getMediaSourceId()`

Returns string - Window id in the format of DesktopCapturerSource's id. 例如 "window:1324:0"。

More precisely the format is window:id:other_id where id is HWND on Windows, CGWindowID (uint64_t) on macOS and Window (unsigned long) on Linux. other_id is used to identify web contents (tabs) so within the same top level window.

`win.getNativeWindowHandle()`

Returns Buffer - The platform-specific handle of the window.

The native type of the handle is HWND on Windows, NSView* on macOS, and Window (unsigned long) on Linux.

`win.hookWindowMessage(message, callback)` Windows

message Integer
callback Function
- wParam Buffer - The wParam provided to the WndProc
- lParam Buffer - The lParam provided to the WndProc

钩住窗口消息。 The callback is called when the message is received in the WndProc.

`win.isWindowMessageHooked(message)` Windows

message Integer

Returns boolean - true or false depending on whether the message is hooked.

`win.unhookWindowMessage(message)` Windows

message Integer

取消窗口信息的钩子。

`win.unhookAllWindowMessages()` Windows

取消所有窗口信息的钩子。

`win.setRepresentedFilename(filename)` macOS

filename string

设置窗口所代表的文件的路径名，并且将这个文件的图标放在窗口标题栏上。

`win.getRepresentedFilename()` macOS

Returns string - The pathname of the file the window represents.

`win.setDocumentEdited(edited)` macOS

edited boolean

Specifies whether the window’s document has been edited, and the icon in title bar will become gray when set to true.

`win.isDocumentEdited()` macOS

Returns boolean - Whether the window's document has been edited.

`win.setMenu(menu)` Linux Windows

menu Menu | null

Sets the menu as the window's menu bar.

`win.removeMenu()` Linux Windows

删除窗口的菜单栏。

`win.setProgressBar(progress[, options])`

progress Double
options Object (optional)
- mode string Windows - Mode for the progress bar. Can be none, normal, indeterminate, error or paused.

设置进度条的进度值。 Valid range is [0, 1.0].

当进度小于0时不显示进度; 当进度大于0时显示结果不确定.

On Linux platform, only supports Unity desktop environment, you need to specify the *.desktop file name to desktopName field in package.json. By default, it will assume {app.name}.desktop.

在 Windows 上, 可以传递模式。 Accepted values are none, normal, indeterminate, error, and paused. If you call setProgressBar without a mode set (but with a value within the valid range), normal will be assumed.

`win.setOverlayIcon(overlay, description)` Windows

overlay NativeImage | null - the icon to display on the bottom right corner of the taskbar icon. If this parameter is null, the overlay is cleared
description string - a description that will be provided to Accessibility screen readers

在当前任务栏图标上设置一个 16 x 16 像素的图标, 通常用于传达某种应用程序状态或被动地通知用户。

`win.invalidateShadow()` macOS

Invalidates the window shadow so that it is recomputed based on the current window shape.

BaseWindows that are transparent can sometimes leave behind visual artifacts on macOS. This method can be used to clear these artifacts when, for example, performing an animation.

`win.setHasShadow(hasShadow)`

hasShadow boolean

设置窗口是否有阴影。

`win.hasShadow()`

Returns boolean - Whether the window has a shadow.

`win.setOpacity(opacity)` Windows macOS

opacity number - between 0.0 (fully transparent) and 1.0 (fully opaque)

设置窗口的不透明度。在Linux上不起作用。 Out of bound number values are clamped to the [0, 1] range.

`win.getOpacity()`

Returns number - between 0.0 (fully transparent) and 1.0 (fully opaque). 在Linux上，始终返回1。

`win.setShape(rects)` Windows Linux Experimental

rects Rectangle[] - Sets a shape on the window. 通过传入空列表将窗口恢复为矩形。

对窗口形状的设置决定了窗口内系统允许绘制与用户交互的区域. 在给定的区域外, 没有像素会被绘制, 且没有鼠标事件会被登记. 在该区域外的鼠标事件将不会被该窗口接收, 而是落至该窗口后方的任意窗口.

`win.setThumbarButtons(buttons)` Windows

buttons ThumbarButton[]

Returns boolean - Whether the buttons were added successfully

将指定的一组按钮添加到菜单栏的缩图工具栏上。 Returns a boolean object indicates whether the thumbnail has been added successfully.

由于空间有限, 缩图工具栏中的按钮数量不要超过7个。一旦设置了缩略图工具栏，则无法删除。但你可以通过调用 API 传递一个空数组来清除按钮.

The buttons is an array of Button objects:

Button Object
- icon NativeImage - The icon showing in thumbnail toolbar.
- click Function
- tooltip string (optional) - The text of the button's tooltip.
- flags string[] (optional) - Control specific states and behaviors of the button. By default, it is ['enabled'].

The flags is an array that can include following strings:

enabled - The button is active and available to the user.
disabled - The button is disabled. It is present, but has a visual state indicating it will not respond to user action.
dismissonclick - When the button is clicked, the thumbnail window closes immediately.
nobackground - Do not draw a button border, use only the image.
hidden - The button is not shown to the user.
noninteractive - The button is enabled but not interactive; no pressed button state is drawn. This value is intended for instances where the button is used in a notification.

`win.setThumbnailClip(region)` Windows

region Rectangle - Region of the window

将窗口的区域设置为在任务栏中悬停在窗口上方时显示的缩略图图像。 You can reset the thumbnail to be the entire window by specifying an empty region: { x: 0, y: 0, width: 0, height: 0 }.

`win.setThumbnailToolTip(toolTip)` Windows

toolTip string

设置在任务栏中悬停在窗口缩略图上时显示的工具提示。

`win.setAppDetails(options)` Windows

options Object
- appId string (optional) - Window's App User Model ID. 该项必须设置, 否则其他选项将没有效果.
- appIconPath string (optional) - Window's Relaunch Icon.
- appIconIndex Integer (optional) - Index of the icon in appIconPath. Ignored when appIconPath is not set. Default is 0.
- relaunchCommand string (optional) - Window's Relaunch Command.
- relaunchDisplayName string (optional) - Window's Relaunch Display Name.

设置窗口任务栏按钮的属性。

Note: relaunchCommand and relaunchDisplayName must always be set together. 如果其中一个属性没有设置，那么这两个属性都不会使用。

`win.setIcon(icon)` Windows Linux

icon NativeImage | string

设置窗口图标

`win.setWindowButtonVisibility(visible)` macOS

visible boolean

设置是否窗口交通灯需要显示。

`win.setAutoHideMenuBar(hide)` Windows Linux

hide boolean

设置窗口菜单栏是否自动隐藏。 Once set the menu bar will only show when users press the single Alt key.

If the menu bar is already visible, calling setAutoHideMenuBar(true) won't hide it immediately.

`win.isMenuBarAutoHide()` Windows Linux

Returns boolean - Whether menu bar automatically hides itself.

`win.setMenuBarVisibility(visible)` Windows Linux

visible boolean

设置菜单栏是否可见。 If the menu bar is auto-hide, users can still bring up the menu bar by pressing the single Alt key.

`win.isMenuBarVisible()` Windows Linux

Returns boolean - Whether the menu bar is visible.

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

visible boolean
options Object (optional)
- visibleOnFullScreen boolean (optional) macOS - Sets whether the window should be visible above fullscreen windows.
- skipTransformProcessType boolean (optional) macOS - Calling setVisibleOnAllWorkspaces will by default transform the process type between UIElementApplication and ForegroundApplication to ensure the correct behavior. However, this will hide the window and dock for a short time every time it is called. If your window is already of type UIElementApplication, you can bypass this transformation by passing true to skipTransformProcessType.

设置窗口是否在所有工作空间上可见

Note: This API does nothing on Windows.

`win.isVisibleOnAllWorkspaces()` macOS Linux

Returns boolean - Whether the window is visible on all workspaces.

Note: This API always returns false on Windows.

`win.setIgnoreMouseEvents(ignore[, options])`

ignore boolean
options Object (optional)
- forward boolean (optional) macOS Windows - If true, forwards mouse move messages to Chromium, enabling mouse related events such as mouseleave. Only used when ignore is true. If ignore is false, forwarding is always disabled regardless of this value.

忽略窗口内的所有鼠标事件

在此窗口中发生的所有鼠标事件将被传递到此窗口下面的窗口, 但如果此窗口具有焦点, 它仍然会接收键盘事件

`win.setContentProtection(enable)` macOS Windows

enable boolean

防止窗口内容被其他应用捕获

在 macOS 上，它将 NSWindow 的 sharingType 设置为 NSWindowSharingNone。 On Windows it calls SetWindowDisplayAffinity with WDA_EXCLUDEFROMCAPTURE. For Windows 10 version 2004 and up the window will be removed from capture entirely, older Windows versions behave as if WDA_MONITOR is applied capturing a black window.

`win.setFocusable(focusable)` macOS Windows

focusable boolean

设置窗口是否可聚焦

在 macOS 上，该方法不会从窗口中移除焦点。

`win.isFocusable()` macOS Windows

Returns boolean - Whether the window can be focused.

`win.setParentWindow(parent)`

parent BaseWindow | null

Sets parent as current window's parent window, passing null will turn current window into a top-level window.

`win.getParentWindow()`

Returns BaseWindow | null - The parent window or null if there is no parent.

`win.getChildWindows()`

Returns BaseWindow[] - All child windows.

`win.setAutoHideCursor(autoHide)` macOS

autoHide boolean

设置输入时是否隐藏光标

`win.selectPreviousTab()` macOS

当启用本地选项卡，并且窗口中有另一个标签时，选择上一个选项卡。

`win.selectNextTab()` macOS

当启用本地选项卡，并且窗口中有另一个标签时，选择下一个选项卡。

`win.showAllTabs()` macOS

Shows or hides the tab overview when native tabs are enabled.

`win.mergeAllWindows()` macOS

当启用本地选项卡并且存在多个打开窗口时，将所有窗口合并到一个带有多个选项卡的窗口中。

`win.moveTabToNewWindow()` macOS

如果启用了本机选项卡并且当前窗口中有多个选项卡，则将当前选项卡移动到新窗口中。

`win.toggleTabBar()` macOS

如果启用了本机选项卡并且当前窗口中只有一个选项卡，则切换选项卡栏是否可见。

`win.addTabbedWindow(baseWindow)` macOS

baseWindow BaseWindow

在该窗口中添加一个窗口作为选项卡，位于窗口实例的选项卡之后。

`win.setVibrancy(type)` macOS

type string | null - Can be titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, or under-page. See the macOS documentation for more details.

Adds a vibrancy effect to the window. Passing null or an empty string will remove the vibrancy effect on the window.

`win.setBackgroundMaterial(material)` Windows

material string
- auto - Let the Desktop Window Manager (DWM) automatically decide the system-drawn backdrop material for this window. 默认为该值。
- none - Don't draw any system backdrop.
- mica - Draw the backdrop material effect corresponding to a long-lived window.
- acrylic - Draw the backdrop material effect corresponding to a transient window.
- tabbed - Draw the backdrop material effect corresponding to a window with a tabbed title bar.

This method sets the browser window's system-drawn background material, including behind the non-client area.

See the Windows documentation for more details.

Note: This method is only supported on Windows 11 22H2 and up.

`win.setWindowButtonPosition(position)` macOS

position Point | null

在无框窗口中设置自定义控制按钮的位置。 Passing null will reset the position to default.

`win.getWindowButtonPosition()` macOS

Returns Point | null - The custom position for the traffic light buttons in frameless window, null will be returned when there is no custom position.

`win.setTouchBar(touchBar)` macOS

touchBar TouchBar | null

设置窗口的触摸条布局 Specifying null or undefined clears the touch bar. This method only has an effect if the machine has a touch bar.

Note: The TouchBar API is currently experimental and may change or be removed in future Electron releases.

`win.setTitleBarOverlay(options)` Windows

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

在已开启 Window Controls Overlay 的窗口上，此方法将更新标题栏叠加层的样式。

父子窗口
模态窗口
平台相关的提示
Class: BaseWindow

BaseWindow

父子窗口​

模态窗口​

平台相关的提示​

Class: BaseWindow​

new BaseWindow([options])​

实例事件​

事件： 'close'​

事件： 'closed'​

Event: 'session-end' Windows​

事件: 'blur'​

事件: 'focus'​

事件: 'show'​

事件: 'hide'​

事件: 'maximize'​

事件: 'unmaximize'​

事件: 'minimize'​

事件: 'restore'​

Event: 'will-resize' macOS Windows​

事件: 'resize'​

Event: 'resized' macOS Windows​

Event: 'will-move' macOS Windows​

事件: 'move'​

Event: 'moved' macOS Windows​

事件: 'enter-full-screen'​

事件: 'leave-full-screen'​

事件: 'always-on-top-changed'​

Event: 'app-command' Windows Linux​

Event: 'swipe' macOS​

Event: 'rotate-gesture' macOS​

Event: 'sheet-begin' macOS​

Event: 'sheet-end' macOS​

Event: 'new-window-for-tab' macOS​

Event: 'system-context-menu' Windows​

静态方法​

BaseWindow.getAllWindows()​

BaseWindow.getFocusedWindow()​

BaseWindow.fromId(id)​

实例属性​

win.id Readonly​

win.contentView​

win.tabbingIdentifier macOS Readonly​

win.autoHideMenuBar​

win.simpleFullScreen​

win.fullScreen​

win.focusable Windows macOS​

win.visibleOnAllWorkspaces macOS Linux​

win.shadow​

win.menuBarVisible Windows Linux​

win.kiosk​

win.documentEdited macOS​

win.representedFilename macOS​

win.title​

win.minimizable macOS Windows​

win.maximizable macOS Windows​

win.fullScreenable​

win.resizable​

win.closable macOS Windows​

win.movable macOS Windows​

win.excludedFromShownWindowsMenu macOS​

win.accessibleTitle​

实例方法​

win.setContentView(view)​

win.getContentView()​

win.destroy()​

win.close()​

win.focus()​

win.blur()​

win.isFocused()​

win.isDestroyed()​

win.show()​

win.showInactive()​

win.hide()​

win.isVisible()​

win.isModal()​

win.maximize()​

win.unmaximize()​

win.isMaximized()​

win.minimize()​

win.restore()​

父子窗口

模态窗口

平台相关的提示

Class: BaseWindow

`new BaseWindow([options])`

实例事件

事件： 'close'

事件： 'closed'

Event: 'session-end' Windows

事件: 'blur'

事件: 'focus'

事件: 'show'

事件: 'hide'

事件: 'maximize'

事件: 'unmaximize'

事件: 'minimize'

事件: 'restore'

Event: 'will-resize' macOS Windows

事件: 'resize'

Event: 'resized' macOS Windows

Event: 'will-move' macOS Windows

事件: 'move'

Event: 'moved' macOS Windows

事件: 'enter-full-screen'

事件: 'leave-full-screen'

事件: 'always-on-top-changed'

Event: 'app-command' Windows Linux

Event: 'swipe' macOS

Event: 'rotate-gesture' macOS

Event: 'sheet-begin' macOS

Event: 'sheet-end' macOS

Event: 'new-window-for-tab' macOS

Event: 'system-context-menu' Windows

静态方法

`BaseWindow.getAllWindows()`

`BaseWindow.getFocusedWindow()`

`BaseWindow.fromId(id)`

实例属性

`win.id` Readonly

`win.contentView`

`win.tabbingIdentifier` macOS Readonly

`win.autoHideMenuBar`

`win.simpleFullScreen`

`win.fullScreen`

`win.focusable` Windows macOS

`win.visibleOnAllWorkspaces` macOS Linux

`win.shadow`

`win.menuBarVisible` Windows Linux

`win.kiosk`

`win.documentEdited` macOS

`win.representedFilename` macOS

`win.title`

`win.minimizable` macOS Windows

`win.maximizable` macOS Windows

`win.fullScreenable`

`win.resizable`

`win.closable` macOS Windows

`win.movable` macOS Windows

`win.excludedFromShownWindowsMenu` macOS

`win.accessibleTitle`

实例方法

`win.setContentView(view)`

`win.getContentView()`

`win.destroy()`

`win.close()`

`win.focus()`

`win.blur()`

`win.isFocused()`

`win.isDestroyed()`

`win.show()`

`win.showInactive()`

`win.hide()`

`win.isVisible()`

`win.isModal()`

`win.maximize()`

`win.unmaximize()`

`win.isMaximized()`

`win.minimize()`

`win.restore()`

`win.isMinimized()`