iOS 11 Swift 4 iPhone X Safe Area 支持全屏ScrollView

Posted

技术标签:

【中文标题】iOS 11 Swift 4 iPhone X Safe Area 支持全屏ScrollView【英文标题】:iOS 11 Swift 4 iPhone X Safe Area Support of full screen ScrollView 【发布时间】:2018-04-13 20:25:19 【问题描述】:

我目前将我的布局设计设置为一个视图控制器上的全屏滚动视图,在其中我将其他视图控制器添加为子视图以创建分页效果。在普通的 iphone 屏幕上它工作得很好。然而,在 iPhone X 上运行时,事情似乎偏离了中心,我可以在一页中多次翻页。

这是我设置滚动视图的代码

self.scrollView.contentSize = CGSize(width: self.view.frame.width, height: self.view.frame.size.height * 3)
        if #available(ios 11.0, *) 
            self.scrollView.contentInsetAdjustmentBehavior = .never
         else 
            // Fallback on earlier versions
        


        let V1 = self.storyboard?.instantiateViewController(withIdentifier: "S1") as! UINavigationController!
        self.addChildViewController(V1!)
        self.scrollView.addSubview(V1!.view)
        V1?.didMove(toParentViewController: self)
        V1?.view.frame = scrollView.bounds
        myViewsArray.append(V1!)

        let V2 = self.storyboard?.instantiateViewController(withIdentifier: "S2") as UIViewController!
        self.addChildViewController(V2!)
        self.scrollView.addSubview(V2!.view)
        V2?.didMove(toParentViewController: self)
        V2?.view.frame = scrollView.bounds
        myViewsArray.append(V2!)

        var V1Frame: CGRect = V1!.view.frame
        V1Frame.origin.y = 2*self.view.frame.height
        V1?.view.frame = V1Frame

        var V2Frame: CGRect = V2!.view.frame
        V2Frame.origin.y = (self.view.frame.height)
        V2?.view.frame = V2Frame

        V2!.view.alpha = 1

故事板上有安全区域。

【问题讨论】:

【参考方案1】:

您可以使用safe area layout guide 执行此操作,并使用链接获取更多信息:

https://medium.com/rosberryapps/ios-safe-area-ca10e919526f

你也可以在没有安全区域的情况下这样做:我为你准备了一个演示,在这个演示中,我们在滚动视图上添加了三个视图控制器,在另一个视图控制器上添加了滚动视图(ContainerViewController)

ContainerViewController:

import UIKit

class ContainerViewController: UIViewController, UIScrollViewDelegate 

    @IBOutlet weak var scrollView: UIScrollView!

    override func viewDidLoad() 
        super.viewDidLoad()

        // Do any additional setup after loading the view.
        let V1 = self.storyboard?.instantiateViewController(withIdentifier: "first")
        self.addChildViewController(V1!)
        self.scrollView.addSubview(V1!.view)
        V1?.didMove(toParentViewController: self)
        V1?.view.frame = scrollView.bounds

        let V2 = self.storyboard?.instantiateViewController(withIdentifier: "second")
        self.addChildViewController(V2!)
        self.scrollView.addSubview(V2!.view)
        V2?.didMove(toParentViewController: self)
        V2?.view.frame = scrollView.bounds

        let V3 = self.storyboard?.instantiateViewController(withIdentifier: "third")
        self.addChildViewController(V3!)
        self.scrollView.addSubview(V3!.view)
        V3?.didMove(toParentViewController: self)
        V3?.view.frame = scrollView.bounds

        var V1Frame: CGRect = V1!.view.frame
        V1Frame.origin.y = 0
        V1?.view.frame = V1Frame

        var V2Frame: CGRect = V2!.view.frame
        V2Frame.origin.y = (self.view.frame.height)
        V2?.view.frame = V2Frame

        var V3Frame: CGRect = V3!.view.frame
        V3Frame.origin.y = (self.view.frame.height)*2
        V3?.view.frame = V3Frame
    
    override func viewDidLayoutSubviews() 
        scrollView.contentSize = CGSize(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height*3)
    

注意:从安全区域移除顶部和底部约束,并从SuperView添加它们(对于滚动视图,InnerView(FirstVC, SecondVC, ThirdVC))`

您可以检查演示项目的所有功能和约束。下载地址:https://www.dropbox.com/s/4ovfqmrtwt2i8yi/***.zip?dl=0

我已经在iPhoneXiPhone6iPhone8+ 测试了演示

截图如下:

【讨论】:

【参考方案2】:

你可以轻松解决这个问题。

1

2。

【讨论】:

我是否为滚动视图或单个视图或所有视图执行此操作 是的,此方法适用于任何对象,如滚动视图、表格视图、图像视图、按钮等。 我相信它正在工作,我认为我现在遇到的问题是 self.scrollView.contentSize = CGSize(width: self.view.frame.width, height: self.view.frame. size.height * 3) 并且视图的位置需要根据顶部和底部安全区域高度进行调整 你知道组合高度是多少吗? 这个答案对 UIKit 对象的设置框架有效。如果你想在滚动视图数据中设置,那么你需要在滚动视图中设置用户 contentInset。【参考方案3】:

使用安全区域设置约束 在这里您可以结帐...

https://***.com/a/45334411/6898523

https://developer.apple.com/ios/human-interface-guidelines/overview/iphone-x/

一旦您将滚动视图约束设置为安全区域..选择您的 viewController 场景并 取消选中Adjust scroll view insets 属性。

更新

if #available(iOS 11.0, *) 
   fullScreenScrollView?.contentInsetAdjustmentBehavior = .always
 

【讨论】:

问题是由代码中滚动视图上视图的内容大小和 y 位置设置引起的吗? 可能是由于内容大小...但是您确认滚动视图顶部和底部的安全区域吗? 我已经确认,我认为问题在于滚动视图内容大小和视图在滚动视图上的 y 位置。任何想法如何纠正这些以考虑安全区域 @user6520705 我更新了我的答案(在底部添加了一段代码)请尝试一下。

以上是关于iOS 11 Swift 4 iPhone X Safe Area 支持全屏ScrollView的主要内容,如果未能解决你的问题,请参考以下文章

为iOS8创建Launch Screen.xib(... iOS11,Swift 4和LaunchScreen.storyboard)

iPhone X 设计适配指南 & iOS 11 新特性

UIPageViewController 页面控件太靠近 iPhone X iOS 11 上的主页栏

Swift 4 相机视图,为啥这会在 iPad 而不是 iPhone 上崩溃?

XCode 11.3 崩溃,iOS 13.2.2 模拟器 iPhone X 和 watchOS 4.2 Apple Watch 42mm

iOS11 与 iPhone X适配的那些坑(持更中...)