UICollectionview：滚动到顶部时安全区域上的灰色条

Posted 2023-02-15

【中文标题】UICollectionview：滚动到顶部时安全区域上的灰色条

【英文标题】：UICollectionview: Grey Bar on safe Area on scroll to the top

【发布时间】：2021-12-27 00:27:26

【问题描述】：

希望你的一周有一个美好的开始！

向上滚动 UICollectionView 时，底部会出现一个灰色条，覆盖底部的 uiView。当我向下滚动时它会消失。我查看了有关堆栈溢出的多个帖子，但找不到适合我的帖子。你能帮忙吗？

import SwiftUI

class MyViewController : UIViewController, UICollectionViewDelegateFlowLayout, UICollectionViewDelegate, UICollectionViewDataSource

 @IBOutlet var myCollectionView: UICollectionView!
 @IBOutlet var homeButton: UIButton!
 @IBOutlet var totshelfButton: UIButton!
 @IBOutlet var profileButton: UIButton!
 @IBOutlet var tabView: UIView!
 @IBOutlet var buttonStack: UIStackView!
 @IBOutlet var borderView: UIView!
 @IBOutlet var labelView: UIView!

 override func viewDidLoad() 
        
        super.viewDidLoad()
        myCollectionView.backgroundColor = .white
        
        myCollectionView.register(UINib(nibName: "MyReusableView", bundle: .none), forCellWithReuseIdentifier: cellid)
        
        myCollectionView.register(UINib(nibName: "HeaderCollectionReusableView", bundle: .none), forSupplementaryViewOfKind: currMonthID, withReuseIdentifier: headerID)
        
        myCollectionView.dataSource = self
        myCollectionView.delegate = self
        
        let layout = setupLayout()
        myCollectionView.collectionViewLayout = layout

    

    override func viewDidLayoutSubviews() 
        
        super.viewDidLayoutSubviews()
        myCollectionView.contentInsetAdjustmentBehavior = .never
        myCollectionView.contentInset = UIEdgeInsets.zero
        myCollectionView.scrollIndicatorInsets = UIEdgeInsets.zero
    
    

    override func viewWillAppear(_ animated: Bool) 
        
        super.viewWillAppear(true)
        self.view.sendSubviewToBack(myCollectionView)
        self.view.bringSubviewToFront(borderView)
        self.view.bringSubviewToFront(tabView)
        self.view.bringSubviewToFront(labelView)
        
        self.tabView.layer.zPosition = 1
        self.labelView.layer.zPosition = 1
        self.borderView.layer.zPosition = 1
    
    

    func setupLayout()-> UICollectionViewCompositionalLayout
    
       return UICollectionViewCompositionalLayout  sectionNumber, env in 
       
                     let item = NSCollectionLayoutItem(layoutSize: .init(widthDimension: .fractionalWidth(0.5), heightDimension: .fractionalHeight(1)))
                               item.contentInsets.trailing = 12
                               item.contentInsets.bottom = 20
                               
                           let group = NSCollectionLayoutGroup.horizontal(layoutSize: .init(widthDimension: .fractionalWidth(1), heightDimension: .fractionalHeight(0.5)), subitems: [item])
                               let section = NSCollectionLayoutSection(group: group)
                            section.contentInsets = NSDirectionalEdgeInsets(top: 10, leading: 10, bottom: 80, trailing: 0)
                           
                           section.boundarySupplementaryItems = [.init(layoutSize: .init(widthDimension: .fractionalWidth(1), heightDimension: .absolute(50.0)), elementKind: self.currMonthID, alignment: .topLeading)]
                           
                           return section

       
    

  func collectionView(_ collectionView: UICollectionView,
                        layout collectionViewLayout: UICollectionViewLayout,
                        sizeForItemAt indexPath: IndexPath) -> CGSize 

        return CGSize(width: self.myCollectionView.frame.width, height: self.myCollectionView.frame.height)
    
    

Screenshot View Hierarchy

【参考方案1】：

我认为您必须使用 zpositions。从您的问题中，我无法找出您使用该 tabView 的原因。您应该尝试将视图嵌入到 tabbarcontroller。

但尝试发送“返回”标签视图或向前推进其他所有内容。而且我觉得这不是最终解决方案，但绝对可以解决。

self.tabView.layer.zPosition = 0 

或

myCollectionView.layer.zPosition = 3 

【讨论】：

感谢您的快速和善意的回应，Akos！我试过这个，不幸的是它没有奏效。请让我知道我还能尝试什么。

如果我理解正确你想要一个自定义标签栏？而你只是限制了一个 UIView？您可以自定义标签栏以使其看起来像您想要的那样。它会让你的生活更轻松。我猜您将 Viewcontroller 嵌入到 TabbarController 中。如果您在情节提要上选择 Viewcontroller 并转到菜单栏：Editor->Embed In->Tab bar controller。如果它被勾选，只需取消它，标签栏就会消失。但是如果你想要一个标签栏控制的应用程序，你应该使用一个标签栏控制器，并自定义它的外观。

嗨 Akos，是的，我正在尝试自定义标签栏。我会试试你推荐的。您能否告诉我滚动 UICollectionView 时底部出现灰色条的原因？

底部的灰色条是系统标签栏，即标签栏控制器使用的。正如我在前面的评论中提到的，您必须为标签栏创建一个自定义类并与情节提要上的标签栏连接。你可以修改外观。 youtube.com/watch?v=_N4lxebmJ2U

这成功了！非常感谢，阿科斯！ :) 抱歉，由于我对 *** 还很陌生，因此没有反映出我对您的回复的投票。