从视图中删除 SegmentController 的约束

Question

我有一个UICollectionView和一个SegmentController。

要求的最终结果：

SegmentController 完全可见，UICollectionView 在其下方

添加约束前：

添加约束后（注意 SegmentController 几乎完全隐藏）：

添加的约束：

ProductsCollection.removeConstraints(ProductsCollection.constraints) SegmentController.translatesAutoresizingMaskIntoConstraints = 假

NSLayoutConstraint.activate([
    SegmentController.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    SegmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 100),
    //ProductsCollection.topAnchor.constraint(equalTo: SegmentController.bottomAnchor, constant: 10),
    ProductsCollection.leftAnchor.constraint(equalTo: view.leftAnchor),
    ProductsCollection.rightAnchor.constraint(equalTo: view.rightAnchor),
    ProductsCollection.bottomAnchor.constraint(equalTo: view.bottomAnchor)
    ])

我猜问题是我没有添加 SegmentController 约束，但是我添加时得到了相同的结果：

SegmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 100),
SegmentController.centerXAnchor.constraint(equalTo: view.centerXAnchor),

编辑：

此视图继承自另一个视图，该视图具有：

    private func createProductsCollection()
        {
            let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
            layout.itemSize = CGSize(width: 200, height: 250)

            self.ProductsCollection = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)

            ProductsCollection.dataSource = self
            ProductsCollection.delegate = self
            ProductsCollection.register(ProductsCollectionViewCell.self, forCellWithReuseIdentifier: "product_collection_cell")
            ProductsCollection.backgroundColor = UIColor.clear
            self.view.addSubview(ProductsCollection)

ProductsCollection.translatesAutoresizingMaskIntoConstraints = false

NSLayoutConstraint.activate([
                NSLayoutConstraint(item: ProductsCollection, attribute: .top, relatedBy: .equal, toItem: self.view, attribute: .top, multiplier: 1, constant: 20),
                NSLayoutConstraint(item: ProductsCollection, attribute: .bottom, relatedBy: .equal, toItem: self.view, attribute: .bottom, multiplier: 1, constant: -50), //leaving space for search field
                NSLayoutConstraint(item: ProductsCollection, attribute: .leading, relatedBy: .equal, toItem: self.view, attribute: .leading, multiplier: 1, constant: 0),
                NSLayoutConstraint(item: ProductsCollection, attribute: .trailing, relatedBy: .equal, toItem: self.view, attribute: .trailing, multiplier: 1, constant: 0)
                ])
        }

编辑#2：

我现在使用这些约束：

SegmentController.translatesAutoresizingMaskIntoConstraints = false
        SegmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor).isActive = true
        SegmentController.heightAnchor.constraint(equalToConstant: 40).isActive = true
        SegmentController.widthAnchor.constraint(equalToConstant: 120).isActive = true
        SegmentController.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = true

        self.view.addSubview(ProductsCollection)
        ProductsCollection.translatesAutoresizingMaskIntoConstraints = false
        ProductsCollection.topAnchor.constraint(equalTo: self.SegmentController.bottomAnchor).isActive = true
        ProductsCollection.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
        ProductsCollection.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
        ProductsCollection.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true

我的视图现在看起来像：

Answer 1

你可以试试

NSLayoutConstraint.activate([
      SegmentController.centerXAnchor.constraint(equalTo: view.centerXAnchor),
      SegmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 100),
      ProductsCollection.topAnchor.constraint(equalTo: SegmentController.bottomAnchor, constant: 10),
      ProductsCollection.leftAnchor.constraint(equalTo: view.leftAnchor),
      ProductsCollection.rightAnchor.constraint(equalTo: view.rightAnchor),
      ProductsCollection.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

请注意，段的顶部应该与视图的顶部相连，而不是像您在此处所做的那样与底部相连

SegmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor,

//

let SegmentController = UISegmentedControl(items: ["Safe","Ask"])

let ProductsCollection = UIView()

ProductsCollection.backgroundColor = .red

view.addSubview(SegmentController)

view.addSubview(ProductsCollection)

SegmentController.translatesAutoresizingMaskIntoConstraints = false

ProductsCollection.translatesAutoresizingMaskIntoConstraints = false

NSLayoutConstraint.activate([
    SegmentController.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    SegmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 100),
    ProductsCollection.topAnchor.constraint(equalTo: SegmentController.bottomAnchor, constant: 10),
    ProductsCollection.leftAnchor.constraint(equalTo: view.leftAnchor),
    ProductsCollection.rightAnchor.constraint(equalTo: view.rightAnchor),
    ProductsCollection.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

Answer 2

您的约束不正确。不应该是 self.view.safeAreaLayoutGuide.bottomAnchor 应该是 self.view.safeAreaLayoutGuide.topAnchor。检查安全区域指南给出的确切内容。来自苹果：

The layout guide representing the portion of your view that is unobscured by bars and other content.

由此不难看出是"margins".

里面的区域

编辑

        self.view.addSubview(segmentController)
        segmentController.translatesAutoresizingMaskIntoConstraints = false
        segmentController.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor).isActive = true
        segmentController.heightAnchor.constraint(equalToConstant: 40).isActive = true
        segmentController.widthAnchor.constraint(equalToConstant: 120).isActive = true
        segmentController.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = true

        self.view.addSubview(collectionView)
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        collectionView.topAnchor.constraint(equalTo: self.segmentController.bottomAnchor).isActive = true
        collectionView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
        collectionView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
        collectionView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true

您还需要删除此框架

self.ProductsCollection = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)

将其更改为 frame: .zero 剩下的应该由约束完成

从视图中删除 SegmentController 的约束

Constraints Removing SegmentController from view

constraints

uisegmentedcontrol

uicollectionview

swift