如何使基于网络的Flutter应用程序在iOS上全屏显示

Question

我有一个基于web的Flutter应用程序，单击按钮后，我想使该应用程序全屏显示。我使用以下代码片段进行

import 'dart:html';

if (document.documentElement == null) {
print("DEBUG document.documentElement == null");
} else {
document.documentElement.requestFullscreen();
}

这段代码在Linux上的Chrome、Mac上的Safari、Android上都能很好地工作，但在iOS上却不行(15.1(

NoSuchMethodError: method not found: 'webkitRequestFullscreen' (s.webkitRequestFullscreen is not a function. (In 's.webkitRequestFullscreen()', 's.webkitRequestFullscreen' is undefined))

有什么想法/技巧可以在iOS上使用吗？

Answer 1

这是因为iOS safari没有全屏API。我相信这个问题只出现在iphone上，而不是ipad上。解决方法是增加底线。但是，只有当页面作为书签从主屏幕启动时，它才会起作用。

<meta name="apple-mobile-web-app-capable" content="yes">

有关更多信息，请查看以下链接-

https://developers.google.com/web/fundamentals/native-hardware/fullscreen#request_the_browser_go_fullscreen_in_response_to_a_user_gesture

https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API#element.requestfullscreen