跳转到主内容

BaseWindow

创建和控制窗口。

Process: Main

注意 BaseWindow 提供了一种在单个窗口中灵活组合多个web视图的方式。 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.

// 在主进程中
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 })

父子窗口

通过使用 parent 选项,可以创建子窗口:

const { BaseWindow } = require('electron')

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

child子窗口将始终显示在parent父窗口的顶部。

模态窗口

模态窗口是禁用父窗口的子窗口。 要创建模态窗口,必须同时设置parentmodal选项:

const { BaseWindow } = require('electron')

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

平台相关的提示

  • 在 macOS 上,modal 窗口将显示为附加到父窗口的工作表。
  • 在 macOS 上,当父窗口移动时,子窗口将保持相对位置,而在 Windows 和 Linux 上,子窗口将不会移动。
  • 在 Linux 上,模态窗口的类型将更改为dialog
  • 在Linux上,许多桌面环境不支持隐藏模态窗口。

Resource management

When you add a WebContentsView to a BaseWindow and the BaseWindow is closed, the webContents of the WebContentsView are not destroyed automatically.

It is your responsibility to close the webContents when you no longer need them, e.g. when the BaseWindow is closed:

const { BaseWindow, WebContentsView } = require('electron')

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

const view = new WebContentsView()
win.contentView.addChildView(view)

win.on('closed', () => {
view.webContents.close()
})

Unlike with a BrowserWindow, if you don't explicitly close the webContents, you'll encounter memory leaks.

Class: BaseWindow

创建和控制窗口。

Process: Main

BaseWindow是一个EventEmitter

它根据options设置的本地属性创建一个新的BaseWindow

new BaseWindow([options])

  • options BaseWindowConstructorOptions (optional)
    • width Integer (可选) - 窗口的宽度(以像素为单位)。 默认值为 800。
    • height Integer (可选) - 窗口的高度(以像素为单位)。 默认值为 600。
    • x Integer (可选) (如果y存在则必填) - 窗口相对于屏幕左侧的偏移量。 默认值为将窗口居中。
    • y Integer (可选) (如果x存在则必填) - 窗口相对于屏幕顶端的偏移量。 默认值为将窗口居中。
    • useContentSize boolean (可选) - widthheight 将作为 WEB 页面的尺寸使用,这意味着实际窗口尺寸还将加上窗口框架的尺寸,这将导致窗口尺寸比页面尺寸大一些。 默认值为:false
    • center boolean (可选) - 窗口是否在屏幕居中显示。 默认值为:false
    • minWidth Integer (可选) - 窗口的最小宽度。 默认值为0
    • minHight Integer (可选) - 窗口的最小高度。 默认值为0
    • maxWidth Integer (可选) - 窗口的最大宽度。 默认值不限
    • maxHeight Integer (可选) - 窗口的最大高度。 默认值不限
    • resizable boolean (可选) - 窗口大小是否可变。 默认值为: true
    • movable boolean (可选) macOS Windows - 窗口是否能被移动。 在 Linux 上未实现。 默认值为: true
    • minimizable boolean (可选) macOS Windows - 窗口是否能被最小化。 在 Linux 上未实现。 默认值为: true
    • maximizable boolean (可选) macOS Windows - 窗口是否能被最大化。 在 Linux 上未实现。 默认值为: true
    • closable boolean (可选) macOS Windows - 窗口能否被关闭。 在 Linux 上未实现。 默认值为: true
    • focusable boolean (可选) - 窗口能否被聚焦。 默认值为:true。 在 Windows 中设置 focusable: false 也意味着设置了skipTaskbar: true。 在 Linux 设置 focus: false 使窗口停止与 wm(窗口管理器 - Windows Manager) 互动,所以窗口将始终保持在所有工作区的顶部。
    • alwaysOnTop boolean (可选) - 指定窗口是否一直处于其他窗口之上。 默认值为:false
    • fullscreen boolean (可选) - 指定窗口是否全屏显示。 在 macOS 上,当明确设置为 false 时,全屏按钮将被禁用或者隐藏。 默认值为:false
    • fullscreenable boolean (可选) - 窗口是否能进入全屏模式。 在 macOS 上,也决定了最大化/缩放按钮是应该切换全屏模式还是最大化窗口。 默认值为: true
    • simpleFullscreen boolean (可选) macOS - 在 macOS 上使用 Lion 之前的全屏模式。 默认值为:false
    • skipTaskbar boolean (可选) macOS Windows - 是否在任务栏中显示窗口。 默认值为:false
    • hiddenInMissionControl boolean (可选) macOS - 当用户切换到任务控制(Mission Control)时,窗口是否应隐藏。
    • kiosk boolean (可选) - 窗口是否处于信息亭模式(kiosk mode)。 默认值为:false
    • title string (可选) - 默认窗口标题。 默认值为: "Electron"。 如果由loadURL()加载的HTML文件中含有标签<title>,此属性将被忽略。
    • icon (NativeImage | string) (可选) - 窗口图标。 在 Windows 上,建议使用 ICO 图标以获得最佳视觉效果,你也可以不定义它,这样将使用可执行文件的图标。
    • show boolean (可选) - 窗口在创建时是否应显示。 默认值为:true
    • frame boolean (可选) - 指定 false 来创建一个 无边框窗口。 默认值为: true
    • parent BaseWindow (可选) - 指定父级窗口。 默认值为: null
    • modal boolean (可选) - 是否指定为一个模态窗口。 仅当窗口为子窗口时才有用。 默认值为:false
    • acceptFirstMouse boolean (可选) macOS - 是否点击非活动窗口时也会穿透到网页内容。 macOS 上默认值是: false 。 此选项在其他平台上不可配置。
    • disableAutoHideCursor boolean (可选) - 是否在输入时隐藏光标。 默认值为:false
    • autoHideMenuBar boolean (可选) - 除非按下 Alt 键,否则自动隐藏菜单栏。 默认值为:false
    • enableLargerThanScreen boolean (可选) macOS - 窗口尺寸调整时,是否允许超过屏幕尺寸。 仅与 macOS 相关,因为其他操作系统默认允许窗口比屏幕更大。 默认值为:false
    • backgroundColor string (可选) - 窗口的背景颜色,支持十六进制、RGB、RGBA、HSL、HSLA 或命名的 CSS 颜色格式。 如果 transparent 设置为 true,则支持 #AARRGGBB 格式的透明度。 默认值为:#FFF (白色)。 更多信息,请阅读 win.setBackgroundColor
    • hasShadow boolean (可选) - 窗口是否有阴影。 默认值为: true
    • opacity number (可选) macOS Windows - 设置窗口的初始不透明度,范围从 0.0(完全透明)到 1.0(完全不透明)。 此功能仅在 Windows 和 macOS 上实现。
    • darkTheme boolean (可选) - 强制窗口使用深色主题,仅在某些 GTK+3 桌面环境中有效。 默认值为:false
    • transparent boolean (可选) - 使得窗口 透明。 默认值为:false。 在Windows上,仅在无边框窗口下起作用。
    • type string (可选) - 窗口的类型,默认为普通窗口。 更多信息见下文。
    • visualEffectState string (可选) macOS - 在 macOS 上指定外观应该如何响应窗口活动状态。 必须与 vibrancy 属性一起使用。 可能的值有
      • followWindow - 当窗口处于活动状态时,背景应自动显示为活动状态;当窗口不活动时,则显示为非活动状态。 默认为该值。
      • active - 背景应始终显示为活动状态。
      • inactive - 背景应始终显示为非活动状态。
    • titleBarStyle string (可选) - 指定窗口标题栏的样式。 默认值为:default。 可能的值有
      • default - 分别在 macOS 或 Windows 上显示标准标题栏。
      • hidden - 隐藏标题栏,内容窗口为完整尺寸。 在 macOS 内, 窗口将一直拥有位于左上的标准窗口控制器 (“traffic lights”)。 在 Windows 和 Linux 上,当与 titleBarOverlay: true 结合使用时,它将激活窗口控件覆盖层(有关更多信息,请参阅 titleBarOverlay),否则不会显示任何窗口控件。
      • hiddenInset macOS - 隐藏标题栏,并采用一种替代外观,其中交通灯按钮距离窗口边缘稍微向内缩进。
      • customButtonsOnHover macOS - 隐藏标题栏,并且内容窗口为完整尺寸,当鼠标悬停在窗口左上角时,交通灯按钮将会显示。 注意: 此选项目前为实验性功能。
    • titleBarOverlay Object | Boolean (可选) - 在 macOS 上,当使用无边框窗口并结合 win.setWindowButtonVisibility(true),或者使用 titleBarStyle 使标准窗口控件(macOS 上的“交通灯”按钮)可见时,此属性将启用窗口控件覆盖层的 JavaScript APICSS 环境变量。 指定为 true 将使用默认的系统颜色覆盖层。 默认值为:false
      • color String (可选) Windows Linux - 窗口控件覆盖层启用时的 CSS 颜色。 默认是系统颜色。
      • symbolColor String (可选) Windows - 窗口控件覆盖层启用时上面符号的 CSS 颜色。 默认是系统颜色。
      • height Integer (optional) - The height of the title bar and Window Controls Overlay in pixels. 默认值为系统高度。
    • trafficLightPosition Point (可选) macOS - 在无边框窗口中为交通灯按钮设置自定义位置。
    • roundedCorners boolean (可选) macOS Windows - 无边框窗口是否应具有圆角。 默认值为: true。 在 macOS 上,将此属性设置为 false, 将阻止窗口进入全屏模式。 在低于 Windows 11 Build 22000 的 Windows 版本中,此属性无效,且无边框窗口将不会具有圆角。
    • thickFrame boolean (可选) - 在 Windows 上为无边框窗口使用 WS_THICKFRAME 样式,这将添加标准窗口框架。 将其设置为 false 将移除窗口阴影和窗口动画。 默认值为: true
    • vibrancy string (可选) macOS - 为窗口添加一种 vibrancy 效果,仅适用于 macOS。 可以是 appearance-basedtitlebarselectionmenupopoversidebarheadersheetwindowhudfullscreen-uitooltipcontentunder-windowunder-page
    • backgroundMaterial string (可选) Windows - 设置窗口的系统绘制背景材质,包括非客户区的背景。 可以是 auto, none, mica, acrylic 或者 tabbed。 详情请见 win.setBackgroundMaterial
    • zoomToPageWidth boolean (可选) macOS - 控制在 macOS 上按住 Option 键点击工具栏中的绿色信号灯按钮,或通过点击窗口 > 放大菜单项时的行为。 如果为 true,窗口在缩放时将扩展到网页的首选宽度;如果为 false,它将缩放到屏幕的宽度。 这也将影响调用 maximize() 时的行为。 默认值为:false
    • tabbingIdentifier string (可选) macOS - 标签组名称,允许将窗口作为原生标签打开。 具有相同标签标识符的窗口将被分组在一起。 这还会在窗口的标签栏中添加一个原生的新标签按钮,并允许您的 app 和窗口接收 new-window-for-tab 事件。

    当使用 minWidth/maxWidth/minHeight/maxHeight 设置窗口的最小或最大尺寸时,它仅对用户形成约束。 这并不会阻止你将不符合尺寸约束的值传递给 setBounds/setSizeBrowserWindow 的构造函数。

    type 选项的可用值和可能的行为与平台相关。 可能的值有

    • Linux上的可选值: desktop, dock, toolbar, splash, notification
      • desktop 类型将窗口置于桌面背景窗口层级(kCGDesktopWindowLevel - 1)。 但请注意,桌面窗口将不会被聚焦、接收键盘或鼠标事件。 不过你仍然可以使用 globalShortcut 来接收输入。
      • dock 类型创建类似于 Dock 的窗口行为。
      • toolbar 类型创建一个具有工具栏外观的窗口。
      • splash 类型的行为具有些特别。 即使窗口主体的 CSS 样式包含 -webkit-app-region: drag,它也无法拖动。 这种类型通常用于启动窗(splash screens)。
      • notification 类型创建一个行为类似于系统通知的窗口。
    • 在 macOS 上的可选值为:desktop, textured, panel
      • textured 类型添加金属渐变外观。 这个配置已经被 废弃
      • desktop 类型将窗口置于桌面背景窗口层级(kCGDesktopWindowLevel - 1)。 请注意,桌面窗口将无法被聚焦、无法接收键盘或鼠标事件,你仅可以使用 globalShortcut 来接收输入。
      • panel 类型通过在运行时添加通常为 NSPanel 保留的 NSWindowStyleMaskNonactivatingPanel 样式掩码,使窗口能够浮动在全屏应用的上方。 此外, 该窗口将出现在所有空间(桌面)上。
    • 在 Windows 上的可选值为: 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: 'query-session-end' Windows

返回:

Emitted when a session is about to end due to a shutdown, machine restart, or user log-off. Calling event.preventDefault() can delay the system shutdown, though it’s generally best to respect the user’s choice to end the session. However, you may choose to use it if ending the session puts the user at risk of losing data.

Event: 'session-end' Windows

返回:

Emitted when a session is about to end due to a shutdown, machine restart, or user log-off. Once this event fires, there is no way to prevent the session from ending.

事件: 'blur'

返回:

  • event Event

当窗口失去焦点时触发

事件: 'focus'

返回:

  • event Event

当窗口获得焦点时触发

事件: '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: 'system-context-menu' Windows

返回:

  • 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.

静态方法

BaseWindow类具有以下静态方法:

BaseWindow.getAllWindows()

Returns BaseWindow[] - 全部已打开浏览器窗口构成的数组。

BaseWindow.getFocusedWindow()

Returns BaseWindow | null - 当前应用中聚焦的窗口,无聚焦则返回 null。

BaseWindow.fromId(id)

  • id Integer

Returns BaseWindow | null - 给定id的窗口。

实例属性

使用 new BaseWindow 创建的对象具有以下属性:

const { BaseWindow } = require('electron')
// 在这个示例中,`win` 是我们的实例
const win = new BaseWindow({ width: 800, height: 600 })

win.id Readonly

一个Integer属性,表示窗口的唯一 ID。 每个 ID 在整个 Electron 应用程序的所有BaseWindow实例中都是唯一的。

win.contentView

一个View属性,表示窗口的内容视图。

win.tabbingIdentifier macOS Readonly

一个string(可选) 属性,等于传递给BrowserWindow构造函数的tabbingIdentifier,如果未设置,则为 undefined

win.autoHideMenuBar

一个boolean属性,决定窗口菜单栏是否应自动隐藏。 设置后,菜单栏将仅在用户按单个Alt键时显示。

如果菜单栏已经可见,将此属性设置为true不会立即隐藏它。

win.simpleFullScreen

一个boolean属性,决定窗口是否处于简单 (Lion 之前的) 全屏模式。

win.fullScreen

一个boolean属性,决定窗口是否处于全屏模式。

win.focusable Windows macOS

一个boolean属性,决定窗口是否可以聚焦。

win.visibleOnAllWorkspaces macOS Linux

一个boolean属性,决定窗口是否在所有工作区可见。

注意: 在 Windows 平台始终返回 false。

win.shadow

一个boolean属性,决定窗口是否有阴影。

win.menuBarVisible Windows Linux

一个boolean属性,决定菜单栏是否可见。

注意:如果菜单栏是自动隐藏的,用户仍然可以通过单击Alt键唤出菜单栏。

win.kiosk

一个boolean属性,决定窗口是否处于展台模式。

win.documentEdited macOS

一个boolean属性,指定窗口的文档是否已被编辑。

设置为true时,标题栏上的图标将变为灰色。

win.representedFilename macOS

一个string属性,决定窗口表示的文件的路径名,文件的图标将显示在窗口的标题栏中。

win.title

一个string属性,决定原生窗口的标题。

注意:网页的标题可以与原生窗口的标题不同。

win.minimizable macOS Windows

一个 boolean 属性,决定用户是否可以手动最小化窗口。

在 Linux 上,setter 是无操作的,尽管 getter 返回true

win.maximizable macOS Windows

一个boolean属性,决定用户是否可以手动最大化窗口。

在 Linux 上,setter 是无操作的,尽管 getter 返回true

win.fullScreenable

一个boolean属性,决定最大化/缩放窗口按钮是否切换全屏模式或最大化窗口。

win.resizable

一个boolean属性,决定用户是否可以手动调整窗口大小。

win.closable macOS Windows

一个boolean属性,决定用户是否可以手动关闭窗口。

在 Linux 上,setter 是无操作的,尽管 getter 返回true

win.movable macOS Windows

一个boolean属性,决定用户是否可以移动窗口。

在 Linux 上,setter 是无操作的,尽管 getter 返回true

win.excludedFromShownWindowsMenu macOS

一个 boolean属性,决定窗口是否从应用程序的窗口菜单中排除。 默认值为false`。

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

一个string属性,为辅助工具(如屏幕阅读器)提供的替代标题。 此字符串不直接对用户可见。

实例方法

使用new BaseWindow创建的对象具有以下实例方法:

注意:一些方法仅在特定操作系统上可用,并有相应的标签。

win.setContentView(view)

设置窗口的内容视图。

win.getContentView()

Returns View - The content view of the window.

win.destroy()

强制关闭窗口,不会为网页触发unloadbeforeunload事件,也不会为此窗口触发close事件,但保证会触发closed事件。

win.close()

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

win.focus()

聚焦于窗口

win.blur()

取消窗口的聚焦

win.isFocused()

返回boolean - 窗口是否聚焦。

win.isDestroyed()

返回boolean - 窗口是否被销毁。

win.show()

显示并聚焦于窗口

win.showInactive()

显示但不聚焦于窗口

win.hide()

隐藏窗口

win.isVisible()

返回boolean - 窗口是否在应用程序前台对用户可见。

win.isModal()

返回boolean - 当前窗口是否为模态窗口。

win.maximize()

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

win.unmaximize()

取消窗口最大化

win.isMaximized()

返回boolean - 窗口是否最大化。

win.minimize()

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

win.restore()

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

win.isMinimized()

返回boolean - 窗口是否最小化。

win.setFullScreen(flag)

  • flag boolean

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

注意:在 macOS 上,全屏转换是异步进行的。 If further actions depend on the fullscreen state, use the 'enter-full-screen' or 'leave-full-screen' events.

win.isFullScreen()

返回boolean - 窗口是否处于全屏模式。

win.setSimpleFullScreen(flag) macOS

  • flag boolean

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

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

win.isSimpleFullScreen() macOS

返回boolean - 窗口是否处于简单(Lion 之前的) 全屏模式。

win.isNormal()

返回boolean - 窗口是否处于正常状态(未最大化,未最小化,未处于全屏模式) 。

win.setAspectRatio(aspectRatio[, extraSize])

  • aspectRatio Float - 要保持的内容视图某部分的宽高比。
  • 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 }。 第二个参数不管网页中的额外的宽度和高度在什么位置, 只要它们存在就行. 在全部内部窗口中,加上任何额外的宽度和高度 。

当使用win.setSize等 API 以编程方式调整窗口大小时,不会遵循宽高比。

要重置长宽比,请将aspectRatio设置为 0:win.setAspectRatio(0)

win.setBackgroundColor(backgroundColor)

  • backgroundColor string - 颜色格式为 Hex、RGB、RGBA、HSL、HSLA 或命名的 CSS 颜色。 对于 Hex 类型,透明通道为可选的。

有效的backgroundColor值示例:

  • 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 - 要使用 QuickLook 预览的文件的绝对路径。 这很重要,因为 Quick Look 使用路径上的文件名和文件扩展名来确定要打开的文件类型。
  • displayName string (可选) - 要在 Quick Look 模态视图中显示的文件名称。 这仅是视觉上的,不影响文件的内容类型。 默认为 path.

使用 Quick Look 预览给定路径的文件。

win.closeFilePreview() macOS

关闭当前打开的 Quick Look 面板。

win.setBounds(bounds[, animate])

  • bounds Partial<Rectangle>
  • animate boolean (可选) macOS

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

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

// 设置所有边界属性
win.setBounds({ x: 440, y: 225, width: 800, height: 600 })

// 设置单个边界属性
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. 例如,使用托盘高度为 38 的情况下调用win.setBounds({ x: 25, y: 20, width: 800, height: 600 })将导致win.getBounds()返回{ x: 25, y: 38, width: 800, height: 600 }

win.getBackgroundColor()

返回string - 以 Hex (#RRGGBB) 格式获取窗口的背景颜色。

See Setting backgroundColor.

注意: Alpha 值不会与红色、绿色和蓝色值一起返回。

win.setContentBounds(bounds[, animate])

  • bounds Rectangle
  • animate boolean (可选) 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

注意: 无论窗口的当前状态如何:最大化、最小化或全屏,此函数始终返回窗口在正常状态下的位置和大小。 In normal state, getBounds and getNormalBounds returns the same Rectangle.

win.setEnabled(enable)

  • enable boolean

禁用或者启用窗口。

win.isEnabled()

返回 boolean - 窗口是否启用。

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

  • width Integer
  • height Integer
  • animate boolean (可选) macOS

调整窗口大小为widthheight。 如果widthheight低于任何设定的最小尺寸约束,窗口将对齐到约束的最小尺寸。

win.getSize()

返回 Integer [] - 包含窗口的宽度和高度。

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

  • width Integer
  • height Integer
  • animate boolean (可选) macOS

将窗口的工作区 (如网页) 大小调整为 widthheight

win.getContentSize()

返回 Integer[] - 包含窗口的宽度和高度。

win.setMinimumSize(width, height)

  • width Integer
  • height Integer

设置窗口的最小尺寸为widthheight

win.getMinimumSize()

返回 Integer[] - 包含窗口的最小宽度和高度。

win.setMaximumSize(width, height)

  • width Integer
  • height Integer

设置窗口的最大尺寸为widthheight

win.getMaximumSize()

返回 Integer[] - 包含窗口的最大宽度和高度。

win.setResizable(resizable)

  • resizable boolean

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

win.isResizable()

返回 boolean - 用户是否可以手动调整窗口大小。

win.setMovable(movable) macOS Windows

  • movable boolean

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

win.isMovable() macOS Windows

返回 boolean - 窗口是否可以被用户拖动

在 Linux 上总是返回true

win.setMinimizable(minimizable) macOS Windows

  • minimizable boolean

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

win.isMinimizable() macOS Windows

返回 boolean - 用户是否可以手动最小化窗口。

在 Linux 上总是返回true

win.setMaximizable(maximizable) macOS Windows

  • maximizable boolean

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

win.isMaximizable() macOS Windows

返回 boolean - 用户是否可以手动最大化窗口。

在 Linux 上总是返回true

win.setFullScreenable(fullscreenable)

  • fullscreenable boolean

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

win.isFullScreenable()

返回 boolean - 最大化/缩放窗口按钮是切换全屏模式还是最大化窗口。

win.setClosable(closable) macOS Windows

  • closable boolean

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

win.isClosable() macOS Windows

返回 boolean - 窗口是否可以被用户手动关闭。

在 Linux 上总是返回true

win.setHiddenInMissionControl(hidden) macOS

  • hidden boolean

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

win.isHiddenInMissionControl() macOS

返回 boolean - 当用户切换到任务控制时窗口是否会隐藏。

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

  • flag boolean
  • level string (可选) macOS Windows - 值包括 normal, floating, torn-off-menu, modal-panel, main-menu, status, pop-up-menu, screen-saver, 以及 dock (已弃用)。 默认值为floating (当 flag 为 true 时)。 当flag为false时,level会重置为normal。 请注意,包括从floatingstatus,窗口会被置于 macOS 上的 Dock 下方和 Windows 上的任务栏下方。 从 pop-up-menu 到更高级别,窗口显示在 macOS 上的Dock上方和 Windows 上的任务栏上方。 详情请参阅 macOS 文档
  • relativeLevel Integer (可选) macOS - 设置此窗口相对于给定level的层数。 默认值为0。 请注意, Apple 不鼓励在 屏幕保护程序 之上设置高于1的级别。

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

win.isAlwaysOnTop()

返回 boolean - 当前窗口是否始终在其它窗口之前。

win.moveAbove(mediaSourceId)

  • mediaSourceId string - DesktopCapturerSource格式的窗口 id 。 例如 "window:1869:0"。

将窗口按z轴顺序移动到源窗口前面。 如果mediaSourceId不是窗口类型或窗口不存在,则此方法会抛出错误。

win.moveTop()

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

win.center()

将窗口移动到屏幕中央。

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

  • x Integer
  • y Integer
  • animate boolean (可选) macOS

将窗口移动到xy

win.getPosition()

返回 Integer[] - 一个包含当前窗口位置的数组。

win.setTitle(title)

  • title string

将原生窗口的标题更改为title

win.getTitle()

返回 string - 原生窗口的标题。

注意:网页的标题可以与原生窗口的标题不同。

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)

History
  • flag boolean

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

win.setSkipTaskbar(skip) macOS Windows

  • skip boolean

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

win.setKiosk(flag)

  • flag boolean

进入或离开 kiosk 模式。

win.isKiosk()

返回 boolean - 判断窗口是否处于kiosk模式。

win.isTabletMode() Windows

返回 boolean - 当前窗口是否处于 Windows 10 平板模式

由于 Windows 10 用户可以 将 PC 用作平板电脑, 在此模式下,应用程序可以选择优化其 UI 以适应平板电脑,如扩展标题栏和隐藏标题栏按钮。

此 API 返回窗口是否在平板电脑模式下,并且 resize 事件可以用于监听对平板模式的更改。

win.getMediaSourceId()

返回 string - DesktopCapturerSource格式的窗口 id 。 例如 "window:1324:0"。

更确切地说,格式是 window:id:other_id。在Windows上 idHWND 类型;在macOS上是 CGWindowID (uint64_t);在Linux上是 Window (unsigned long)。 other_id 用于识别同一顶层窗口内的Web 内容 (选项卡)。

win.getNativeWindowHandle()

返回 Buffer - 窗口的平台特定句柄。

Windows上句柄类型为 HWND,macOS 上为 NSView*,Linux 上为Window (unsigned long)。

win.hookWindowMessage(message, callback) Windows

  • message Integer
  • callback Function
    • wParam Buffer - 提供给WndProcwParam
    • lParam Buffer - 提供给WndProclParam

钩住窗口消息。 当消息到达 WndProc 时调用callback

win.isWindowMessageHooked(message) Windows

  • message Integer

返回 boolean - truefalse ,具体取决于是否钩挂了消息。

win.unhookWindowMessage(message) Windows

  • message Integer

取消窗口信息的钩子。

win.unhookAllWindowMessages() Windows

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

win.setRepresentedFilename(filename) macOS

  • filename string

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

win.getRepresentedFilename() macOS

返回string - 获取窗口当前文件路径.

win.setDocumentEdited(edited) macOS

  • edited boolean

明确指出窗口文档是否可以编辑, 如果设置为true则将标题栏的图标变成灰色。

win.isDocumentEdited() macOS

返回boolean - 判断当前窗口文档是否可编辑.

win.setMenu(menu) Linux Windows

  • menu Menu | null

设置menu作为窗口的菜单栏。

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

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

将窗口的区域设置为在任务栏中悬停在窗口上方时显示的缩略图图像。 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. 默认值为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

设置窗口图标

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

在无框窗口中设置自定义控制按钮的位置。 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. 此方法只在 设备有触摸条时才生效。

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

win.setTitleBarOverlay(options) Windows Linux

  • options Object
    • 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.