Question

我正在开发“ Hangman”应用程序。在顶部，我想要图像，在中间的文本字段中，底部是UIStackView行的字母。现在，我尝试只为两个UIStackView添加约束，一个在另一个约束之下，但是一个约束总是落后于另一个约束。看不到。

这是您只能看到第二个堆栈视图（名为：stacklView2）的图像，而我看不到第一个。为什么？我做错了什么？

这是代码：

import UIKit

class ViewController: UIViewController {

    var imageView: UIImageView!
    var answerTextfield: UITextField!

    override func loadView() {
        view = UIView()
        view.backgroundColor = .white

        imageView = UIImageView()
        imageView.translatesAutoresizingMaskIntoConstraints = false
        imageView.contentMode = .scaleAspectFit
        imageView.layer.borderWidth = 1
        view.addSubview(imageView)

        answerTextfield = UITextField()
        answerTextfield.translatesAutoresizingMaskIntoConstraints = false
        answerTextfield.textAlignment = .center
        answerTextfield.isUserInteractionEnabled = false
        answerTextfield.layer.borderWidth = 1
        view.addSubview(answerTextfield)

        let button1 = UIButton()
        button1.backgroundColor = .red

        let button2 = UIButton()
        button2.backgroundColor = .blue

        let stackView1 = UIStackView(arrangedSubviews: [button1, button2])
        stackView1.translatesAutoresizingMaskIntoConstraints = false
        stackView1.distribution = .fillEqually
        stackView1.axis = .horizontal
        view.addSubview(stackView1)    

        let stackView2 = UIStackView(arrangedSubviews: [button2, button1])
        stackView2.translatesAutoresizingMaskIntoConstraints = false
        stackView2.distribution = .fillEqually
        stackView2.axis = .horizontal
        view.addSubview(stackView2)

        NSLayoutConstraint.activate([
            imageView.topAnchor.constraint(equalTo: view.layoutMarginsGuide.topAnchor, constant: 5),
            imageView.centerXAnchor.constraint(equalTo: view.centerXAnchor),

            answerTextfield.topAnchor.constraint(equalTo: imageView.bottomAnchor, constant: 20),
            answerTextfield.widthAnchor.constraint(equalTo: view.layoutMarginsGuide.widthAnchor, multiplier: 0.5),
            answerTextfield.centerXAnchor.constraint(equalTo: view.centerXAnchor),

            stackView1.topAnchor.constraint(equalTo: answerTextfield.bottomAnchor, constant: 20),
            stackView1.widthAnchor.constraint(equalTo: view.layoutMarginsGuide.widthAnchor, multiplier: 1.0),
            stackView1.centerXAnchor.constraint(equalTo: view.layoutMarginsGuide.centerXAnchor),
            //stackView1.bottomAnchor.constraint(equalTo: stackView2.layoutMarginsGuide.topAnchor, constant: -5),

            stackView2.topAnchor.constraint(equalTo: stackView1.bottomAnchor, constant: 20),
            stackView2.widthAnchor.constraint(equalTo: view.layoutMarginsGuide.widthAnchor, multiplier: 1.0),
            stackView2.centerXAnchor.constraint(equalTo: view.layoutMarginsGuide.centerXAnchor),
            stackView2.bottomAnchor.constraint(equalTo: view.layoutMarginsGuide.bottomAnchor, constant: -5),
        ])

    }

    override func viewDidLoad() {
        super.viewDidLoad()
        imageView.image = UIImage(named: "Hangman-0")
        answerTextfield.text = "T E X T F I E L D"
        setupNavigationBar()
    }

    func setupNavigationBar() {
        let hintButton = UIButton(type: .infoLight)
        hintButton.addTarget(self, action: #selector(hintTapped), for: .touchUpInside)
        navigationItem.leftBarButtonItem = UIBarButtonItem(customView: hintButton)

        navigationItem.rightBarButtonItem = UIBarButtonItem(barButtonSystemItem: .add, target: self, action: #selector(newGameTapped))
    }

    @objc func hintTapped() {
        print("Hint button tapped!")
    }

    @objc func newGameTapped() {
        print("New Game button tapped!")
    }

}

Answer 1

在两个堆栈中使用相同的对象button1和button2

let stackView1 = UIStackView(arrangedSubviews: [button1, button2]) 
let stackView2 = UIStackView(arrangedSubviews: [button2, button1])

因此它被添加到stackView2中，只需要创建另外2个其他元素即可，因为单个元素只能添加到1个视图中

两个UIStackView的约束-一个约束另一个约束

1 个答案: