Skip to content

Commit 2308e91

Browse files
authored
Update BackgroundColor.md
1 parent ceaaea2 commit 2308e91

1 file changed

Lines changed: 27 additions & 24 deletions

File tree

specs/BackgroundColor.md

Lines changed: 27 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
# Background
2-
WebView2 developers have provided feedback that there is a 'white flicker' when navigating between pages. This flicker comes from WebView briefly showing its default background color for when no web page is loaded. Developers should be able to set a custom background color for the WebView that matches the color scheme of their app and avoids this flicker. We have also received feedback requesting the ability to set the WebView's background color transparent. This way developers can create a seamless UI experience where the WebView displays web content directly over host app content. The BackgroundColor API addresses this need.
2+
WebView2 developers have provided feedback that there is a 'white flicker' when navigating between pages. This flicker comes from WebView briefly showing its default background color for when no web page is loaded. Developers should be able to set a custom background color for the WebView that matches the color scheme of their app and avoids this flicker. We have also received feedback requesting the ability to set the WebView's background color transparent. This way developers can create a seamless UI experience where the WebView displays web content directly over host app content. The DefaultBackgroundColor API addresses this need.
33

44

55
# Description
6-
The `BackgroundColor` property enables a seamless UI experience. Developers can replace the 'white flash' between loading pages with a color better suited to their application. For websites with no specified background color, developers can display web contents over a color of their choosing. They can also do away with the background color entirely with transparency and have the 'in between pages color' just be hosting content, or have hosting app content be the backdrop for webpages without a background color specified.
6+
The `DefaultBackgroundColor` property enables a smoother UI experience. Developers can choose the color that shows between loading pages and eliminate any 'white flash.' For websites with no specified background color, developers can display web contents over a color of their choosing. They can also do away with the background color entirely with transparency and have the 'in between pages color' just be hosting content, or have hosting app content be the backdrop for webpages without a background color specified.
77

88
# Examples
99
## Win32 C++
10-
The fields of COREWEBVIEW2_COLOR can be set with integer values between 0 and 255. In the following example, we see the app reading color values from a COLORREF (which are integers under the covers) into a COREWEBVIEW2_COLOR. It then sets the COREWEBVIEW2_COLOR.A value to 0 or 255. Once the COREWEBVIEW2_COLOR value is filled out, it is passed to the controller's put_BackgroundColor API.
10+
The fields of COREWEBVIEW2_COLOR can be set with integer values between 0 and 255. In the following example, we see the app reading color values from a COLORREF (which are integers under the covers) into a COREWEBVIEW2_COLOR. It then sets the COREWEBVIEW2_COLOR.A value to 0 or 255. Once the COREWEBVIEW2_COLOR value is filled out, it is passed to the controller's put_DefaultBackgroundColor API.
1111
```cpp
1212
void ViewComponent::SetBackgroundColor(COLORREF color, bool transparent)
1313
{
@@ -16,14 +16,14 @@ void ViewComponent::SetBackgroundColor(COLORREF color, bool transparent)
1616
wvColor.G = GetGValue(color);
1717
wvColor.B = GetBValue(color);
1818
wvColor.A = transparent ? 0 : 255;
19-
m_controller->put_BackgroundColor(wvColor);
19+
m_controller->put_DefaultBackgroundColor(wvColor);
2020
}
2121
```
2222
## WinRT
2323
```c#
2424
private void SetBackgroundColor(Windows.UI.Color color)
2525
{
26-
_coreWebView2Controller.BackgroundColor = color;
26+
_coreWebView2Controller.DefaultBackgroundColor = color;
2727
}
2828
```
2929

@@ -38,42 +38,45 @@ Currently only colors with an A set to 0 or 255 are supported by the API. The wo
3838
// This is the ICoreWebView2Controller2 interface
3939
interface ICoreWebView2Controller2 : ICoreWebView2Controller {
4040

41-
/// The `BackgroundColor` property allows developers to set the color that
42-
/// shows when WebView has not loaded any web content and when a webpage
41+
/// The `DefaultBackgroundColor` property allows developers to set the color
42+
/// that shows when WebView has not loaded any web content and when a webpage
4343
/// does not specify a background color. Color is specified by the
4444
/// COREWEBVIEW2_COLOR value meaning the background color can also be
4545
/// transparent.
4646
/// The WebView background color will show before the initial navigation,
4747
/// between navigations before the next page has rendered, and for pages with
4848
/// no `background` style properties set. To clarify the latter case, WebView
49-
/// will always honor a webpage's background content. `BackgroundColor` will
50-
/// only show in the absence of css `background` style properties. In that
51-
/// case, WebView will render web content over the `BackgroundColor` color.
52-
/// For a transparent background, web content will render over hosting app
53-
/// content. WebView's default background color is white to match the browser
54-
/// experience.
49+
/// will always honor a webpage's background content. `DefaultBackgroundColor`
50+
/// will only show in the absence of css `background` style properties. In
51+
/// that case, WebView will render web content over the
52+
/// `DefaultBackgroundColor` color. For a transparent background, web content
53+
/// will render over hosting app content. WebView's default background color
54+
/// is white to resemble the browser experience.
5555
/// It is important to note that while COREWEBVIEW2_COLOR has `A` an alpha
5656
/// value, semi-transparent colors are not supported by this API and setting
57-
/// `BackgroundColor` to a semi-transparent color will fail with E_INVALIDARG.
58-
/// Any alpha value above 0 and below 255 will result in an E_INVALIDARG
59-
/// error.`BackgroundColor` can only be an opaque color or transparent.
57+
/// `DefaultBackgroundColor` to a semi-transparent color will fail with
58+
/// E_INVALIDARG. The only supported alpha values are 0 and 255, all other
59+
/// values will result in E_INVALIDARG.
60+
/// `DefaultBackgroundColor` can only be an opaque color or transparent.
6061
///
61-
/// The `BackgroundColor` property enables a seamless UI experience.
62-
/// Developers can replace the 'white flash' between loading pages with a
63-
/// color better suited to their application. For websites with no specified
62+
/// The `DefaultBackgroundColor` property enables a smoother UI experience.
63+
/// Developers can choose the color that shows between loading pages and
64+
/// eliminate any 'white flash.' For websites with no specified
6465
/// background color, developers can display web contents over a color of
6566
/// their choosing. They can also do away with the background color entirely
6667
/// with transparency and have the 'in between pages color' just be hosting
6768
/// content, or have hosting app content be the backdrop for webpages without
6869
/// a background color specified.
6970
///
70-
/// \snippet ViewComponent.cpp BackgroundColor
71+
/// \snippet ViewComponent.cpp DefaultBackgroundColor
7172

72-
[propget] HRESULT BackgroundColor([out, retval] COREWEBVIEW2_COLOR* backgroundColor);
73+
[propget] HRESULT DefaultBackgroundColor(
74+
[out, retval] COREWEBVIEW2_COLOR* backgroundColor);
7375

74-
/// Sets the `BackgroundColor` property.
76+
/// Sets the `DefaultBackgroundColor` property.
7577

76-
[propput] HRESULT BackgroundColor([in] COREWEBVIEW2_COLOR backgroundColor);
78+
[propput] HRESULT DefaultBackgroundColor(
79+
[in] COREWEBVIEW2_COLOR backgroundColor);
7780
}
7881

7982

@@ -106,6 +109,6 @@ typedef struct COREWEBVIEW2_COLOR {
106109
unsealed runtimeclass CoreWebView2Controller
107110
{
108111
// ..
109-
Windows.UI.Color BackgroundColor { get; set; };
112+
Windows.UI.Color DefaultBackgroundColor { get; set; };
110113
}
111114
```

0 commit comments

Comments
 (0)