ios 是否有任何变通方案可以避免SFSafariViewController隐藏固定位置的标头？

9w11ddsr 于 2022-12-15 发布在 iOS

关注(0)|答案(2)|浏览(140)

SFSafariViewController存在此错误，在Safari中无法重现。
通常它会遮住网站名称/ done chrome后面固定面板的顶部。
这种情况发生的原因是内部失去了同步之间的实际高度的网页和大小缩小标题 chrome 。

良好的小标题

错误的小标题（SF chrome应该很小，但它很大）

良好的大标题

此问题已在以下位置报告：https://meta.stackexchange.com/questions/279792/new-ios-chat-headers-occasionally-hide-behind-safari-navigation-controls-when-vi是iOS 9及更高版本中的一个问题（在12.0.1中仍然是一个问题）
要重现，请使用SFViewController制作一个虚拟应用程序，并导航到具有固定标题的网站（如bbs.boingboing.net），然后单击并浏览一些主题。
由于这个bug已经有几年的历史了，我想知道是否有某种解决方法，不涉及在页眉顶部添加一般填充？

最小重现性

使用此HTML创建页面

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      body {
        height: 2000px;
        background-color: green;
      }
      header {
        width: 100%;
        height: 50px;
        background-color: red;
        color: white;
        position: fixed;
        top: 0;
      }
    </style>
  </head>
  <body>
    <header>Hello</header>
  </body>
</html>

在SafariViewController中打开（将其托管在某个在线位置，然后通过电子邮件发送链接，iOS中的gmail应用程序使用Safari视图控制器，话语应用程序也是如此）
快速滚动到底部
一半的头藏起来了。
顶部的插入没有区别，顶部的插入为0，覆盖视口属性没有区别。

ios

来源：https://stackoverflow.com/questions/52848408/are-there-any-workaround-to-avoid-sfsafariviewcontroller-from-hiding-fixed-posit

2条答案

按热度按时间

bjp0bcyl1#

问题

在不同环境下测试发现问题仅出现在SFSafariView中，原safari应用未被感染，并且仅出现在纵向模式下带notch的iPhone中，当用户到达页面末尾再次滚动时出现;所以页面应该向上，导航栏自动再次出现，冲突就会发生。
x1c 0d1x iPhone 8 -页面底部-纵向（确定）

iPhone XR -页面底部-纵向（不确定）

iPhone XR -页面底部-纵向（确定）

iPad Pro 9.7 -页面底部-横向（确定）
在某些情况下，这可能不是SFSafariViewController的bug。

因此，如果您能够接触到要嵌入SFSafariViewController的站点的前端开发人员，请向他们介绍以下内容：
安全区域插图

因此，为了解决这个问题，苹果实施了新的safe-area-inset、预定义的4个常量集和一个名为constant()的新CSS函数。安全区域预定义常量如下：safe-area-inset-top，safe-area-inset-right，safe-area-inset-bottom和save-area-inset-left。当你合并这四个常量时，你可以在每一边引用安全区域插入的当前大小。constant()可以在var()所能做到的任何地方工作。
有很多网站向你展示了如何在iPhoneX.Here's one of them上采用网页。
也许他们可以尝试将div放在可滚动部分之外，并固定位置。因此，如果你有一个代码，它可以滚动：

<div id="scroll-container">
  <div id="scrollable">
  </div>
<div>

例如，div滚动容器中的任何元素都将滚动。
如果将其放置在可滚动部分之外：

<div id="scroll-container">
<div>
<div id="not-scrollable">
</div>

并放入position:fixed;或position:absolute;或者是position: sticky或device-fixed; #not-scrollable的css中的等，它不应该滚动。

因此，如果您没有访问要嵌入SFSafariViewController的站点的前端开发人员的权限，请尝试以下操作（不推荐）：
试着转动杆折叠safariViewController.configuration.barCollapsingEnabled = false
或者尝试将其嵌入到navigationController中并删除SFView的标头
或使用使用控制器而不是SFSafariViewController实现全屏WKWebView。
注意（对于那些乱用工具栏的人）
您可以使用delegate方法来确定网页的加载和加载状态，并启用/禁用它以绕过页面布局初始化错误。（您也可以使用手动延迟）
你可以使用私有API来隐藏或显示底部工具栏，但这不是首选，它会被苹果应用商店拒绝。

赞(0）回复(0）举报 2022-12-15

t2a7ltrp2#

如果按如下方式覆盖prefersStatusBarHidden会怎样？

override func prefersStatusBarHidden() -> Bool {
    return true
}

而且你可能想要手动添加一个重新加载按钮：-（

赞(0）回复(0）举报 2022-12-15

我来回答

ios 是否有任何变通方案可以避免SFSafariViewController隐藏固定位置的标头？

良好的小标题

错误的小标题（SF chrome应该很小，但它很大）

良好的大标题

最小重现性

2条答案

问题

相关问题

热门标签

最新问答