Swift 使用“自动布局”将对象均匀隔开

Swift 使用“自动布局”将对象均匀隔开,swift,autolayout,equals,nslayoutconstraint,Swift,Autolayout,Equals,Nslayoutconstraint,我下面的代码试图基于下面的照片。PicLocate应占据视图的60%高度。图[0]和图应占据10%的高度,且宽度均匀。所有对象在视图之间的间距应为10-15。主要是看起来应该和照片一样 导入UIKit 类ViewController:UIViewController{ var picLocate=UIImageView() var jessicaAlba:Float=50 var topConstraint:NSLayoutConstraint! var heightConstraint:NS

我下面的代码试图基于下面的照片。PicLocate应占据视图的60%高度。图[0]和图应占据10%的高度,且宽度均匀。所有对象在视图之间的间距应为10-15。主要是看起来应该和照片一样

导入UIKit
类ViewController:UIViewController{
var picLocate=UIImageView()
var jessicaAlba:Float=50
var topConstraint:NSLayoutConstraint!
var heightConstraint:NSLayoutConstraint!
var leadingConstraint:NSLayoutConstraint!
var trailingConstraint:NSLayoutConstraint!

让pic=(0..在编写约束时对其进行注释非常有帮助。通常,这会让您意识到您想要做什么

要获得所需的布局,您需要:

  • picLocate
    height设置为视图高度的60%(使用当前代码,您还将从60%中减去50分)
  • 将左侧pic(按钮)的前导设置为
    picLocate的前导
  • 将右侧pic(按钮)的尾部设置为
    picLocate
  • 将右pic的前导设置为左pic的尾随+10分作为间距
  • 然后设置右侧图片宽度等于左侧图片宽度
结果:

并且,在横向中,它会自动调整到所需的百分比:

这是您的代码,以及我描述的更改。请查看并查看注释:

class ViewController: UIViewController {

    var picLocate = UIImageView()

    var jessicaAlba:CGFloat = 50

    var topConstraint: NSLayoutConstraint!
    var heightConstraint: NSLayoutConstraint!
    var leadingConstraint: NSLayoutConstraint!
    var trailingConstraint: NSLayoutConstraint!

    let pic = (0..<3).map { _ in UIButton() }

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .white

        [picLocate,pic[0],pic[1]].forEach {
            $0.translatesAutoresizingMaskIntoConstraints = false
            view.addSubview($0)
            $0.backgroundColor = .systemOrange
        }

        // 50-pts (jessicaAlba) from top of view
        topConstraint = picLocate.topAnchor.constraint(equalTo: view.topAnchor, constant: jessicaAlba)

        // 60% of view height minus 50-pts == ((0.6 * view height) - 50)
        heightConstraint = picLocate.heightAnchor.constraint(equalTo: view.heightAnchor , multiplier: 0.6, constant: -jessicaAlba)

        // if you actually want 60% of view height, set constant to 0.0
        //heightConstraint = picLocate.heightAnchor.constraint(equalTo: view.heightAnchor , multiplier: 0.6, constant: 0.0)

        // 50-pts leading and trailing
        leadingConstraint = picLocate.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: jessicaAlba)
        trailingConstraint = picLocate.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -jessicaAlba)

        NSLayoutConstraint.activate([

            topConstraint,
            heightConstraint,
            leadingConstraint,
            trailingConstraint,

            // "left pic" top is 10-pts below "picLocate" bottom
            pic[0].topAnchor.constraint(equalTo: picLocate.bottomAnchor, constant: 10.0),

            // "left pic" leading equal to "picLocate" leading
            pic[0].leadingAnchor.constraint(equalTo: picLocate.leadingAnchor, constant: 0.0),

            // "left pic" height equal to 10% of view height
            pic[0].heightAnchor.constraint(equalTo: view.heightAnchor, multiplier: 0.10),

            // "right pic" top equal to "left pic" top
            pic[1].topAnchor.constraint(equalTo: pic[0].topAnchor),

            // "right pic" height equal to "left pic" height
            pic[1].heightAnchor.constraint(equalTo: pic[0].heightAnchor),

            // "right pic" trailing equal to "picLocate" trailing
            pic[1].trailingAnchor.constraint(equalTo: picLocate.trailingAnchor, constant: 0.0),

            // "right pic" leading equal to "left pic" trailing plust 10-pts
            pic[1].leadingAnchor.constraint(equalTo: pic[0].trailingAnchor, constant: 10.0),

            // "right pic" width equal to "left pic" width
            pic[1].widthAnchor.constraint(equalTo: pic[0].widthAnchor),

        ])

        pic[0].setTitle("Add Box", for: .normal)
        pic[1].setTitle("Save Photo", for: .normal)

    }
}
类ViewController:UIViewController{
var picLocate=UIImageView()
var jessicaAlba:CGFloat=50
var topConstraint:NSLayoutConstraint!
var heightConstraint:NSLayoutConstraint!
var leadingConstraint:NSLayoutConstraint!
var trailingConstraint:NSLayoutConstraint!

让pic=(0..试着为你的身高使用乘数constraints@AlexandrKolesnik你能给我看一些代码吗?谢谢。
class ViewController: UIViewController {

    var picLocate = UIImageView()

    var jessicaAlba:CGFloat = 50

    var topConstraint: NSLayoutConstraint!
    var heightConstraint: NSLayoutConstraint!
    var leadingConstraint: NSLayoutConstraint!
    var trailingConstraint: NSLayoutConstraint!

    let pic = (0..<3).map { _ in UIButton() }

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .white

        [picLocate,pic[0],pic[1]].forEach {
            $0.translatesAutoresizingMaskIntoConstraints = false
            view.addSubview($0)
            $0.backgroundColor = .systemOrange
        }

        // 50-pts (jessicaAlba) from top of view
        topConstraint = picLocate.topAnchor.constraint(equalTo: view.topAnchor, constant: jessicaAlba)

        // 60% of view height minus 50-pts == ((0.6 * view height) - 50)
        heightConstraint = picLocate.heightAnchor.constraint(equalTo: view.heightAnchor , multiplier: 0.6, constant: -jessicaAlba)

        // if you actually want 60% of view height, set constant to 0.0
        //heightConstraint = picLocate.heightAnchor.constraint(equalTo: view.heightAnchor , multiplier: 0.6, constant: 0.0)

        // 50-pts leading and trailing
        leadingConstraint = picLocate.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: jessicaAlba)
        trailingConstraint = picLocate.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -jessicaAlba)

        NSLayoutConstraint.activate([

            topConstraint,
            heightConstraint,
            leadingConstraint,
            trailingConstraint,

            // "left pic" top is 10-pts below "picLocate" bottom
            pic[0].topAnchor.constraint(equalTo: picLocate.bottomAnchor, constant: 10.0),

            // "left pic" leading equal to "picLocate" leading
            pic[0].leadingAnchor.constraint(equalTo: picLocate.leadingAnchor, constant: 0.0),

            // "left pic" height equal to 10% of view height
            pic[0].heightAnchor.constraint(equalTo: view.heightAnchor, multiplier: 0.10),

            // "right pic" top equal to "left pic" top
            pic[1].topAnchor.constraint(equalTo: pic[0].topAnchor),

            // "right pic" height equal to "left pic" height
            pic[1].heightAnchor.constraint(equalTo: pic[0].heightAnchor),

            // "right pic" trailing equal to "picLocate" trailing
            pic[1].trailingAnchor.constraint(equalTo: picLocate.trailingAnchor, constant: 0.0),

            // "right pic" leading equal to "left pic" trailing plust 10-pts
            pic[1].leadingAnchor.constraint(equalTo: pic[0].trailingAnchor, constant: 10.0),

            // "right pic" width equal to "left pic" width
            pic[1].widthAnchor.constraint(equalTo: pic[0].widthAnchor),

        ])

        pic[0].setTitle("Add Box", for: .normal)
        pic[1].setTitle("Save Photo", for: .normal)

    }
}