【问题标题】:CollectionView content under navigation bar导航栏下的 CollectionView 内容
【发布时间】:2017-12-11 12:48:58
【问题描述】:

希望 collectionView 的内容从屏幕的最顶部(状态栏顶部)开始,因为我有透明的导航栏,我想避免幻数,它应该与iPhone X 和其他 iPhone。

我尝试了什么?

collectionView.contentInset = UIEdgeInsets(top: -64, left: 0, bottom: 0, right: 0)

但这不是一个优雅的解决方案,对于 iPhone X 也不正确,需要增加插图

任何干净的解决方案?

面向 iOS 10 和 11

【问题讨论】:

  • 用主视图设置 UICollectionView 顶部 0。无需设置 contentInset。

标签: ios swift uicollectionview uinavigationbar iphone-x


【解决方案1】:

将此添加到包含UICollectionViewUIViewController 中,以防止集合视图位于导航栏下方。例如。在viewDidLoad 方法中:

斯威夫特 4

self.edgesForExtendedLayout = UIRectEdge.bottom

您甚至可以设置edgesForExtendedLayout = [] 以防止集合视图也进入UITabBars。

【讨论】:

  • 这个对我有用,但另外我必须使用 -64(导航栏 + 状态栏)作为使用顶部安全区域限制集合视图的值。
【解决方案2】:

对于 Swift 5 试试这个

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true

并从 IB Size Inspector 选项卡中将“content Insets”设置为“Never”。

【讨论】:

    【解决方案3】:

    如果您正在使用界面生成器,这可以通过将集合视图的顶部空间约束设置为具有来自 superview 的 0 constant不是 safe area 来轻松完成。

            view.addSubview(collectionView)
            collectionView.translatesAutoresizingMaskIntoConstraints = false
            collectionView.topAnchor.constraint(equalTo: view.topAnchor, constant: 0).isActive = true
            collectionView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0).isActive = true
            collectionView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: 0).isActive = true
            collectionView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: 0).isActive = true
    

    考虑到这种方法适用于 iOS11,但会在 iOS10 上崩溃。这是因为我仍在使用安全区域进行前导和尾随,iOS10 中没有安全区域。使用 Xcode 9 和界面生成器,您可以免费转换从安全区域到布局指南。

    【讨论】:

    • 代码可以吗?我正在使用SnapKit,但我可以使用本机代码布局系统
    • 我从未使用过 snapkit,但使用自动布局 API 可能是这样的,我已经更新了答案
    【解决方案4】:

    如果您的收藏视图已经全屏,您还应该将collectionView.contentInsetAdjustmentBehavior 设置为.never

    【讨论】:

      【解决方案5】:

      在包含集合视图的视图控制器上添加此属性

      self.edgesForExtendedLayout = []

      【讨论】:

        猜你喜欢
        • 2020-07-01
        • 1970-01-01
        • 2018-08-02
        • 1970-01-01
        • 2019-05-14
        • 2015-01-13
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多