Ограничение высоты в раскадровке для настраиваемого представления с динамической высотой - PullRequest
0 голосов
/ 02 июля 2019

Здесь начинается swift ... Как установить высоту ограничения для пользовательского представления, которое переносит содержимое, или другими словами, имеющего динамическую высоту?

В Android мы используем обтекание содержимого или соответствие родителя по высоте. Соответствующий родительский эквивалент для ios устанавливает ограничение top, bottom, left, right равным 0 (если я хорошо понимаю), но как насчет содержимого переноса?

Большую часть времени высота настраиваемого вида может быть динамической. Когда я перетаскиваю представление из раскадровки, которое расширяет мой пользовательский вид, меня просят ограничить высоту ... Спасибо за помощь!

отредактировано: почему кто-то ставит -1 без объяснения причин, это такой глупый вопрос?!

1 Ответ

1 голос
/ 02 июля 2019

Первый шаг - убедиться, что вы правильно настроили свой @IBDesignable вид.

Вот простой пример с UITextField и «помощником» UILabel.

Вид текста установлен без прокрутки, что позволяет ему автоматически изменять размер по высоте на основе текста. Он будет увеличиваться / уменьшаться по мере ввода и добавления / удаления текста.

Текстовое представление и метка добавляются к вертикали UIStackView, чтобы сделать ее действительно очень удобной для разметки:

@IBDesignable
class MyCustomView: UIView {

    let theTextView: UITextView = {
        let v = UITextView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.isScrollEnabled = false
        return v
    }()

    let helperLabel: UILabel = {
        let v = UILabel()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.textAlignment = .center
        v.textColor = .white
        v.backgroundColor = .blue
        v.text = "Helper Text"
        return v
    }()

    let theStackView: UIStackView = {
        let v = UIStackView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.axis = .vertical
        v.alignment = .fill
        v.distribution = .fill
        v.spacing = 8
        return v
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }

    func commonInit() -> Void {

        // add the stack view as a subview
        addSubview(theStackView)

        // constrain the stack view top / bottom / leading / trailing
        // with 8-pts "padding" on each side
        NSLayoutConstraint.activate([

            theStackView.topAnchor.constraint(equalTo: topAnchor, constant: 8.0),
            theStackView.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -8.0),

            theStackView.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 8.0),
            theStackView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -8.0),

            ])

        // add the text view and label to the stack view
        theStackView.addArrangedSubview(theTextView)
        theStackView.addArrangedSubview(helperLabel)

    }

}

Теперь, в новом контроллере представления в раскадровке, добавьте нормальный UIView и присвойте ему цвет фона (чтобы мы могли его видеть). Добавьте ограничения Leading и Trailing 40 и добавьте ограничение Center Vertical. Это должно выглядеть примерно так:

enter image description here

и раскадровка скажет вам, что нужно ограничение:

enter image description here

Выбрав вид, перейдите к Identity Inspector и измените класс на MyCustomClass. Если у вас включено ** Автоматически обновлять представления`, оно должно измениться на:

enter image description here

Теперь он центрирован по вертикали и использует собственную высоту (определяется внутренними высотами текстового представления и метки, встроенной в представление стека). Больше не нужно Требуются ограничения для: Y позиции или высоты Сообщение об ошибке, без необходимости устанавливать какие-либо дополнительные ограничения.

Когда вы запустите приложение (и введете текст в текстовое представление), вы получите следующее:

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...