2014-01-07 12:35:13 +00:00
|
|
|
# screen
|
|
|
|
|
2016-04-21 22:35:29 +00:00
|
|
|
> Retrieve information about screen size, displays, cursor position, etc.
|
|
|
|
|
2019-01-24 18:53:52 +00:00
|
|
|
Process: [Main](../glossary.md#main-process)
|
2016-11-03 17:26:00 +00:00
|
|
|
|
2019-04-30 00:46:08 +00:00
|
|
|
This module cannot be used until the `ready` event of the `app`
|
2016-09-16 18:38:32 +00:00
|
|
|
module is emitted.
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2019-07-22 15:20:43 +00:00
|
|
|
`screen` is an [EventEmitter][event-emitter].
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2015-11-12 13:20:09 +00:00
|
|
|
**Note:** In the renderer / DevTools, `window.screen` is a reserved DOM
|
2018-09-13 16:10:51 +00:00
|
|
|
property, so writing `let { screen } = require('electron')` will not work.
|
2016-06-07 04:55:25 +00:00
|
|
|
|
2015-01-16 21:57:16 +00:00
|
|
|
An example of creating a window that fills the whole screen:
|
|
|
|
|
2023-11-21 07:50:08 +00:00
|
|
|
```fiddle docs/fiddles/screen/fit-screen
|
|
|
|
// Retrieve information about screen size, displays, cursor position, etc.
|
|
|
|
//
|
|
|
|
// For more info, see:
|
|
|
|
// https://www.electronjs.org/docs/latest/api/screen
|
|
|
|
|
|
|
|
const { app, BrowserWindow, screen } = require('electron/main')
|
|
|
|
|
|
|
|
let mainWindow = null
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2020-02-03 22:43:22 +00:00
|
|
|
app.whenReady().then(() => {
|
2023-11-21 07:50:08 +00:00
|
|
|
// Create a window that fills the screen's available work area.
|
|
|
|
const primaryDisplay = screen.getPrimaryDisplay()
|
|
|
|
const { width, height } = primaryDisplay.workAreaSize
|
|
|
|
|
|
|
|
mainWindow = new BrowserWindow({ width, height })
|
|
|
|
mainWindow.loadURL('https://electronjs.org')
|
2016-07-26 01:39:25 +00:00
|
|
|
})
|
2014-07-01 15:30:26 +00:00
|
|
|
```
|
2014-01-07 12:35:13 +00:00
|
|
|
|
2015-01-16 21:57:16 +00:00
|
|
|
Another example of creating a window in the external display:
|
|
|
|
|
2023-11-21 07:50:08 +00:00
|
|
|
```js
|
2019-04-30 00:46:08 +00:00
|
|
|
const { app, BrowserWindow, screen } = require('electron')
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2016-06-07 04:55:25 +00:00
|
|
|
let win
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2020-02-03 22:43:22 +00:00
|
|
|
app.whenReady().then(() => {
|
2020-07-09 17:18:49 +00:00
|
|
|
const displays = screen.getAllDisplays()
|
|
|
|
const externalDisplay = displays.find((display) => {
|
2016-06-07 04:55:25 +00:00
|
|
|
return display.bounds.x !== 0 || display.bounds.y !== 0
|
|
|
|
})
|
2015-01-16 21:57:16 +00:00
|
|
|
|
|
|
|
if (externalDisplay) {
|
2016-05-10 17:38:42 +00:00
|
|
|
win = new BrowserWindow({
|
2015-01-16 21:57:16 +00:00
|
|
|
x: externalDisplay.bounds.x + 50,
|
2015-10-05 13:56:36 +00:00
|
|
|
y: externalDisplay.bounds.y + 50
|
2016-06-07 04:55:25 +00:00
|
|
|
})
|
2016-07-26 01:39:25 +00:00
|
|
|
win.loadURL('https://github.com')
|
2015-01-16 21:57:16 +00:00
|
|
|
}
|
2016-06-07 04:55:25 +00:00
|
|
|
})
|
2015-01-16 21:57:16 +00:00
|
|
|
```
|
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
## Events
|
|
|
|
|
|
|
|
The `screen` module emits the following events:
|
|
|
|
|
|
|
|
### Event: 'display-added'
|
|
|
|
|
|
|
|
Returns:
|
2015-01-16 21:57:16 +00:00
|
|
|
|
|
|
|
* `event` Event
|
2016-09-28 07:00:01 +00:00
|
|
|
* `newDisplay` [Display](structures/display.md)
|
2015-01-16 21:57:16 +00:00
|
|
|
|
|
|
|
Emitted when `newDisplay` has been added.
|
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
### Event: 'display-removed'
|
|
|
|
|
|
|
|
Returns:
|
2015-01-16 21:57:16 +00:00
|
|
|
|
|
|
|
* `event` Event
|
2016-09-28 07:00:01 +00:00
|
|
|
* `oldDisplay` [Display](structures/display.md)
|
2015-01-16 21:57:16 +00:00
|
|
|
|
|
|
|
Emitted when `oldDisplay` has been removed.
|
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
### Event: 'display-metrics-changed'
|
|
|
|
|
|
|
|
Returns:
|
2015-01-16 21:57:16 +00:00
|
|
|
|
|
|
|
* `event` Event
|
2016-09-28 07:00:01 +00:00
|
|
|
* `display` [Display](structures/display.md)
|
2021-11-16 04:13:18 +00:00
|
|
|
* `changedMetrics` string[]
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
Emitted when one or more metrics change in a `display`. The `changedMetrics` is
|
2015-01-16 21:57:16 +00:00
|
|
|
an array of strings that describe the changes. Possible changes are `bounds`,
|
|
|
|
`workArea`, `scaleFactor` and `rotation`.
|
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
## Methods
|
|
|
|
|
|
|
|
The `screen` module has the following methods:
|
|
|
|
|
|
|
|
### `screen.getCursorScreenPoint()`
|
2014-01-07 12:35:13 +00:00
|
|
|
|
2017-04-03 22:35:39 +00:00
|
|
|
Returns [`Point`](structures/point.md)
|
2016-09-24 23:59:30 +00:00
|
|
|
|
|
|
|
The current absolute position of the mouse pointer.
|
2014-01-07 12:35:13 +00:00
|
|
|
|
2021-01-11 03:19:48 +00:00
|
|
|
**Note:** The return value is a DIP point, not a screen physical point.
|
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
### `screen.getPrimaryDisplay()`
|
2014-01-07 12:35:13 +00:00
|
|
|
|
2016-12-19 17:40:07 +00:00
|
|
|
Returns [`Display`](structures/display.md) - The primary display.
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
### `screen.getAllDisplays()`
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2016-12-19 17:40:07 +00:00
|
|
|
Returns [`Display[]`](structures/display.md) - An array of displays that are currently available.
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
### `screen.getDisplayNearestPoint(point)`
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2017-04-03 22:35:39 +00:00
|
|
|
* `point` [Point](structures/point.md)
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2016-12-19 17:40:07 +00:00
|
|
|
Returns [`Display`](structures/display.md) - The display nearest the specified point.
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2015-08-29 05:24:54 +00:00
|
|
|
### `screen.getDisplayMatching(rect)`
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2016-10-08 02:09:31 +00:00
|
|
|
* `rect` [Rectangle](structures/rectangle.md)
|
2015-01-16 21:57:16 +00:00
|
|
|
|
2016-12-21 08:43:47 +00:00
|
|
|
Returns [`Display`](structures/display.md) - The display that most closely
|
2016-12-19 17:40:07 +00:00
|
|
|
intersects the provided bounds.
|
2018-05-16 09:34:09 +00:00
|
|
|
|
|
|
|
### `screen.screenToDipPoint(point)` _Windows_
|
|
|
|
|
|
|
|
* `point` [Point](structures/point.md)
|
|
|
|
|
|
|
|
Returns [`Point`](structures/point.md)
|
|
|
|
|
|
|
|
Converts a screen physical point to a screen DIP point.
|
|
|
|
The DPI scale is performed relative to the display containing the physical point.
|
|
|
|
|
|
|
|
### `screen.dipToScreenPoint(point)` _Windows_
|
|
|
|
|
|
|
|
* `point` [Point](structures/point.md)
|
|
|
|
|
|
|
|
Returns [`Point`](structures/point.md)
|
|
|
|
|
|
|
|
Converts a screen DIP point to a screen physical point.
|
|
|
|
The DPI scale is performed relative to the display containing the DIP point.
|
|
|
|
|
|
|
|
### `screen.screenToDipRect(window, rect)` _Windows_
|
|
|
|
|
2018-08-03 03:08:43 +00:00
|
|
|
* `window` [BrowserWindow](browser-window.md) | null
|
2018-05-16 09:34:09 +00:00
|
|
|
* `rect` [Rectangle](structures/rectangle.md)
|
|
|
|
|
|
|
|
Returns [`Rectangle`](structures/rectangle.md)
|
|
|
|
|
|
|
|
Converts a screen physical rect to a screen DIP rect.
|
|
|
|
The DPI scale is performed relative to the display nearest to `window`.
|
|
|
|
If `window` is null, scaling will be performed to the display nearest to `rect`.
|
|
|
|
|
|
|
|
### `screen.dipToScreenRect(window, rect)` _Windows_
|
|
|
|
|
2018-08-03 03:08:43 +00:00
|
|
|
* `window` [BrowserWindow](browser-window.md) | null
|
2018-05-16 09:34:09 +00:00
|
|
|
* `rect` [Rectangle](structures/rectangle.md)
|
|
|
|
|
|
|
|
Returns [`Rectangle`](structures/rectangle.md)
|
|
|
|
|
|
|
|
Converts a screen DIP rect to a screen physical rect.
|
|
|
|
The DPI scale is performed relative to the display nearest to `window`.
|
|
|
|
If `window` is null, scaling will be performed to the display nearest to `rect`.
|
2019-07-22 15:20:43 +00:00
|
|
|
|
|
|
|
[event-emitter]: https://nodejs.org/api/events.html#events_class_eventemitter
|