约束从视图中删除SegmentController

时间:2018-09-18 12:55:35

标签: swift uicollectionview constraints uisegmentedcontrol

我有一个UICollectionView和一个SegmentController

所需的最终结果:

SegmentController完全在其下方UICollectionView可见

在添加约束之前:

enter image description here

添加约束后(注意SegmentController几乎完全隐藏了):

enter image description here

添加的约束:

ProductsCollection.removeConstraints(ProductsCollection.constraints)     SegmentController.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)
    ])

我猜问题是我没有添加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

我的视图现在看起来像:

enter image description here

2 个答案:

答案 0 :(得分:2)

您可以尝试

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)
])

enter image description here

答案 1 :(得分:1)

您的约束不正确。不应为self.view.safeAreaLayoutGuide.bottomAnchor,而应为self.view.safeAreaLayoutGuide.topAnchor。检查确切的安全区域指南给出的内容。来自苹果公司:

  

布局指南代表视图的一部分,即   不受酒吧和其他内容的影响。

很容易得出它是“边距”内部的区域。

编辑

        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,其余部分应由约束者完成