From 584ba083deb62cfcc17919e7ce78dbfab18ac848 Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Tue, 10 Sep 2019 22:28:35 +0200 Subject: [PATCH 1/7] add PersistedPlatformView attribute update handling to enable resizing --- .../lib/src/engine/surface/platform_view.dart | 23 ++++++++++++++----- 1 file changed, 17 insertions(+), 6 deletions(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index 69391c6471e24..452710cc6d4b8 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -12,14 +12,13 @@ class PersistedPlatformView extends PersistedLeafSurface { final double width; final double height; - html.HtmlElement _hostElement; html.ShadowRoot _shadowRoot; PersistedPlatformView(this.viewId, this.dx, this.dy, this.width, this.height); @override html.Element createElement() { - _hostElement = defaultCreateElement('flt-platform-view'); + html.Element element = defaultCreateElement('flt-platform-view'); // Allow the platform view host element to receive pointer events. // @@ -34,9 +33,9 @@ class PersistedPlatformView extends PersistedLeafSurface { // to enable accessibility, you must double tap the app *outside of a // platform view*. As a consequence, a full-screen platform view will make // it impossible to enable accessibility. - _hostElement.style.pointerEvents = 'auto'; + element.style.pointerEvents = 'auto'; - _shadowRoot = _hostElement.attachShadow({'mode': 'open'}); + _shadowRoot = element.attachShadow({'mode': 'open'}); final html.StyleElement _styleReset = html.StyleElement(); _styleReset.innerHtml = ''' :host { @@ -50,7 +49,7 @@ class PersistedPlatformView extends PersistedLeafSurface { } else { html.window.console.warn('No platform view created for id $viewId'); } - return _hostElement; + return element; } @override @@ -58,7 +57,7 @@ class PersistedPlatformView extends PersistedLeafSurface { @override void apply() { - _hostElement.style + rootElement.style ..transform = 'translate(${dx}px, ${dy}px)' ..width = '${width}px' ..height = '${height}px'; @@ -68,4 +67,16 @@ class PersistedPlatformView extends PersistedLeafSurface { double matchForUpdate(PersistedPlatformView existingSurface) { return existingSurface.viewId == viewId ? 0.0 : 1.0; } + + @override + void update(PersistedPlatformView oldSurface) { + super.update(oldSurface); + if (viewId != oldSurface.viewId) { + // the content of the surface has to be rebuild if the viewId is changed + build(); + } else if (dx != oldSurface.dx || dy != oldSurface.dy || width != oldSurface.width || height != oldSurface.height) { + // a change in any of the dimensions is performed by calling apply + apply(); + } + } } From a0e286914bfefc5e89bd07e65b8417f4d9a8ba27 Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Thu, 19 Sep 2019 23:03:05 +0200 Subject: [PATCH 2/7] update size of root element created by a PlatformView --- .../lib/src/engine/surface/platform_view.dart | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index 452710cc6d4b8..ee37ebf127f73 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -13,6 +13,7 @@ class PersistedPlatformView extends PersistedLeafSurface { final double height; html.ShadowRoot _shadowRoot; + html.Element _platformView; PersistedPlatformView(this.viewId, this.dx, this.dy, this.width, this.height); @@ -42,10 +43,10 @@ class PersistedPlatformView extends PersistedLeafSurface { all: initial; }'''; _shadowRoot.append(_styleReset); - final html.Element platformView = + _platformView = platformViewRegistry.getCreatedView(viewId); - if (platformView != null) { - _shadowRoot.append(platformView); + if (_platformView != null) { + _shadowRoot.append(_platformView); } else { html.window.console.warn('No platform view created for id $viewId'); } @@ -61,6 +62,12 @@ class PersistedPlatformView extends PersistedLeafSurface { ..transform = 'translate(${dx}px, ${dy}px)' ..width = '${width}px' ..height = '${height}px'; + // Set size of the root element created by the PlatformView. + if (_platformView != null) { + _platformView.style + ..width = '${width}px' + ..height = '${height}px'; + } } @override From 7a59c4f5303695accabfc6bd19e0c30abfc7a134 Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Thu, 19 Sep 2019 23:03:32 +0200 Subject: [PATCH 3/7] improved comments --- lib/web_ui/lib/src/engine/surface/platform_view.dart | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index ee37ebf127f73..86e9e85bc7a5c 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -79,10 +79,10 @@ class PersistedPlatformView extends PersistedLeafSurface { void update(PersistedPlatformView oldSurface) { super.update(oldSurface); if (viewId != oldSurface.viewId) { - // the content of the surface has to be rebuild if the viewId is changed + // The content of the surface has to be rebuild if the viewId is changed. build(); } else if (dx != oldSurface.dx || dy != oldSurface.dy || width != oldSurface.width || height != oldSurface.height) { - // a change in any of the dimensions is performed by calling apply + // A change in any of the dimensions is performed by calling apply. apply(); } } From 76af94b97b4911c327e94e99402332cb81862516 Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Thu, 19 Sep 2019 23:11:12 +0200 Subject: [PATCH 4/7] enforce effective size of PlatformView surface --- lib/web_ui/lib/src/engine/surface/platform_view.dart | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index 86e9e85bc7a5c..6bd976e42ea3f 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -58,7 +58,10 @@ class PersistedPlatformView extends PersistedLeafSurface { @override void apply() { + // The overflow property 'auto' enforces the effective size of the PlatformView + // and mimics the behaviour of WebView on mobile platforms. rootElement.style + ..overflow = 'auto' ..transform = 'translate(${dx}px, ${dy}px)' ..width = '${width}px' ..height = '${height}px'; @@ -67,7 +70,7 @@ class PersistedPlatformView extends PersistedLeafSurface { _platformView.style ..width = '${width}px' ..height = '${height}px'; - } + } } @override From 2e1a015c1027e14a07f3f7326ba2723832b239c9 Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Thu, 19 Sep 2019 23:13:09 +0200 Subject: [PATCH 5/7] updated formating of platform_view.dart --- lib/web_ui/lib/src/engine/surface/platform_view.dart | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index 6bd976e42ea3f..cc710d722e000 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -43,8 +43,7 @@ class PersistedPlatformView extends PersistedLeafSurface { all: initial; }'''; _shadowRoot.append(_styleReset); - _platformView = - platformViewRegistry.getCreatedView(viewId); + _platformView = platformViewRegistry.getCreatedView(viewId); if (_platformView != null) { _shadowRoot.append(_platformView); } else { @@ -84,7 +83,10 @@ class PersistedPlatformView extends PersistedLeafSurface { if (viewId != oldSurface.viewId) { // The content of the surface has to be rebuild if the viewId is changed. build(); - } else if (dx != oldSurface.dx || dy != oldSurface.dy || width != oldSurface.width || height != oldSurface.height) { + } else if (dx != oldSurface.dx || + dy != oldSurface.dy || + width != oldSurface.width || + height != oldSurface.height) { // A change in any of the dimensions is performed by calling apply. apply(); } From 4759afb4788661bd3f8eaa92a6e8ed272fe87a7e Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Fri, 20 Sep 2019 00:28:51 +0200 Subject: [PATCH 6/7] stop storing root element of PlatformView in its Surface When the PlatformViemSurface adopts the DOM elements from a previous PlatformViewSurface the the stored value will lost. --- .../lib/src/engine/surface/platform_view.dart | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index cc710d722e000..9f6fb2faf8a81 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -13,7 +13,6 @@ class PersistedPlatformView extends PersistedLeafSurface { final double height; html.ShadowRoot _shadowRoot; - html.Element _platformView; PersistedPlatformView(this.viewId, this.dx, this.dy, this.width, this.height); @@ -43,9 +42,10 @@ class PersistedPlatformView extends PersistedLeafSurface { all: initial; }'''; _shadowRoot.append(_styleReset); - _platformView = platformViewRegistry.getCreatedView(viewId); - if (_platformView != null) { - _shadowRoot.append(_platformView); + final html.Element platformView = + platformViewRegistry.getCreatedView(viewId); + if (platformView != null) { + _shadowRoot.append(platformView); } else { html.window.console.warn('No platform view created for id $viewId'); } @@ -65,8 +65,10 @@ class PersistedPlatformView extends PersistedLeafSurface { ..width = '${width}px' ..height = '${height}px'; // Set size of the root element created by the PlatformView. - if (_platformView != null) { - _platformView.style + final html.Element platformView = + platformViewRegistry.getCreatedView(viewId); + if (platformView != null) { + platformView.style ..width = '${width}px' ..height = '${height}px'; } From 12d94c999f48839264f766bf7d9defc342dce966 Mon Sep 17 00:00:00 2001 From: Georg Wechslberger Date: Fri, 20 Sep 2019 01:34:16 +0200 Subject: [PATCH 7/7] move setting overflow property to createElement --- lib/web_ui/lib/src/engine/surface/platform_view.dart | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/web_ui/lib/src/engine/surface/platform_view.dart b/lib/web_ui/lib/src/engine/surface/platform_view.dart index 9f6fb2faf8a81..5d338b59dfa13 100644 --- a/lib/web_ui/lib/src/engine/surface/platform_view.dart +++ b/lib/web_ui/lib/src/engine/surface/platform_view.dart @@ -35,6 +35,9 @@ class PersistedPlatformView extends PersistedLeafSurface { // it impossible to enable accessibility. element.style.pointerEvents = 'auto'; + // Enforce the effective size of the PlatformView. + element.style.overflow = 'hidden'; + _shadowRoot = element.attachShadow({'mode': 'open'}); final html.StyleElement _styleReset = html.StyleElement(); _styleReset.innerHtml = ''' @@ -57,10 +60,7 @@ class PersistedPlatformView extends PersistedLeafSurface { @override void apply() { - // The overflow property 'auto' enforces the effective size of the PlatformView - // and mimics the behaviour of WebView on mobile platforms. rootElement.style - ..overflow = 'auto' ..transform = 'translate(${dx}px, ${dy}px)' ..width = '${width}px' ..height = '${height}px';