mirrors/electron
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions 2

docs: revised the macos dock menu feature page (#25985)

Browse source 
* docs: revised the macos dock menu feature page

* docs: added a cross-link to api, fixed mentions in the macos feature page
This commit is contained in:
Antonio 2020-10-20 04:32:40 +03:00 • committed by GitHub
parent ae5de3d9c5
commit 89c04b3c6c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
docs/images/macos-dock-menu.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 100 KiB

29
docs/tutorial/macos-dock.md
View file

@ -1,10 +1,11 @@
# macOS Dock # macOS Dock
## Overview
Electron has APIs to configure the app's icon in the macOS Dock. A macOS-only Electron has APIs to configure the app's icon in the macOS Dock. A macOS-only
API exists to create a custom dock menu, but API exists to create a custom dock menu, but Electron also uses the app dock
Electron also uses the app's dock icon to implement cross-platform features icon as the entry point for cross-platform features like
like [recent documents][recent-documents] and [recent documents][recent-documents] and [application progress][progress-bar].
[application progress][progress-bar].
The custom dock is commonly used to add shortcuts to tasks the user wouldn't The custom dock is commonly used to add shortcuts to tasks the user wouldn't
want to open the whole app window for. want to open the whole app window for.
@ -13,8 +14,15 @@ __Dock menu of Terminal.app:__
![Dock Menu][dock-menu-image] ![Dock Menu][dock-menu-image]
To set your custom dock menu, you can use the `app.dock.setMenu` API, which is To set your custom dock menu, you need to use the
only available on macOS: [`app.dock.setMenu`](../api/dock.md#docksetmenumenu-macos) API,
which is only available on macOS.
## Example
Starting with a working application from the
[Quick Start Guide](quick-start.md), update the `main.js` file with the
following lines:
```javascript ```javascript
const { app, Menu } = require('electron') const { app, Menu } = require('electron')
@ -33,9 +41,16 @@ const dockMenu = Menu.buildFromTemplate([
{ label: 'New Command...' } { label: 'New Command...' }
]) ])
app.dock.setMenu(dockMenu) app.whenReady().then(() => {
app.dock.setMenu(dockMenu)
})
``` ```
After launching the Electron application, right click the application icon.
You should see the custom menu you just defined:
![macOS dock menu](../images/macos-dock-menu.png)
[dock-menu-image]: https://cloud.githubusercontent.com/assets/639601/5069962/6032658a-6e9c-11e4-9953-aa84006bdfff.png [dock-menu-image]: https://cloud.githubusercontent.com/assets/639601/5069962/6032658a-6e9c-11e4-9953-aa84006bdfff.png
[recent-documents]: ./recent-documents.md [recent-documents]: ./recent-documents.md
[progress-bar]: ./progress-bar.md [progress-bar]: ./progress-bar.md