Aller au contenu principal

Dock

Electron a des APIs pour configurer l'icône de l'application dans le macOS Dock. A macOS-only API exists to create a custom dock menu, but Electron also uses the app dock icon as the entry point for cross-platform features like recent documents and application progress.

Le dock personnalisé est généralement utilisé pour ajouter des raccourcis aux tâches pour lesquelles l'utilisateur ne voudrait pas ouvrir toute la fenêtre de l'application.

Menu du Dock de Terminal.app :

Menu Dock

To set your custom dock menu, you need to use the app.dock.setMenu API, which is only available on macOS.

const { app, BrowserWindow, Menu } = require('electron')

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

win.loadFile('index.html')
}

const dockMenu = Menu.buildFromTemplate([
{
label: 'New Window',
click () { console.log('New Window') }
}, {
label: 'New Window with Settings',
submenu: [
{ label: 'Basic' },
{ label: 'Pro' }
]
},
{ label: 'New Command...' }
])

app.whenReady().then(() => {
if (process.platform === 'darwin') {
app.dock.setMenu(dockMenu)
}
}).then(createWindow)

app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit()
}
})

app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow()
}
})

After launching the Electron application, right click the application icon. Vous devriez voir le menu personnalisé que vous venez de définir :

menu du dock macOS