BaseWindow
建立和控制視窗。
處理序:主處理序
注意
BaseWindow
提供一種彈性的方式,在單一視窗中組合多個網頁檢視。對於只有單一、全尺寸網頁檢視的視窗,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://electron.dev.org.tw')
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 上,模式視窗會顯示為附加到父視窗的工作表。
- 在 macOS 上,當父視窗移動時,子視窗會保持相對於父視窗的位置,而在 Windows 和 Linux 上,子視窗則不會移動。
- 在 Linux 上,模式視窗的類型會變更為
dialog
。 - 在 Linux 上,許多桌面環境不支援隱藏模式視窗。
資源管理
當您將 WebContentsView
新增至 BaseWindow
且 BaseWindow
關閉時,WebContents
的 WebContentsView
並不會自動銷毀。
您有責任在不再需要它們時關閉 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。
它會建立一個新的 BaseWindow
,其原生屬性由 options
設定。
new BaseWindow([options])
執行個體事件
以 new BaseWindow
建立的物件會發出以下事件
注意:某些事件僅在特定的作業系統上可用,並會標示出來。
事件:'close'
傳回
event
事件
當視窗即將關閉時發出。它會在 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
}
注意: window.onbeforeunload = handler
和 window.addEventListener('beforeunload', handler)
的行為之間存在細微差異。建議一律明確設定 event.returnValue
,而不僅僅是傳回值,因為前者在 Electron 中的運作方式更加一致。
事件:'closed'
當視窗關閉時發出。在您收到此事件後,您應該移除對視窗的參考,並避免再使用它。
事件:'session-end' Windows
當視窗工作階段由於強制關機或機器重新啟動或工作階段登出而即將結束時發出。
事件:'blur'
傳回
event
事件
當視窗失去焦點時發出。
事件:'focus'
傳回
event
事件
當視窗獲得焦點時發出。
事件:'show'
當視窗顯示時發出。
事件:'hide'
當視窗隱藏時發出。
事件:'maximize'
當視窗最大化時發出。
事件:'unmaximize'
當視窗從最大化狀態退出時發出。
事件:'minimize'
當視窗最小化時發出。
事件:'restore'
當視窗從最小化狀態還原時發出。
事件:'will-resize' macOS Windows
傳回
event
事件newBounds
矩形 - 視窗正在調整到的尺寸。details
物件edge
(字串) - 拖曳以調整大小的視窗邊緣。可以是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
傳回
event
事件newBounds
Rectangle - 視窗將被移動到的位置。
在視窗被移動之前發出。在 Windows 上,呼叫 event.preventDefault()
將會阻止視窗被移動。
請注意,這僅在視窗被手動移動時發出。使用 setPosition
/setBounds
/center
移動視窗將不會發出此事件。
事件:'move'
當視窗被移動到新位置時發出。
事件:'moved' macOS Windows
當視窗被移動到新位置時,只發出一次。
注意:在 macOS 上,此事件是 move
的別名。
事件:'enter-full-screen'
當視窗進入全螢幕狀態時發出。
事件:'leave-full-screen'
當視窗離開全螢幕狀態時發出。
事件:'always-on-top-changed'
傳回
event
事件isAlwaysOnTop
布林值
當視窗被設定或取消設定為永遠顯示在其他視窗之上時發出。
事件:'app-command' Windows Linux
傳回
event
事件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-backward
browser-forward
事件:'swipe' macOS
傳回
event
事件direction
字串
在三指滑動時發出。可能的方向為 up
、right
、down
、left
。
此事件的底層方法旨在處理較舊的 macOS 風格觸控板滑動,螢幕上的內容不會隨著滑動而移動。大多數 macOS 觸控板不再配置為允許這種滑動,因此為了使其正常發出,必須將「系統偏好設定 > 觸控板 > 更多手勢」中的「在頁面之間滑動」偏好設定為「使用兩指或三指滑動」。
事件:'rotate-gesture' macOS
傳回
event
事件rotation
浮點數
在觸控板旋轉手勢時發出。持續發出直到旋轉手勢結束。每次發出時的 rotation
值是自上次發出以來旋轉的角度(以度為單位)。旋轉手勢結束時最後發出的事件值始終為 0
。逆時針旋轉值為正數,而順時針旋轉值為負數。
事件:'sheet-begin' macOS
當視窗開啟一個表單時發出。
事件:'sheet-end' macOS
當視窗關閉一個表單時發出。
事件:'new-window-for-tab' macOS
當點擊原生新增分頁按鈕時發出。
事件:'system-context-menu' Windows
傳回
event
事件point
Point - 觸發快顯功能表的螢幕座標
當在視窗上觸發系統快顯功能表時發出,這通常只在使用者右鍵點擊視窗的非客戶端區域時觸發。這是視窗標題列或任何您在無邊框視窗中宣告為 -webkit-app-region: drag
的區域。
呼叫 event.preventDefault()
將會阻止顯示功能表。
靜態方法
BaseWindow
類別具有以下靜態方法
BaseWindow.getAllWindows()
返回 BaseWindow[]
- 所有已開啟的瀏覽器視窗的陣列。
BaseWindow.getFocusedWindow()
返回 BaseWindow | null
- 此應用程式中具有焦點的視窗,否則返回 null
。
BaseWindow.fromId(id)
id
整數
返回 BaseWindow | null
- 具有給定 id
的視窗。
實例屬性
使用 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
一個 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 是一個空操作(no-op),儘管 getter 會回傳 true
。
win.maximizable
macOS Windows
一個 boolean
屬性,用於決定視窗是否可由使用者手動最大化。
在 Linux 上,setter 是一個空操作(no-op),儘管 getter 會回傳 true
。
win.fullScreenable
一個 boolean
屬性,用於決定最大化/縮放視窗按鈕是切換為全螢幕模式還是最大化視窗。
win.resizable
一個 boolean
屬性,用於決定視窗是否可由使用者手動調整大小。
win.closable
macOS Windows
一個 boolean
屬性,用於決定視窗是否可由使用者手動關閉。
在 Linux 上,setter 是一個空操作(no-op),儘管 getter 會回傳 true
。
win.movable
macOS Windows
一個 boolean
屬性,用於決定視窗是否可由使用者移動。
在 Linux 上,setter 是一個空操作(no-op),儘管 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)
view
View
設定視窗的內容視圖。
win.getContentView()
回傳 View - 視窗的內容視圖。
win.destroy()
強制關閉視窗,網頁的 unload
和 beforeunload
事件不會被觸發,且此視窗也不會觸發 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 上,全螢幕轉換會以非同步方式進行。如果後續動作依賴於全螢幕狀態,請使用 'enter-full-screen' 或 'leave-full-screen' 事件。
win.isFullScreen()
回傳 boolean
- 指示視窗是否處於全螢幕模式。
win.setSimpleFullScreen(flag)
macOS
flag
boolean
進入或離開簡易全螢幕模式。
簡易全螢幕模式會模擬 macOS Lion (10.7) 之前版本中找到的原生全螢幕行為。
win.isSimpleFullScreen()
macOS
回傳 boolean
- 指示視窗是否處於簡易(Lion 之前)全螢幕模式。
win.isNormal()
回傳 boolean
- 指示視窗是否處於正常狀態(未最大化、未最小化、未處於全螢幕模式)。
win.setAspectRatio(aspectRatio[, extraSize])
aspectRatio
Float - 要為內容視圖的某個部分維持的長寬比。extraSize
Size (選用) macOS - 在維持長寬比時不包含的額外大小。
這會讓視窗維持長寬比。額外大小允許開發人員擁有以像素指定的空間,而該空間不包含在長寬比計算中。此 API 已經考慮到視窗大小與其內容大小之間的差異。
假設一個普通的視窗具有高清視訊播放器和相關控制項。左邊緣可能會有 15 個像素的控制項,右邊緣會有 25 個像素的控制項,且播放器下方會有 50 個像素的控制項。為了在播放器本身中維持 16:9 的長寬比(高清 @1920x1080 的標準長寬比),我們將使用 16/9 和 { width: 40, height: 50 } 作為引數呼叫此函式。第二個引數不在乎額外的寬度和高度在內容視圖中的哪個位置,而只在乎它們是否存在。加總您在整個內容視圖中擁有的任何額外寬度和高度區域。
當使用 win.setSize
等 API 以程式設計方式調整視窗大小時,長寬比不會被採納。
若要重設長寬比,請將 0 作為 aspectRatio
值傳遞:win.setAspectRatio(0)
。
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
- 類似於 CSS 顏色模組層級 3 關鍵字,但區分大小寫。
- 例如
blueviolet
或red
- 例如
設定視窗的背景顏色。請參閱 設定 backgroundColor
。
win.previewFile(path[, displayName])
macOS
path
string - 使用 QuickLook 預覽檔案的絕對路徑。這很重要,因為 Quick Look 使用路徑上的檔案名稱和副檔名來決定要開啟的檔案內容類型。displayName
string (選用) - 要在 Quick Look 模態視圖上顯示的檔案名稱。這純粹是視覺上的,並不會影響檔案的內容類型。預設值為path
。
使用 Quick Look 預覽給定路徑的檔案。
win.closeFilePreview()
macOS
關閉目前開啟的 快速查看 面板。
win.setBounds(bounds[, animate])
bounds
Partial<Rectangle>animate
boolean (選填) 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())
注意: 在 macOS 上,y 座標的值不能小於Tray的高度。Tray 的高度會隨著時間而改變,並且取決於作業系統,但介於 20-40px 之間。傳遞低於 Tray 高度的值將會使視窗與 Tray 對齊。
win.getBounds()
返回 Rectangle - 視窗的 bounds
作為 Object
。
注意: 在 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 }
。
win.getBackgroundColor()
返回 string
- 以十六進位 (#RRGGBB
) 格式取得視窗的背景顏色。
請參閱 設定 backgroundColor
。
注意: Alpha 值不會與紅色、綠色和藍色值一起返回。
win.setContentBounds(bounds[, animate])
bounds
Rectangleanimate
boolean (選填) macOS
調整視窗的客戶端區域(例如,網頁)的大小並將其移動到提供的邊界。
win.getContentBounds()
返回 Rectangle - 視窗客戶端區域的 bounds
作為 Object
。
win.getNormalBounds()
返回 Rectangle - 包含視窗正常狀態的邊界
注意: 無論視窗的目前狀態如何:最大化、最小化或全螢幕,此函式始終返回視窗在正常狀態下的位置和大小。在正常狀態下,getBounds 和 getNormalBounds 返回相同的 Rectangle。
win.setEnabled(enable)
enable
boolean
停用或啟用視窗。
win.isEnabled()
返回 boolean
- 視窗是否已啟用。
win.setSize(width, height[, animate])
width
Integerheight
Integeranimate
boolean (選填) macOS
將視窗調整為 width
和 height
。如果 width
或 height
低於任何設定的最小尺寸限制,則視窗將會貼齊其最小尺寸。
win.getSize()
返回 Integer[]
- 包含視窗的寬度和高度。
win.setContentSize(width, height[, animate])
width
Integerheight
Integeranimate
boolean (選填) macOS
將視窗的客戶端區域(例如,網頁)調整為 width
和 height
。
win.getContentSize()
返回 Integer[]
- 包含視窗客戶端區域的寬度和高度。
win.setMinimumSize(width, height)
width
Integerheight
Integer
將視窗的最小尺寸設定為 width
和 height
。
win.getMinimumSize()
返回 Integer[]
- 包含視窗的最小寬度和高度。
win.setMaximumSize(width, height)
width
Integerheight
Integer
將視窗的最大尺寸設定為 width
和 height
。
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
設定當使用者切換到任務控制時,視窗是否會隱藏。
win.isHiddenInMissionControl()
macOS
返回 boolean
- 當使用者切換到任務控制時,視窗是否會隱藏。
win.setAlwaysOnTop(flag[, level][, relativeLevel])
flag
booleanlevel
string (選填) 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 文件。relativeLevel
Integer (選填) macOS - 相對於給定的level
,此視窗要設定的更高層數。預設值為0
。請注意,Apple 不建議設定高於screen-saver
1 層以上的層級。
設定視窗是否應始終顯示在其他視窗的頂端。設定此選項後,視窗仍然是普通視窗,而不是無法聚焦的工具箱視窗。
win.isAlwaysOnTop()
傳回 boolean
- 表示視窗是否始終在其他視窗的頂端。
win.moveAbove(mediaSourceId)
mediaSourceId
字串 - 視窗 ID,格式為 DesktopCapturerSource 的 ID。例如 "window:1869:0"。
在 Z 軸順序上將視窗移動到來源視窗之上。如果 mediaSourceId
不是視窗類型,或者如果該視窗不存在,則此方法會擲回錯誤。
win.moveTop()
將視窗移動到頂端 (Z 軸順序),無論是否聚焦。
win.center()
將視窗移動到螢幕中心。
win.setPosition(x, y[, animate])
x
整數y
整數animate
boolean (選填) macOS
將視窗移動到 x
和 y
的位置。
win.getPosition()
傳回 Integer[]
- 包含視窗的目前位置。
win.setTitle(title)
title
字串
將原生視窗的標題變更為 title
。
win.getTitle()
傳回 string
- 原生視窗的標題。
注意: 網頁的標題可能與原生視窗的標題不同。
win.setSheetOffset(offsetY[, offsetX])
macOS
offsetY
浮點數offsetX
浮點數 (選用)
變更 macOS 上工作表的附加點。預設情況下,工作表會附加在視窗框架的正下方,但您可能希望將它們顯示在 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
布林值
使視窗不會顯示在工作列中。
win.setKiosk(flag)
flag
boolean
進入或離開資訊站模式。
win.isKiosk()
傳回 boolean
- 表示視窗是否處於資訊站模式。
win.isTabletMode()
Windows
傳回 boolean
- 表示視窗是否處於 Windows 10 平板電腦模式。
由於 Windows 10 使用者可以將他們的 PC 當作平板電腦使用,在此模式下,應用程式可以選擇針對平板電腦優化其 UI,例如放大標題列並隱藏標題列按鈕。
此 API 會傳回視窗是否處於平板電腦模式,而 resize
事件可用於監聽平板電腦模式的變更。
win.getMediaSourceId()
傳回 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()
傳回 Buffer
- 視窗的平台特定控制代碼。
控制代碼的原生類型在 Windows 上是 HWND
,在 macOS 上是 NSView*
,在 Linux 上是 Window
(unsigned long
)。
win.hookWindowMessage(message, callback)
Windows
message
整數callback
函式wParam
緩衝區 - 提供給 WndProc 的wParam
lParam
緩衝區 - 提供給 WndProc 的lParam
攔截 Windows 訊息。當訊息在 WndProc 中收到時,會呼叫 callback
。
win.isWindowMessageHooked(message)
Windows
message
整數
傳回 boolean
- 根據訊息是否被攔截,傳回 true
或 false
。
win.unhookWindowMessage(message)
Windows
message
整數
取消攔截視窗訊息。
win.unhookAllWindowMessages()
Windows
取消攔截所有視窗訊息。
win.setRepresentedFilename(filename)
macOS
filename
字串
設定視窗所代表的檔案路徑名稱,檔案的圖示將會顯示在視窗的標題列中。
win.getRepresentedFilename()
macOS
傳回 string
- 視窗所代表的檔案路徑名稱。
win.setDocumentEdited(edited)
macOS
edited
布林值
指定視窗的文件是否已編輯,當設定為 true
時,標題列中的圖示會變成灰色。
win.isDocumentEdited()
macOS
傳回 boolean
- 表示視窗的文件是否已編輯。
win.setMenu(menu)
Linux Windows
menu
Menu | null
將 menu
設定為視窗的選單列。
win.removeMenu()
Linux Windows
移除視窗的選單列。
win.setProgressBar(progress[, options])
progress
倍精度浮點數
在進度列中設定進度值。有效範圍為 [0, 1.0]。
當進度 < 0 時移除進度列;當進度 > 1 時變更為不確定模式。
在 Linux 平台上,僅支援 Unity 桌面環境,您需要在 package.json
中的 desktopName
欄位中指定 *.desktop
檔案名稱。預設情況下,它會假設為 {app.name}.desktop
。
在 Windows 上,可以傳遞模式。可接受的值為 none
、normal
、indeterminate
、error
和 paused
。如果您在未設定模式的情況下呼叫 setProgressBar
(但值在有效範圍內),則會假設為 normal
。
win.setOverlayIcon(overlay, description)
Windows
overlay
NativeImage | null - 要顯示在工作列圖示右下角的圖示。如果此參數為null
,則會清除覆蓋圖示description
字串 - 將提供給協助工具螢幕閱讀器的描述
將 16 x 16 像素的覆蓋圖示設定到目前的工作列圖示上,通常用於傳達某種應用程式狀態或被動通知使用者。
win.invalidateShadow()
macOS
使視窗陰影失效,以便根據目前的視窗形狀重新計算。
透明的 BaseWindow
有時會在 macOS 上留下視覺假影。當執行動畫時,可以使用此方法來清除這些假影。
win.setHasShadow(hasShadow)
hasShadow
boolean
設定視窗是否應具有陰影。
win.hasShadow()
回傳 boolean
- 視窗是否具有陰影。
win.setOpacity(opacity)
Windows macOS
opacity
number - 介於 0.0 (完全透明) 和 1.0 (完全不透明) 之間
設定視窗的不透明度。在 Linux 上,此操作無效。超出範圍的數值會被限制在 [0, 1] 範圍內。
win.getOpacity()
回傳 number
- 介於 0.0 (完全透明) 和 1.0 (完全不透明) 之間。在 Linux 上,永遠回傳 1。
win.setShape(rects)
Windows Linux 實驗性
rects
Rectangle[] - 在視窗上設定形狀。傳遞空列表會將視窗還原為矩形。
設定視窗形狀會決定系統允許繪製和使用者互動的視窗範圍。在給定區域之外,不會繪製任何像素,也不會註冊任何滑鼠事件。區域外的滑鼠事件不會被該視窗接收,而是會傳遞到視窗後方的任何內容。
win.setThumbarButtons(buttons)
Windows
buttons
ThumbarButton[]
回傳 boolean
- 是否成功添加按鈕
在工作列按鈕佈局中,將具有指定按鈕集的縮圖工具列新增至視窗的縮圖影像。回傳 boolean
物件,表示是否已成功新增縮圖。
由於空間有限,縮圖工具列中的按鈕數量不應超過 7 個。一旦設定縮圖工具列,由於平台的限制,工具列將無法移除。但是,您可以使用空陣列呼叫 API 來清除按鈕。
buttons
是 Button
物件的陣列
Button
物件icon
NativeImage - 縮圖工具列中顯示的圖示。click
Functiontooltip
string (選用) - 按鈕工具提示的文字。flags
string[] (選用) - 控制按鈕的特定狀態和行為。預設為['enabled']
。
flags
是一個陣列,可以包含下列 string
enabled
- 按鈕處於活動狀態且可供使用者使用。disabled
- 按鈕已停用。它存在,但具有視覺狀態,表示它不會回應使用者動作。dismissonclick
- 按一下按鈕時,縮圖視窗會立即關閉。nobackground
- 不繪製按鈕邊框,僅使用影像。hidden
- 不向使用者顯示按鈕。noninteractive
- 按鈕已啟用但不可互動;不會繪製按下按鈕的狀態。此值適用於在通知中使用按鈕的情況。
win.setThumbnailClip(region)
Windows
region
Rectangle - 視窗的區域
設定當滑鼠游標停留在工作列中的視窗上方時,要顯示為縮圖影像的視窗區域。您可以透過指定空區域來重設縮圖以顯示整個視窗:{ x: 0, y: 0, width: 0, height: 0 }
。
win.setThumbnailToolTip(toolTip)
Windows
toolTip
string
設定滑鼠游標停留在工作列中的視窗縮圖上方時顯示的工具提示。
win.setAppDetails(options)
Windows
設定視窗工作列按鈕的屬性。
注意: relaunchCommand
和 relaunchDisplayName
必須始終一起設定。如果未設定其中一個屬性,則兩個屬性都不會使用。
win.setIcon(icon)
Windows Linux
icon
NativeImage | string
變更視窗圖示。
win.setWindowButtonVisibility(visible)
macOS
visible
boolean
設定視窗的交通號誌按鈕是否應可見。
win.setAutoHideMenuBar(hide)
Windows Linux
hide
boolean
設定視窗功能表列是否應自動隱藏。設定後,功能表列只會在使用者按下單個 Alt
鍵時顯示。
如果功能表列已可見,則呼叫 setAutoHideMenuBar(true)
不會立即隱藏它。
win.isMenuBarAutoHide()
Windows Linux
回傳 boolean
- 功能表列是否自動隱藏。
win.setMenuBarVisibility(visible)
Windows Linux
visible
boolean
設定功能表列是否應可見。如果功能表列是自動隱藏的,使用者仍然可以透過按下單個 Alt
鍵來顯示功能表列。
win.isMenuBarVisible()
Windows Linux
回傳 boolean
- 功能表列是否可見。
win.setVisibleOnAllWorkspaces(visible[, options])
macOS Linux
visible
boolean
設定視窗是否應在所有工作區中可見。
注意: 此 API 在 Windows 上無效。
win.isVisibleOnAllWorkspaces()
macOS Linux
回傳 boolean
- 視窗是否在所有工作區中可見。
注意: 此 API 在 Windows 上始終回傳 false。
win.setIgnoreMouseEvents(ignore[, options])
ignore
boolean
使視窗忽略所有滑鼠事件。
在此視窗中發生的所有滑鼠事件都將傳遞到此視窗下方的視窗,但如果此視窗具有焦點,它仍然會接收鍵盤事件。
win.setContentProtection(enable)
macOS Windows
enable
boolean
防止其他應用程式擷取視窗內容。
在 macOS 上,它將 NSWindow 的 sharingType 設定為 NSWindowSharingNone。在 Windows 上,它會呼叫 SetWindowDisplayAffinity 並帶有 WDA_EXCLUDEFROMCAPTURE
。對於 Windows 10 版本 2004 和更高版本,視窗將完全從擷取中移除,較舊的 Windows 版本行為如同套用 WDA_MONITOR
,擷取黑色視窗。
win.setFocusable(focusable)
macOS Windows
focusable
boolean
變更視窗是否可以被聚焦。
在 macOS 上,它不會從視窗中移除焦點。
win.isFocusable()
macOS Windows
回傳 boolean
- 視窗是否可以被聚焦。
win.setParentWindow(parent)
parent
BaseWindow | null
設定 parent
作為目前視窗的父視窗,傳遞 null
會將目前視窗變成頂層視窗。
win.getParentWindow()
回傳 BaseWindow | null
- 父視窗,如果沒有父視窗,則回傳 null
。
win.getChildWindows()
回傳 BaseWindow[]
- 所有子視窗。
win.setAutoHideCursor(autoHide)
macOS
autoHide
boolean
控制打字時是否隱藏游標。
win.selectPreviousTab()
macOS
當啟用原生分頁且視窗中有多個分頁時,選取前一個分頁。
win.selectNextTab()
macOS
當啟用原生分頁且視窗中有多個分頁時,選取下一個分頁。
win.showAllTabs()
macOS
當啟用原生分頁時,顯示或隱藏分頁概覽。
win.mergeAllWindows()
macOS
當啟用原生分頁且有多個開啟的視窗時,將所有視窗合併為一個包含多個分頁的視窗。
win.moveTabToNewWindow()
macOS
當啟用原生分頁且目前視窗中有多個分頁時,將目前分頁移動到新的視窗。
win.toggleTabBar()
macOS
當啟用原生分頁且目前視窗中只有一個分頁時,切換分頁列的顯示與隱藏。
win.addTabbedWindow(baseWindow)
macOS
baseWindow
BaseWindow
在此視窗的分頁(針對視窗實例)之後,新增一個視窗作為分頁。
win.setVibrancy(type)
macOS
type
string | null - 可以是titlebar
、selection
、menu
、popover
、sidebar
、header
、sheet
、window
、hud
、fullscreen-ui
、tooltip
、content
、under-window
或under-page
。詳情請參閱 macOS 文件。
為視窗新增鮮明效果。傳入 null
或空字串會移除視窗的鮮明效果。
win.setBackgroundMaterial(material)
Windows
material
stringauto
- 讓桌面視窗管理員 (DWM) 自動決定此視窗的系統繪製背景材質。這是預設值。none
- 不繪製任何系統背景。mica
- 繪製對應於長期存在視窗的背景材質效果。acrylic
- 繪製對應於暫時性視窗的背景材質效果。tabbed
- 繪製對應於具有分頁式標題列的視窗的背景材質效果。
此方法設定瀏覽器視窗的系統繪製背景材質,包括非客戶端區域的後面。
詳情請參閱 Windows 文件。
注意: 此方法僅在 Windows 11 22H2 及更高版本上支援。
win.setWindowButtonPosition(position)
macOS
position
Point | null
為無邊框視窗中的交通號誌按鈕設定自訂位置。傳入 null
會將位置重設為預設值。
win.getWindowButtonPosition()
macOS
返回 Point | null
- 無邊框視窗中交通號誌按鈕的自訂位置,如果沒有自訂位置,則會返回 null
。
win.setTouchBar(touchBar)
macOS
touchBar
TouchBar | null
設定目前視窗的 TouchBar 配置。指定 null
或 undefined
會清除觸控列。此方法僅在電腦有觸控列時才會生效。
注意: TouchBar API 目前處於實驗階段,未來版本的 Electron 中可能會變更或移除。
win.setTitleBarOverlay(options)
Windows Linux
在已啟用視窗控制項覆蓋的視窗上,此方法會更新標題列覆蓋的樣式。
在 Linux 上,如果未明確設定 symbolColor
,則會自動計算 symbolColor
,使其與 color
具有最低可存取對比度。