BaseWindow¶
创建和控制窗口。
进程:主进程
[!NOTE]
BaseWindow提供了一种灵活的方式,在单个窗口中组合多个 web 视图。对于只有一个全尺寸 web 视图的窗口,BrowserWindow类可能是更简单的选择。
在 app 模块发出 ready 事件之前,不能使用此模块。
// 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 })
父窗口和子窗口¶
通过使用 parent 选项,可以创建子窗口:
const { BaseWindow } = require('electron')
const parent = new BaseWindow()
const child = new BaseWindow({ parent })
child 窗口将始终显示在 parent 窗口之上。
模态窗口¶
模态窗口是一个禁用父窗口的子窗口。要创建模态窗口,必须同时设置 parent 和 modal 选项:
const { BaseWindow } = require('electron')
const parent = new BaseWindow()
const child = new BaseWindow({ parent, modal: true })
平台说明¶
- 在 macOS 上,模态窗口将显示为附加到父窗口的 sheet。
- 在 macOS 上,当父窗口移动时,子窗口会保持相对于父窗口的位置;而在 Windows 和 Linux 上,子窗口不会移动。
- 在 Linux 上,模态窗口的类型会变为
dialog。 - 在 Linux 上,许多桌面环境不支持隐藏模态窗口。
资源管理¶
当你将一个 WebContentsView 添加到 BaseWindow,并且 BaseWindow
被关闭时,WebContentsView 的 webContents 不会自动销毁。
当你不再需要 webContents 时,有责任关闭它们,例如当 BaseWindow 被关闭时:
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()
})
与 BrowserWindow 不同,如果你没有显式关闭 webContents,将会遇到内存泄漏。
类:BaseWindow¶
创建和控制窗口。
进程:主进程
BaseWindow 是一个 EventEmitter。
它使用 options 中设置的属性创建一个新的 BaseWindow。
[!WARNING] Electron 的内置类不能在用户代码中被继承。 更多信息,请参阅 常见问题解答。
new BaseWindow([options])¶
optionsBaseWindowConstructorOptions(可选)
实例事件¶
使用 new BaseWindow 创建的对象会发出以下事件:
[!NOTE] 某些事件仅在特定操作系统上可用,并会相应标注。
事件:'close'¶
返回:
eventEvent
当窗口即将关闭时发出。它在 DOM 的 beforeunload 和 unload 事件之前发出。调用 event.preventDefault()
将取消关闭。
通常,你希望使用 beforeunload 处理程序来决定是否关闭窗口,该处理程序在窗口重新加载时也会被调用。在 Electron 中,返回除 undefined 以外的任何值都会取消关闭。例如:
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]
window.onbeforeunload = handler和window.addEventListener('beforeunload', handler)的行为之间存在细微差别。建议始终显式设置event.returnValue,而不是仅返回值,因为前者在 Electron 中表现更一致。
事件:'closed'¶
当窗口关闭时发出。收到此事件后,你应该移除对窗口的引用,并避免再使用它。
事件:'query-session-end' Windows¶
返回:
eventWindowSessionEndEvent
当会话由于关机、机器重启或用户注销而即将结束时发出。
调用 event.preventDefault() 可以延迟系统关机,但通常最好尊重用户结束会话的选择。然而,如果结束会话使用户面临丢失数据的风险,你可以选择使用它。
事件:'session-end' Windows¶
返回:
eventWindowSessionEndEvent
当会话由于关机、机器重启或用户注销而即将结束时发出。一旦此事件触发,就无法阻止会话结束。
事件:'blur'¶
返回:
eventEvent
当窗口失去焦点时发出。
事件:'focus'¶
返回:
eventEvent
当窗口获得焦点时发出。
事件:'show'¶
当窗口显示时发出。
事件:'hide'¶
当窗口隐藏时发出。
事件:'maximize'¶
当窗口最大化时发出。
事件:'unmaximize'¶
当窗口退出最大化状态时发出。
事件:'minimize'¶
当窗口最小化时发出。
[!NOTE] 在 Wayland 上,“最小化”目前不是受支持的状态。最小化事件仅在由客户端装饰触发时才会触发(例如,点击无边框窗口的窗口控制叠加层上的最小化按钮)
事件:'restore'¶
当窗口从最小化状态恢复时发出。
事件:'will-resize' macOS Windows¶
返回值:
eventEventnewBoundsRectangle - 窗口正在调整到的大小。detailsObjectedge(string) - 正在拖拽以调整大小的窗口边缘。可以是bottom、left、right、top-left、top-right、bottom-left或bottom-right。
在窗口调整大小之前发出。调用 event.preventDefault() 可阻止窗口被调整大小。
注意,此事件仅在窗口被手动调整大小时发出。使用 setBounds/setSize 调整窗口大小不会发出此事件。
edge 选项的可能值和行为因平台而异。可能的值为:
- 在 Windows 上,可能的值为
bottom、top、left、right、top-left、top-right、bottom-left、bottom-right。 - 在 macOS 上,可能的值为
bottom和right。 - 值
bottom用于表示垂直调整大小。 - 值
right用于表示水平调整大小。
事件:'resize'¶
在窗口调整大小之后发出。
事件:'resized' macOS Windows¶
当窗口完成调整大小时发出一次。
这通常在窗口被手动调整大小时发出。在 macOS 上,使用 setBounds/setSize 调整窗口大小并将 animate 参数设置为 true 时,也会在调整大小完成后发出此事件一次。
事件:'will-move' macOS Windows¶
返回值:
eventEventnewBoundsRectangle - 窗口正在移动到的位置。
在窗口移动之前发出。在 Windows 上,调用 event.preventDefault() 可阻止窗口被移动。
注意,此事件仅在窗口被手动移动时发出。使用 setPosition/setBounds/center 移动窗口不会发出此事件。
事件:'move'¶
当窗口正在移动到新位置时发出。
事件:'moved' macOS Windows¶
当窗口移动到新位置时发出一次。
[!NOTE] 在 macOS 上,此事件是
move的别名。
事件:'enter-full-screen'¶
当窗口进入全屏状态时发出。
事件:'leave-full-screen'¶
当窗口离开全屏状态时发出。
事件:'always-on-top-changed'¶
返回值:
eventEventisAlwaysOnTopboolean
当窗口被设置或取消设置为始终显示在其他窗口之上时发出。
事件:'app-command' Windows Linux¶
返回值:
eventEventcommandstring
当调用 App Command 时发出。这些通常与键盘媒体键或浏览器 命令相关,也与 Windows 上某些鼠标内置的“后退”按钮相关。
命令会被转换为小写,下划线会被替换为连字符,并且
APPCOMMAND_ 前缀会被移除。
例如,APPCOMMAND_BROWSER_BACKWARD 会作为 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-backwardbrowser-forward
事件:'swipe' macOS¶
返回值:
eventEventdirectionstring
在三指滑动时发出。可能的方向为 up、right、down、left。
此事件底层的方法旨在处理旧式 macOS 触控板滑动,
其中屏幕上的内容不会随滑动而移动。大多数 macOS 触控板不再
配置为允许这种滑动,因此为了使其正确发出,
System Preferences > Trackpad > More Gestures 中的 'Swipe between pages' 偏好设置必须
设置为 'Swipe with two or three fingers'。
事件:'rotate-gesture' macOS¶
返回值:
eventEventrotationFloat
在触控板旋转手势时发出。会持续发出,直到旋转手势
结束。每次发出时的 rotation 值是自上次发出以来旋转的度数。旋转手势最后一次发出的事件值始终为
0。逆时针旋转值为正,顺时针旋转值为
负。
事件:'sheet-begin' macOS¶
当窗口打开一个 sheet 时发出。
事件:'sheet-end' macOS¶
当窗口关闭一个 sheet 时发出。
事件:'new-window-for-tab' macOS¶
当用户点击原生 macOS 新标签按钮时发出。只有当前 BrowserWindow 具有
tabbingIdentifier 时,新标签按钮才可见。
必须在此处理程序中创建一个窗口,才能使 macOS 标签页功能按预期工作。
事件:'system-context-menu' Windows Linux¶
返回值:
eventEventpointPoint - 触发上下文菜单的屏幕坐标。
当在窗口上触发系统上下文菜单时发出,这
通常仅在用户右键点击窗口非客户区时触发。
这是窗口标题栏,或你在无边框窗口中声明为
-webkit-app-region: drag 的任何区域。
调用 event.preventDefault() 可阻止菜单显示。
要将 point 转换为 DIP,请使用 screen.screenToDipPoint(point)。
事件:'persisted-state-restored'¶
在持久化的窗口状态恢复后发出。
窗口状态包括窗口边界(x、y、height、width)和显示模式(maximized、fullscreen、kiosk)。
[!NOTE] 仅当在 BaseWindowConstructorOptions 或 BrowserWindowConstructorOptions 中启用 windowStatePersistence 时,才会发出此事件。
静态方法¶
BaseWindow 类具有以下静态方法:
BaseWindow.getAllWindows()¶
返回 BaseWindow[] - 所有已打开浏览器窗口的数组。
BaseWindow.getFocusedWindow()¶
返回 BaseWindow | null - 此应用中当前获得焦点的窗口,否则返回 null。
BaseWindow.fromId(id)¶
id整数
返回 BaseWindow | null - 具有给定 id 的窗口。
BaseWindow.clearPersistedState(name)¶
name字符串 - 要清除状态的窗口name(参见 BaseWindowConstructorOptions)。
清除具有给定名称的窗口的已保存状态。这会移除之前在启用 windowStatePersistence 时保存的所有已持久化窗口边界、显示模式和工作区域信息。
如果窗口 name 为空或窗口状态不存在,该方法将记录一条警告。
实例属性¶
使用 new BaseWindow 创建的对象具有以下属性:
const { BaseWindow } = require('electron')
// In this example `win` is our instance
const win = new BaseWindow({ width: 800, height: 600 })
win.id 只读¶
一个 Integer 属性,表示窗口的唯一 ID。每个 ID 在整个 Electron 应用的所有 BaseWindow 实例中都是唯一的。
win.contentView¶
一个 View 属性,表示窗口的内容视图。
win.tabbingIdentifier macOS 只读¶
一个 string(可选)属性,等于传递给 BrowserWindow 构造函数的 tabbingIdentifier,如果未设置则为 undefined。
win.autoHideMenuBar Linux Windows¶
一个 boolean 属性,确定窗口菜单栏是否应自动隐藏。设置后,菜单栏仅在用户单独按下 Alt 键时显示。
如果菜单栏已经可见,将此属性设置为 true 不会立即隐藏它。
win.simpleFullScreen¶
一个 boolean 属性,确定窗口是否处于简单(Lion 之前)全屏模式。
win.fullScreen¶
一个 boolean 属性,确定窗口是否处于全屏模式。
win.focusable Windows macOS¶
一个 boolean 属性,确定窗口是否可聚焦。
win.visibleOnAllWorkspaces macOS Linux¶
一个 boolean 属性,确定窗口是否在所有工作区上可见。
[!NOTE] 在 Windows 上始终返回 false。
win.shadow¶
一个 boolean 属性,确定窗口是否有阴影。
win.menuBarVisible Windows Linux¶
一个 boolean 属性,确定菜单栏是否应可见。
[!NOTE] 如果菜单栏为自动隐藏,用户仍可通过单独按下
Alt键调出菜单栏。
win.kiosk¶
一个 boolean 属性,确定窗口是否处于 kiosk 模式。
win.documentEdited macOS¶
一个 boolean 属性,指定窗口的文档是否已被编辑。
设置为 true 时,标题栏中的图标将变为灰色。
win.representedFilename macOS¶
一个 string 属性,确定窗口所表示文件的路径,并且该文件的图标将显示在窗口标题栏中。
win.title¶
一个 string 属性,确定原生窗口的标题。
[!NOTE] 网页的标题可能与原生窗口的标题不同。
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 属性,确定窗口是否从应用程序的 Windows 菜单中排除。默认为 false。
```js @ts-expect-error=[12] 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` {#win-accessibletitle}
一个 `string` 属性,定义仅提供给辅助功能工具(如屏幕阅读器)的替代标题。此字符串对用户不可直接可见。
#### `win.snapped` _Windows_ _只读_ {#win-snapped-windows-readonly}
一个 `boolean` 属性,指示窗口是否通过 [Snap.](https://support.microsoft.com/en-us/windows/snap-your-windows-885a9b1e-a983-a3b1-16cd-c531795e6241) 排列。
### 实例方法 {#instance-methods}
使用 `new BaseWindow` 创建的对象具有以下实例方法:
> [!NOTE]
> 某些方法仅在特定操作系统上可用,并会相应标注。
#### `win.setContentView(view)` {#win-setcontentview-view}
* `view` [View](view.md)
设置窗口的内容视图。
#### `win.getContentView()` {#win-getcontentview}
返回 [`View`](view.md) - 窗口的内容视图。
#### `win.destroy()` {#win-destroy}
强制关闭窗口,网页不会触发 `unload` 和 `beforeunload` 事件,此窗口也不会触发 `close` 事件,但保证会触发 `closed` 事件。
#### `win.close()` {#win-close}
尝试关闭窗口。其效果与用户手动点击窗口的关闭按钮相同。但网页可能会取消关闭。参见 [close 事件](#event-close)。
#### `win.focus()` {#win-focus}
聚焦到窗口。
#### `win.blur()` {#win-blur}
移除窗口的焦点。
#### `win.isFocused()` {#win-isfocused}
返回 `boolean` - 窗口是否处于聚焦状态。
#### `win.isDestroyed()` {#win-isdestroyed}
返回 `boolean` - 窗口是否已被销毁。
> [!NOTE]
> 一旦窗口被销毁,访问其大多数其他属性和方法都会抛出 `Object has been destroyed`,因此可能在窗口消失后运行的回调应使用 `isDestroyed()` 进行保护。
#### `win.show()` {#win-show}
显示窗口并使其获得焦点。
#### `win.showInactive()` {#win-showinactive}
显示窗口但不使其获得焦点。
#### `win.hide()` {#win-hide}
隐藏窗口。
#### `win.isVisible()` {#win-isvisible}
返回 `boolean` - 窗口是否对用户可见于应用前景。
#### `win.isModal()` {#win-ismodal}
返回 `boolean` - 当前窗口是否为模态窗口。
#### `win.maximize()` {#win-maximize}
最大化窗口。如果窗口尚未显示,这也会显示(但不聚焦)窗口。
#### `win.unmaximize()` {#win-unmaximize}
取消最大化窗口。
#### `win.isMaximized()` {#win-ismaximized}
返回 `boolean` - 窗口是否已最大化。
#### `win.minimize()` {#win-minimize}
最小化窗口。在某些平台上,最小化的窗口会显示在 Dock 中。
#### `win.restore()` {#win-restore}
将窗口从最小化状态恢复到其先前状态。
#### `win.isMinimized()` {#win-isminimized}
返回 `boolean` - 窗口是否已最小化。
#### `win.setFullScreen(flag)` {#win-setfullscreen-flag}
* `flag` boolean
设置窗口是否应处于全屏模式。
> [!NOTE]
> 在 macOS 上,全屏转换是异步发生的。如果后续操作依赖于全屏状态,请使用 ['enter-full-screen'](base-window.md#event-enter-full-screen) 或 > ['leave-full-screen'](base-window.md#event-leave-full-screen) 事件。
#### `win.isFullScreen()` {#win-isfullscreen}
返回 `boolean` - 窗口是否处于全屏模式。
#### `win.setSimpleFullScreen(flag)` _macOS_ {#win-setsimplefullscreen-flag-macos}
* `flag` boolean
进入或退出简单全屏模式。
简单全屏模式模拟了 Lion (10.7) 之前 macOS 版本中的原生全屏行为。
#### `win.isSimpleFullScreen()` _macOS_ {#win-issimplefullscreen-macos}
返回 `boolean` - 窗口是否处于简单(Lion 之前)全屏模式。
#### `win.isNormal()` {#win-isnormal}
返回 `boolean` - 窗口是否处于正常状态(未最大化、未最小化、未处于全屏模式)。
#### `win.setAspectRatio(aspectRatio[, extraSize])` {#win-setaspectratio-aspectratio-extrasize}
* `aspectRatio` Float - 需要为内容视图的某一部分保持的宽高比。
* `extraSize` [Size](structures/size.md) (optional) _macOS_ - 在保持宽高比时不应包含的额外大小。
这将使窗口保持一个宽高比。额外大小允许开发者拥有以像素为单位的空间,不包含在宽高比计算中。此 API 已经考虑了窗口大小和内容大小之间的差异。
考虑一个带有高清视频播放器及相关控件的普通窗口。也许左边缘有 15 像素的控件,右边缘有 25 像素的控件,播放器下方有 50 像素的控件。为了在播放器本身内保持 16:9 宽高比(HD @1920x1080 的标准宽高比),我们会以参数 16/9 和 \{ width: 40, height: 50 \} 调用此函数。第二个参数不关心额外宽度和高度在内容视图中的位置——只关心它们存在。将整体内容视图中所有额外宽度和高度区域相加。
当使用诸如 `win.setSize` 等 API 以编程方式调整窗口大小时,宽高比不会被遵守。
要重置宽高比,请将 0 作为 `aspectRatio` 值传递:`win.setAspectRatio(0)`。
#### `win.setBackgroundColor(backgroundColor)` {#win-setbackgroundcolor-backgroundcolor}
* `backgroundColor` string - 十六进制、RGB、RGBA、HSL、HSLA 或命名 CSS 颜色格式的颜色。对于十六进制类型,alpha 通道是可选的。
有效的 `backgroundColor` 值示例:
* 十六进制
* #fff(简写 RGB)
* #ffff(简写 ARGB)
* #ffffff(RGB)
* #ffffffff(ARGB)
* RGB
* `rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)`
* 例如 rgb(255, 255, 255)
* RGBA
* `rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)`
* 例如 rgba(255, 255, 255, 1.0)
* HSL
* `hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)`
* 例如 hsl(200, 20%, 50%)
* HSLA
* `hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)`
* 例如 hsla(200, 20%, 50%, 0.5)
* 颜色名称
* 选项列于 [SkParseColor.cpp](https://source.chromium.org/chromium/chromium/src/+/main:third_party/skia/src/utils/SkParseColor.cpp;l=11-152;drc=eea4bf52cb0d55e2a39c828b017c80a5ee054148)
* 类似于 CSS Color Module Level 3 关键字,但区分大小写。
* 例如 `blueviolet` 或 `red`
设置窗口的背景颜色。参见 [设置 `backgroundColor`](browser-window.md#setting-the-backgroundcolor-property)。
#### `win.previewFile(path[, displayName])` _macOS_ {#win-previewfile-path-displayname-macos}
* `path` string - 要使用 QuickLook 预览的文件的绝对路径。这很重要,因为 Quick Look 使用路径中的文件名和文件扩展名来确定要打开的文件的内容类型。
* `displayName` string (optional) - 要在 Quick Look 模态视图中显示的文件名称。这纯粹是视觉上的,不会影响文件的内容类型。默认为 `path`。
使用 [Quick Look][quick-look] 预览给定路径处的文件。
#### `win.closeFilePreview()` _macOS_ {#win-closefilepreview-macos}
关闭当前打开的 [Quick Look][quick-look] 面板。
#### `win.setBounds(bounds[, animate])` {#win-setbounds-bounds-animate}
* `bounds` Partial\<[Rectangle](structures/rectangle.md)\>
* `animate` boolean (optional) _macOS_
调整并移动窗口到提供的边界。未提供的任何属性都将默认为其当前值。
```js
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] 在 macOS 上,y 坐标值不能小于 Tray 高度。Tray 高度随时间变化并取决于操作系统,但介于 20-40px 之间。传入低于 Tray 高度的值会导致窗口与 Tray 齐平。
win.getBounds()¶
返回 Rectangle - 窗口的 bounds,类型为 Object。
[!NOTE] 在 macOS 上,返回的 y 坐标值最小为 Tray 高度。例如,在 Tray 高度为 38 时调用
win.setBounds({ x: 25, y: 20, width: 800, height: 600 }),则win.getBounds()将返回{ x: 25, y: 38, width: 800, height: 600 }。[!NOTE] 在 Wayland 上,由于禁止内省或以编程方式更改全局窗口坐标,此方法将返回
{ x: 0, y: 0, ... }。
win.getBackgroundColor()¶
返回 string - 以十六进制(#RRGGBB)格式获取窗口背景色。
[!NOTE] Alpha 值 不会 与红、绿、蓝值一起返回。
win.setContentBounds(bounds[, animate])¶
boundsRectangleanimateboolean(可选) macOS
调整并移动窗口的客户区(例如网页)到所提供的边界。
win.getContentBounds()¶
返回 Rectangle - 窗口客户区的 bounds,类型为 Object。
win.getNormalBounds()¶
返回 Rectangle - 包含正常状态下的窗口边界
[!NOTE] 无论窗口当前状态如何:最大化、最小化或全屏,此函数始终返回窗口在正常状态下的位置和大小。在正常状态下,getBounds 和 getNormalBounds 返回相同的
Rectangle。
win.setEnabled(enable)¶
enableboolean
禁用或启用窗口。
win.isEnabled()¶
返回 boolean - 窗口是否已启用。
win.setSize(width, height[, animate])¶
widthIntegerheightIntegeranimateboolean(可选) macOS
将窗口调整为 width 和 height。如果 width 或 height 低于已设置的最小尺寸约束,窗口将吸附到其最小尺寸。
win.getSize()¶
返回 Integer[] - 包含窗口的宽度和高度。
win.setContentSize(width, height[, animate])¶
widthIntegerheightIntegeranimateboolean(可选) macOS
将窗口的客户区(例如网页)调整为 width 和 height。
win.getContentSize()¶
返回 Integer[] - 包含窗口客户区的宽度和高度。
win.setMinimumSize(width, height)¶
widthIntegerheightInteger
将窗口最小尺寸设置为 width 和 height。
win.getMinimumSize()¶
返回 Integer[] - 包含窗口的最小宽度和高度。
win.setMaximumSize(width, height)¶
widthIntegerheightInteger
将窗口最大尺寸设置为 width 和 height。
win.getMaximumSize()¶
返回 Integer[] - 包含窗口的最大宽度和高度。
win.setResizable(resizable)¶
resizableboolean
设置窗口是否可由用户手动调整大小。
win.isResizable()¶
返回 boolean - 窗口是否可由用户手动调整大小。
win.setMovable(movable) macOS Windows¶
movableboolean
设置窗口是否可由用户移动。在 Linux 上不起作用。
win.isMovable() macOS Windows¶
返回 boolean - 窗口是否可由用户移动。
在 Linux 上始终返回 true。
win.setMinimizable(minimizable) macOS Windows¶
minimizableboolean
设置窗口是否可由用户手动最小化。在 Linux 上不起作用。
win.isMinimizable() macOS Windows¶
返回 boolean - 窗口是否可由用户手动最小化。
在 Linux 上始终返回 true。
win.setMaximizable(maximizable) macOS Windows¶
maximizableboolean
设置窗口是否可由用户手动最大化。在 Linux 上不起作用。
win.isMaximizable() macOS Windows¶
返回 boolean - 窗口是否可由用户手动最大化。
在 Linux 上始终返回 true。
win.setFullScreenable(fullscreenable)¶
fullscreenableboolean
设置最大化/缩放窗口按钮是切换全屏模式还是最大化窗口。
win.isFullScreenable()¶
返回 boolean - 最大化/缩放窗口按钮是切换全屏模式还是最大化窗口。
win.setClosable(closable) macOS Windows¶
closableboolean
设置窗口是否可由用户手动关闭。在 Linux 上不起作用。
win.isClosable() macOS Windows¶
返回 boolean - 窗口是否可由用户手动关闭。
在 Linux 上始终返回 true。
win.setHiddenInMissionControl(hidden) macOS¶
hiddenboolean
设置当用户切换到 Mission Control 时窗口是否隐藏。
win.isHiddenInMissionControl() macOS¶
返回 boolean - 当用户切换到 Mission Control 时窗口是否隐藏。
win.setAlwaysOnTop(flag[, level][, relativeLevel])¶
flagbooleanlevelstring(可选) macOS Windows - 值包括normal、floating、torn-off-menu、modal-panel、main-menu、status、pop-up-menu、screen-saver,以及 ~~dock~~(已弃用)。当flag为 true 时,默认值为floating。当 flag 为 false 时,level会重置为normal。请注意,从floating到status(包括两者),窗口 在 macOS 上位于 Dock 下方,在 Windows 上位于任务栏下方。从pop-up-menu到更高层级时,窗口在 macOS 上显示在 Dock 上方,在 Windows 上显示在 任务栏上方。有关更多详细信息,请参阅 macOS 文档。relativeLevelInteger(可选) macOS - 相对于给定level将此窗口设置高出的层数。默认值为0。请注意,Apple 不建议设置比screen-saver高 1 层以上的层级。
设置窗口是否应始终显示在其他窗口之上。设置后,窗口仍然是普通窗口,而不是无法获得焦点的工具箱窗口。
Wayland(Linux)不支持。
win.isAlwaysOnTop()¶
返回 boolean - 窗口是否始终位于其他窗口之上。
Wayland(Linux)不支持。
win.moveAbove(mediaSourceId)¶
mediaSourceIdstring - 窗口 id,格式为 DesktopCapturerSource 的 id。例如 "window:1869:0"。
在 z 轴顺序意义上将窗口移动到源窗口之上。如果 mediaSourceId 不是窗口类型,或者窗口不存在,则此方法会抛出错误。
win.moveTop()¶
无论是否获得焦点,都将窗口移动到顶部(z 轴顺序)。
win.center()¶
将窗口移动到屏幕中央。
win.setPosition(x, y[, animate])¶
xIntegeryIntegeranimateboolean (optional) macOS
将窗口移动到 x 和 y。
win.getPosition()¶
返回 Integer[] - 包含窗口当前位置。
[!NOTE] 在 Wayland 上,由于禁止内省或以编程方式更改全局窗口坐标,此方法将返回
[0, 0]。
win.setTitle(title)¶
titlestring
将原生窗口的标题更改为 title。
win.getTitle()¶
返回 string - 原生窗口的标题。
[!NOTE] 网页的标题可能与原生窗口的标题不同。
win.setSheetOffset(offsetY[, offsetX]) macOS¶
offsetYFloatoffsetXFloat (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)¶
<!--
``YAML history
added:
- pr-url: https://github.com/electron/electron/pull/35658
changes:
- pr-url: https://github.com/electron/electron/pull/41391
description: "window.flashFrame(bool)` will flash dock icon continuously on macOS"
breaking-changes-header: behavior-changed-windowflashframebool-will-flash-dock-icon-continuously-on-macos
-->
* `flag` boolean
开始或停止闪烁窗口以吸引用户注意。
#### `win.setSkipTaskbar(skip)` _macOS_ _Windows_ {#winsetskiptaskbarskip-macos-windows}
* `skip` boolean
使窗口不在任务栏中显示。
#### `win.setKiosk(flag)` {#winsetkioskflag}
* `flag` boolean
进入或退出 kiosk 模式。
#### `win.isKiosk()` {#winiskiosk}
返回 `boolean` - 窗口是否处于 kiosk 模式。
#### `win.isTabletMode()` _Windows_ {#winistabletmode-windows}
返回 `boolean` - 窗口是否处于 Windows 10 平板模式。
由于 Windows 10 用户可以[将电脑用作平板](https://support.microsoft.com/en-us/help/17210/windows-10-use-your-pc-like-a-tablet),
在此模式下,应用可以选择针对平板优化其 UI,例如
放大标题栏并隐藏标题栏按钮。
此 API 返回窗口是否处于平板模式,并且可以使用 `resize` 事件
监听平板模式的变化。
#### `win.getMediaSourceId()` {#wingetmediasourceid}
返回 `string` - 窗口 id,格式为 DesktopCapturerSource 的 id。例如 "window:1324:0"。
更准确地说,格式为 `window:id:other_id`,其中 `id` 在
Windows 上是 `HWND`,在 macOS 上是 `CGWindowID`(`uint64_t`),在
Linux 上是 `Window`(`unsigned long`)。`other_id` 用于标识同一
顶层窗口内的 web 内容(标签页)。
#### `win.getNativeWindowHandle()` {#wingetnativewindowhandle}
返回 `Buffer` - 窗口的平台特定句柄。
该句柄的原生类型在 Windows 上是 `HWND`,在 macOS 上是 `NSView*`,在
Linux 上是 `Window`(`unsigned long`)。
#### `win.hookWindowMessage(message, callback)` _Windows_ {#winhookwindowmessagemessage-callback-windows}
* `message` Integer
* `callback` Function
* `wParam` Buffer - 提供给 WndProc 的 `wParam`
* `lParam` Buffer - 提供给 WndProc 的 `lParam`
挂钩一个窗口消息。当在 WndProc 中接收到该消息时,会调用 `callback`。
#### `win.isWindowMessageHooked(message)` _Windows_ {#winiswindowmessagehookedmessage-windows}
* `message` Integer
返回 `boolean` - 根据消息是否已挂钩返回 `true` 或 `false`。
#### `win.unhookWindowMessage(message)` _Windows_ {#winunhookwindowmessagemessage-windows}
* `message` Integer
取消挂钩窗口消息。
#### `win.unhookAllWindowMessages()` _Windows_ {#winunhookallwindowmessages-windows}
取消挂钩所有窗口消息。
#### `win.setRepresentedFilename(filename)` _macOS_ {#winsetrepresentedfilenamefilename-macos}
* `filename` string
设置窗口所表示的文件的路径名,并且该文件的图标
将显示在窗口标题栏中。
#### `win.getRepresentedFilename()` _macOS_ {#wingetrepresentedfilename-macos}
返回 `string` - 窗口所表示的文件的路径名。
#### `win.setDocumentEdited(edited)` _macOS_ {#winsetdocumenteditededited-macos}
* `edited` boolean
指定窗口的文档是否已被编辑,当设置为 `true` 时,标题栏中的图标
将变为灰色。
#### `win.isDocumentEdited()` _macOS_ {#winisdocumentedited-macos}
返回 `boolean` - 窗口的文档是否已被编辑。
#### `win.setMenu(menu)` _Linux_ _Windows_ {#winsetmenumenu-linux-windows}
* `menu` Menu | null
将 `menu` 设置为窗口的菜单栏。
#### `win.removeMenu()` _Linux_ _Windows_ {#winremovemenu-linux-windows}
移除窗口的菜单栏。
#### `win.setProgressBar(progress[, options])` {#winsetprogressbarprogress-options}
* `progress` Double
* `options` Object (optional)
* `mode` string _Windows_ - 进度条的模式。可以是 `none`、`normal`、`indeterminate`、`error` 或 `paused`。
设置进度条中的进度值。有效范围是 \[0, 1.0]。
当进度 < 0 时移除进度条;
当进度 > 1 时切换为 indeterminate 模式。
在 Windows 上,可以传递一个 mode。可接受的值为 `none`、`normal`、
`indeterminate`、`error` 和 `paused`。如果你在不设置 mode 的情况下调用 `setProgressBar`
(但值在有效范围内),则假定使用 `normal`。
在 Linux 上,进度条显示在支持
LauncherEntry D-Bus API 的 dock 和任务栏上。它与应用的 `.desktop` 文件相关联,因此
[`app.setDesktopName`](app.md#appsetdesktopnamename-linux) 必须与应用的
实际 `.desktop` 文件的名称匹配。不支持 indeterminate 模式。
#### `win.setOverlayIcon(overlay, description)` _Windows_ {#win-setoverlayicon-overlay-description-windows}
* `overlay` [NativeImage](native-image.md) | null - 显示在任务栏图标右下角的图标。如果此参数为 `null`,则清除叠加图标
* `description` string - 将提供给辅助功能屏幕阅读器的描述
在当前任务栏图标上设置一个 16 x 16 像素的叠加图标,通常用于传达某种应用程序状态或被动地通知用户。
#### `win.invalidateShadow()` _macOS_ {#win-invalidateshadow-macos}
使窗口阴影失效,以便根据当前窗口形状重新计算。
在 macOS 上,透明的 `BaseWindow` 有时会留下视觉残留。例如,在执行动画时,可以使用此方法清除这些残留。
#### `win.setHasShadow(hasShadow)` {#win-sethasshadow-hasshadow}
* `hasShadow` boolean
设置窗口是否应带有阴影。
#### `win.hasShadow()` {#win-hasshadow}
返回 `boolean` - 窗口是否带有阴影。
#### `win.setOpacity(opacity)` _Windows_ _macOS_ {#win-setopacity-opacity-windows-macos}
* `opacity` number - 介于 0.0(完全透明)和 1.0(完全不透明)之间
设置窗口的不透明度。在 Linux 上,此方法不起作用。超出范围的数值会被限制在 \[0, 1] 范围内。
#### `win.getOpacity()` {#win-getopacity}
返回 `number` - 介于 0.0(完全透明)和 1.0(完全不透明)之间。在 Linux 上,始终返回 1。
#### `win.setShape(rects)` _Windows_ _Linux_ _Experimental_ {#win-setshape-rects-windows-linux-experimental}
* `rects` [Rectangle[]](structures/rectangle.md) - 为窗口设置形状。
传入空列表会将窗口恢复为矩形。
设置窗口形状会确定窗口内系统允许绘制和用户交互的区域。在给定区域之外,不会绘制任何像素,也不会注册鼠标事件。区域外的鼠标事件不会被该窗口接收,而是会传递到窗口后面的内容。
#### `win.setThumbarButtons(buttons)` _Windows_ {#win-setthumbarbuttons-buttons-windows}
* `buttons` [ThumbarButton[]](structures/thumbar-button.md)
返回 `boolean` - 按钮是否成功添加
在任务栏按钮布局中窗口的缩略图图像上添加一个带有指定按钮集的缩略图工具栏。返回一个 `boolean` 对象,指示缩略图是否已成功添加。
由于空间有限,缩略图工具栏中的按钮数量不应超过 7 个。一旦设置缩略图工具栏,由于平台限制,无法移除该工具栏。但你可以通过传入空数组来清除按钮。
`buttons` 是一个 `Button` 对象数组:
* `Button` Object
* `icon` [NativeImage](native-image.md) - 显示在缩略图工具栏中的图标。
* `click` Function
* `tooltip` string (optional) - 按钮工具提示的文本。
* `flags` string[] (optional) - 控制按钮的特定状态和行为。默认值为 `['enabled']`。
`flags` 是一个可以包含以下 `string` 的数组:
* `enabled` - 按钮处于活动状态,可供用户使用。
* `disabled` - 按钮已禁用。它存在,但具有表示不会响应用户操作的视觉状态。
* `dismissonclick` - 当按钮被点击时,缩略图窗口立即关闭。
* `nobackground` - 不绘制按钮边框,仅使用图像。
* `hidden` - 按钮不显示给用户。
* `noninteractive` - 按钮已启用但不可交互;不会绘制按下状态。此值用于按钮在通知中使用的场景。
#### `win.setThumbnailClip(region)` _Windows_ {#win-setthumbnailclip-region-windows}
* `region` [Rectangle](structures/rectangle.md) - 窗口区域
设置窗口中显示为缩略图图像的区域,该图像在任务栏中悬停窗口时显示。你可以通过指定空区域将缩略图重置为整个窗口:
`{ x: 0, y: 0, width: 0, height: 0 }`。
#### `win.setThumbnailToolTip(toolTip)` _Windows_ {#win-setthumbnailtooltip-tooltip-windows}
* `toolTip` string
设置当在任务栏中悬停窗口缩略图时显示的工具提示。
#### `win.setAppDetails(options)` _Windows_ {#win-setappdetails-options-windows}
* `options` Object
* `appId` string (optional) - 窗口的 [App User Model ID](https://learn.microsoft.com/en-us/windows/win32/shell/appids)。
必须设置此项,否则其他选项将不起作用。
* `appIconPath` string (optional) - 窗口的 [Relaunch Icon](https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-relaunchiconresource)。
* `appIconIndex` Integer (optional) - `appIconPath` 中图标的索引。
未设置 `appIconPath` 时忽略。默认值为 `0`。
* `relaunchCommand` string (optional) - 窗口的 [Relaunch Command](https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-relaunchcommand)。
* `relaunchDisplayName` string (optional) - 窗口的 [Relaunch Display Name](https://learn.microsoft.com/en-us/windows/win32/properties/props-system-appusermodel-relaunchdisplaynameresource)。
设置窗口任务栏按钮的属性。
> [!NOTE]
> `relaunchCommand` 和 `relaunchDisplayName` 必须始终一起设置。
> 如果其中一个属性未设置,则两者都不会使用。
#### `win.setAccentColor(accentColor)` _Windows_ {#win-setaccentcolor-accentcolor-windows}
* `accentColor` boolean | string | null - 窗口的强调色。默认情况下,遵循系统设置中的用户偏好。若要重置为系统默认值,请传入 `null`。
设置系统强调色和激活窗口边框的高亮显示。
`accentColor` 参数接受以下值:
* **颜色字符串** - 类似于 `true`,但使用标准 CSS 颜色格式(Hex、RGB、RGBA、HSL、HSLA 或命名颜色)设置自定义强调色。RGBA/HSLA 格式中的 Alpha 值会被忽略,颜色被视为完全不透明。
* **`true`** - 无论系统 `Settings.` 中是否为窗口启用强调色,都使用系统强调色为窗口启用强调色高亮显示。
* **`false`** - 无论系统设置中当前是否为窗口启用强调色,都禁用窗口的强调色高亮显示。
* **`null`** - 将窗口强调色行为重置为遵循系统设置中设置的行为。
示例:
```js
const win = new BrowserWindow({ frame: false })
// Set red accent color.
win.setAccentColor('#ff0000')
// RGB format (alpha ignored if present).
win.setAccentColor('rgba(255,0,0,0.5)')
// Enable accent color, using the color specified in System Settings.
win.setAccentColor(true)
// Disable accent color.
win.setAccentColor(false)
// Reset window accent color behavior to follow behavior set in System Settings.
win.setAccentColor(null)
win.getAccentColor() Windows¶
返回 string | boolean - 活动窗口边框的系统强调色和高亮,采用 Hex RGB 格式。
如果已为窗口设置了与系统强调色不同的颜色,则返回窗口强调色。否则,将返回布尔值,其中 true 表示窗口使用全局系统强调色,false 表示已为此窗口禁用强调色高亮。
win.setIcon(icon) Windows Linux¶
iconNativeImage | string
更改窗口图标。
win.setWindowButtonVisibility(visible) macOS¶
visibleboolean
设置是否应显示窗口的红绿灯按钮。
win.setAutoHideMenuBar(hide) Windows Linux¶
hideboolean
设置窗口菜单栏是否应自动隐藏。设置后,菜单栏仅在用户按下单独的 Alt 键时显示。
如果菜单栏已经可见,调用 setAutoHideMenuBar(true) 不会立即隐藏它。
win.isMenuBarAutoHide() Windows Linux¶
返回 boolean - 菜单栏是否自动隐藏。
win.setMenuBarVisibility(visible) Windows Linux¶
visibleboolean
设置菜单栏是否应可见。如果菜单栏处于自动隐藏状态,用户仍可通过按下单独的 Alt 键调出菜单栏。
win.isMenuBarVisible() Windows Linux¶
返回 boolean - 菜单栏是否可见。
win.isSnapped() Windows¶
返回 boolean - 窗口是否通过 Snap. 排列。
当鼠标悬停在窗口最大化按钮上时,会显示按钮,可通过这些按钮将窗口吸附;也可以将窗口拖到屏幕边缘来实现吸附。
win.setVisibleOnAllWorkspaces(visible[, options]) macOS Linux¶
visiblebooleanoptionsObject(可选)visibleOnFullScreenboolean(可选) macOS - 设置窗口是否应显示在全屏窗口之上。skipTransformProcessTypeboolean(可选) macOS - 调用 setVisibleOnAllWorkspaces 默认会在 UIElementApplication 和 ForegroundApplication 之间转换进程类型,以确保正确行为。但是,每次调用时都会短暂隐藏窗口和 Dock。如果你的窗口已经是 UIElementApplication 类型,可以通过向 skipTransformProcessType 传递 true 来绕过此转换。
设置窗口是否应在所有工作区中可见。
[!NOTE] 此 API 在 Windows 上不起作用。
win.isVisibleOnAllWorkspaces() macOS Linux¶
返回 boolean - 窗口是否在所有工作区中可见。
[!NOTE] 此 API 在 Windows 上始终返回 false。
win.setIgnoreMouseEvents(ignore[, options])¶
ignorebooleanoptionsObject(可选)forwardboolean(可选) macOS Windows - 如果为 true,则将鼠标移动消息转发给 Chromium,从而启用诸如mouseleave之类的鼠标相关事件。仅在ignore为 true 时使用。如果ignore为 false,则无论此值如何,转发始终被禁用。
使窗口忽略所有鼠标事件。
发生在此窗口中的所有鼠标事件都会传递到该窗口下方的窗口,但如果此窗口具有焦点,它仍会接收键盘事件。
win.setContentProtection(enable) macOS Windows¶
enableboolean
防止窗口内容被其他应用捕获。
在 macOS 上,它将 NSWindow 的 sharingType 设置为 NSWindowSharingNone。
在 Windows 上,它使用 WDA_EXCLUDEFROMCAPTURE 调用 SetWindowDisplayAffinity。
对于 Windows 10 版本 2004 及更高版本,窗口将完全从捕获中移除;旧版 Windows 的行为类似于应用了 WDA_MONITOR,捕获到一个黑色窗口。
win.isContentProtected() macOS Windows¶
返回 boolean - 内容保护当前是否已启用。
win.setFocusable(focusable) macOS Windows¶
focusableboolean
更改窗口是否可以聚焦。
在 macOS 上,它不会从窗口移除焦点。
win.isFocusable() macOS Windows¶
返回 boolean - 窗口是否可以聚焦。
win.setParentWindow(parent)¶
parentBaseWindow | null
将 parent 设置为当前窗口的父窗口,传递 null 会将当前窗口变为顶级窗口。
win.getParentWindow()¶
返回 BaseWindow | null - 父窗口,如果没有父窗口则为 null。
win.getChildWindows()¶
返回 BaseWindow[] - 所有子窗口。
win.setAutoHideCursor(autoHide) macOS¶
autoHideboolean
控制输入时是否隐藏光标。
win.selectPreviousTab() macOS¶
当启用原生标签页且窗口中还有其他标签页时,选择上一个标签页。
win.selectNextTab() macOS¶
当启用原生标签页且窗口中还有其他标签页时,选择下一个标签页。
win.showAllTabs() macOS¶
当启用原生标签页时,显示或隐藏标签页概览。
win.mergeAllWindows() macOS¶
当启用原生标签页且打开的窗口多于一个时,将所有窗口合并为一个具有多个标签页的窗口。
win.moveTabToNewWindow() macOS¶
如果启用原生标签页且当前窗口中有一个以上的标签页,则将当前标签页移动到新窗口。
win.toggleTabBar() macOS¶
如果启用原生标签页且当前窗口中只有一个标签页,则切换标签栏的可见性。
win.addTabbedWindow(baseWindow) macOS¶
baseWindowBaseWindow
将一个窗口作为选项卡添加到当前窗口,位于该窗口实例的选项卡之后。
win.setVibrancy(type) macOS¶
typestring | null - 可以是titlebar、selection、menu、popover、sidebar、header、sheet、window、hud、fullscreen-ui、tooltip、content、under-window或under-page。有关更多详细信息,请参阅 macOS 文档。
为窗口添加透明效果。传入 null 或空字符串
将移除窗口上的透明效果。
win.setBackgroundMaterial(material) Windows¶
materialstringauto- 让桌面窗口管理器(DWM)自动决定此窗口的系统绘制背景材质。这是默认值。none- 不绘制任何系统背景。mica- 绘制对应于长生命周期窗口的背景材质效果。acrylic- 绘制对应于临时窗口的背景材质效果。tabbed- 绘制对应于具有选项卡标题栏的窗口的背景材质效果。
此方法设置浏览器窗口的系统绘制背景材质,包括非客户区后方。
有关更多详细信息,请参阅 Windows 文档。
[!NOTE] 此方法仅支持 Windows 11 22H2 及更高版本。
win.setWindowButtonPosition(position) macOS¶
positionPoint | null
为无边框窗口中的红绿灯按钮设置自定义位置。
传入 null 会将位置重置为默认值。
win.getWindowButtonPosition() macOS¶
返回 Point | null - 无边框窗口中红绿灯按钮的自定义位置,如果没有自定义位置,则返回 null。
win.setTouchBar(touchBar) macOS¶
touchBarTouchBar | null
为当前窗口设置 touchBar 布局。指定 null 或
undefined 会清除触控栏。仅当机器具有触控栏时,此方法才会生效。
[!NOTE] TouchBar API 目前为实验性,可能会在未来 Electron 版本中更改或移除。
win.setTitleBarOverlay(options) Windows Linux¶
optionsObjectcolorString(可选)- 启用时窗口控件叠加层的 CSS 颜色。symbolColorString(可选)- 启用时窗口控件叠加层上符号的 CSS 颜色。heightInteger(可选)- 标题栏和窗口控件叠加层的高度(以像素为单位)。
对于已启用窗口控件叠加层的窗口,此方法会更新标题栏叠加层的样式。
在 Linux 上,如果未显式设置 symbolColor,则会自动计算其与 color 的最小可访问对比度。
本页原文 Markdown:在 AtomGit 查看·内容源自开源项目 el/electron