UICollectionView 内容被 TabBar 隐藏

UICollectionView content hidden by TabBar

问题

你好,社区!我以编程方式创建了一个 UICollectionView 并希望它显示占据整个屏幕大小的图像,超过顶部安全区域但尊重底部安全区域,因为在底部我有 TabBar。当前 UI 的问题是我让它忽略了顶部安全区域,但标签栏隐藏了部分内容,因为集合占据了整个屏幕的大小 (Video)。我正在尝试让我的 UI 看起来像 TikTok 主页,其中 collectionView 在标签栏开始时结束。

我的代码

在 ViewDidLoad 中:

let layout = UICollectionViewFlowLayout()
self.edgesForExtendedLayout = UIRectEdge.bottom
layout.scrollDirection = .vertical
layout.itemSize = CGSize(width: view.frame.size.width, height: view.frame.size.height)
layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0
collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
collectionView?.register(PostCollectionViewCell.self, forCellWithReuseIdentifier: PostCollectionViewCell.identifier)
collectionView?.isPagingEnabled = true
collectionView?.dataSource = self
collectionView?.showsVerticalScrollIndicator = false
collectionView?.showsHorizontalScrollIndicator = false
view.addSubview(collectionView!)

在 ViewDidLayoutSubviews:

collectionView?.contentInsetAdjustmentBehavior = .never
collectionView?.frame = view.bounds

我试过的

layout.itemSize = CGSize(width: view.frame.size.width, height: view.frame.size.height - (self.tabBarController?.tabBar.frame.height)!)

正在将tabBar的高度减去CollectionViewFlowLayout

collectionView?.contentInset = UIEdgeInsets(top: 0, left: 0, bottom: self.tabBarController!.tabBar.frame.height, right: 0)
collectionView?.contentSize = CGSize(width: view.frame.size.width, height: view.frame.size.height - self.tabBarController!.tabBar.frame.height)

非常感谢!

您应该使用 auto-layout 而不是手动设置集合视图的框架。 view.addSubview(collectionView!) 后放:

collectionView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor).isActive = true

这会将集合视图的底部锚点固定到视图的底部安全区域,该区域应占选项卡栏。

您应该从 viewDidLayoutSubviews 中删除 collectionView?.frame = view.bounds

此外,您不应在 viewDidLoad 中设置 itemSize,因为视图的框架可能会更改。您可以在 viewDidLayoutSubviews.

中设置