github/electron
1
1
Fork 0
mirror of https://github.com/electron/electron.git synced 2026-04-10 03:01:51 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat: support more color formats for backgroundColor (#33364)

Browse Source 
* feat: support more color formats for backgroundColor

* feat: support more formats in getBackgroundColor

* chore: remove redundant includes

* refactor: differentiate rgb/rgba/hsl/hsla + docs

* chore: address review cleanup comments

* refactor: simple getBackgroundColor

* chore: fix iwyu

* fix: typescript arg

* Update docs/api/browser-view.md

Co-authored-by: Jeremy Rose <jeremya@chromium.org>

* chore: address comments

Co-authored-by: Shelley Vohr <shelley.vohr@gmail.com>
Co-authored-by: Jeremy Rose <jeremya@chromium.org>
This commit is contained in:
trop[bot]
2022-03-21 20:06:03 -04:00
committed by GitHub
parent e9fa834757
commit cee4e3707f
13 changed files with 144 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
docs/api/browser-window.md
View File

@@ -66,6 +66,18 @@ win.loadURL('https://github.com')
Note that even for apps that use `ready-to-show` event, it is still recommended
to set `backgroundColor` to make app feel more native.
Some examples of valid `backgroundColor` values include:
```js
const win = new BrowserWindow()
win.setBackgroundColor('hsl(230, 100%, 50%)')
win.setBackgroundColor('rgb(255, 145, 145)')
win.setBackgroundColor('#ff00a3')
win.setBackgroundColor('blueviolet')
```
For more information about these color types see valid options in [win.setBackgroundColor](browser-window.md#winsetbackgroundcolorbackgroundcolor).
## Parent and child windows
By using `parent` option, you can create child windows:
@@ -199,9 +211,7 @@ It creates a new `BrowserWindow` with native properties as set by the `options`.
* `enableLargerThanScreen` boolean (optional) - Enable the window to be resized larger
than screen. Only relevant for macOS, as other OSes allow
larger-than-screen windows by default. Default is `false`.
* `backgroundColor` string (optional) - Window's background color as a hexadecimal value,
like `#66CD00` or `#FFF` or `#80FFFFFF` (alpha in #AARRGGBB format is supported if
`transparent` is set to `true`). Default is `#FFF` (white).
* `backgroundColor` string (optional) - The window's background color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha in #AARRGGBB format is supported if `transparent` is set to `true`. Default is `#FFF` (white). See [win.setBackgroundColor](browser-window.md#winsetbackgroundcolorbackgroundcolor) for more information.
* `hasShadow` boolean (optional) - Whether window should have a shadow. Default is `true`.
* `opacity` number (optional) - Set the initial opacity of the window, between 0.0 (fully
transparent) and 1.0 (fully opaque). This is only implemented on Windows and macOS.
@@ -992,12 +1002,33 @@ APIs like `win.setSize`.
#### `win.setBackgroundColor(backgroundColor)`
* `backgroundColor` string - Window's background color as a hexadecimal value,
like `#66CD00` or `#FFF` or `#80FFFFFF` (alpha is supported if `transparent`
is `true`). Default is `#FFF` (white).
* `backgroundColor` string - Color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. The alpha channel is optional for the hex type.
Sets the background color of the window. See [Setting
`backgroundColor`](#setting-the-backgroundcolor-property).
Examples of valid `backgroundColor` values:
* Hex
* #fff (shorthand RGB)
* #ffff (shorthand ARGB)
* #ffffff (RGB)
* #ffffffff (ARGB)
* RGB
* rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)
* e.g. rgb(255, 255, 255)
* RGBA
* rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)
* e.g. rgba(255, 255, 255, 1.0)
* HSL
* hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)
* e.g. hsl(200, 20%, 50%)
* HSLA
* hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)
* e.g. hsla(200, 20%, 50%, 0.5)
* Color name
* Options are listed in [SkParseColor.cpp](https://source.chromium.org/chromium/chromium/src/+/main:third_party/skia/src/utils/SkParseColor.cpp;l=11-152;drc=eea4bf52cb0d55e2a39c828b017c80a5ee054148)
* Similar to CSS Color Module Level 3 keywords, but case-sensitive.
* e.g. `blueviolet` or `red`
Sets the background color of the window. See [Setting `backgroundColor`](#setting-the-backgroundcolor-property).
#### `win.previewFile(path[, displayName])` _macOS_
@@ -1041,8 +1072,11 @@ Returns [`Rectangle`](structures/rectangle.md) - The `bounds` of the window as `
#### `win.getBackgroundColor()`
Returns `string` - Gets the background color of the window. See [Setting
`backgroundColor`](#setting-the-backgroundcolor-property).
Returns `string` - Gets the background color of the window in Hex (`#RRGGBB`) format.
See [Setting `backgroundColor`](#setting-the-backgroundcolor-property).
**Note:** The alpha value is _not_ returned alongside the red, green, and blue values.
#### `win.setContentBounds(bounds[, animate])`