Как программно выровнять ImageView по низу ScrollView? - PullRequest
1 голос
/ 01 июля 2019

Я пытаюсь выровнять фоновое изображение в нижней части вида с прокруткой, который умещается на экране, программно с помощью Autolayout.В идеале я хочу, чтобы изображение всегда было выровнено внизу прокрутки.Когда содержимое представления прокрутки выходит за пределы высоты экрана или когда размер содержимого представления прокрутки меньше высоты экрана с представлением прокрутки, подходящим для всего экрана.

MyView

class MyView: UIView {

    let myScrollView: UIScrollView = {
        let scrollView = UIScrollView()
        scrollView.translatesAutoresizingMaskIntoConstraints = false
        scrollView.bounces = false
        return scrollView
    }()

    let contentView: UIView = {
        let view = UIView()
        view.backgroundColor = .red
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    let myLabel: UILabel = {
        let label = UILabel()
        label.translatesAutoresizingMaskIntoConstraints = false
        label.text = "Hello world"
        label.font = UIFont.systemFont(ofSize: 24)
        return label
    }()

    let myImageView: UIImageView = {
        let imageView = UIImageView()
        imageView.translatesAutoresizingMaskIntoConstraints = false
        imageView.image = #imageLiteral(resourceName: "Mask Group 3")
        return imageView
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)
        setupView()
        setupConstraints()
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    private func setupView() {
        backgroundColor = .white

        addSubview(myScrollView)

        myScrollView.addSubview(contentView)

        contentView.addSubview(myLabel)
        contentView.addSubview(myImageView)
    }

    private func setupConstraints() {
        myScrollView.topAnchor.constraint(equalTo: topAnchor).isActive = true
        myScrollView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
        myScrollView.leftAnchor.constraint(equalTo: leftAnchor).isActive = true
        myScrollView.rightAnchor.constraint(equalTo: rightAnchor).isActive = true

        contentView.topAnchor.constraint(equalTo: myScrollView.topAnchor).isActive = true
        contentView.bottomAnchor.constraint(equalTo: myScrollView.bottomAnchor).isActive = true
        contentView.leftAnchor.constraint(equalTo: myScrollView.leftAnchor).isActive = true
        contentView.rightAnchor.constraint(equalTo: myScrollView.rightAnchor).isActive = true
        contentView.widthAnchor.constraint(equalTo: widthAnchor).isActive = true
        // If I am setting this and when the content size go beyond the screen, it does not scroll
        // If I don't set this, there is no content size and image view will not position correctly
//        contentView.heightAnchor.constraint(equalTo: heightAnchor).isActive = true

        myLabel.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 200).isActive = true
        myLabel.centerXAnchor.constraint(equalTo: contentView.centerXAnchor).isActive = true

        myImageView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
        myImageView.leftAnchor.constraint(equalTo: contentView.leftAnchor).isActive = true
        myImageView.rightAnchor.constraint(equalTo: contentView.rightAnchor).isActive = true
    }

}

MyViewController

import UIKit

class MyViewController: UIViewController {

    override func loadView() {
        view = MyView()
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        navigationController?.setNavigationBarHidden(true, animated: false)
    }

    override func viewDidLoad() {
        super.viewDidLoad()
    }

}

Иллюстрация

ScrollView

Ответы [ 2 ]

0 голосов
/ 16 июля 2019

Я нашел решение.

  1. A contentView необходимо.
  2. Установите ограничение contentView top, left, bottom, right равное равному scrollView ребрам.
  3. Установите contentView ширину равной равной view ширине привязки
  4. Установить contentView высоту большее значениеThanOrEqualTo view высоты привязки
  5. Установите нижнюю imageView равную для нижнего якоря contentView.
  6. Для вершины imageView установите ограничение на элемент с помощью HigherThanOrEqualTo , чтобы дать ему постоянный зазор и избежать перекрытия элементов на меньших экранах.
0 голосов
/ 01 июля 2019

Кажется, все в порядке:

private func setupConstraints() {
        myScrollView.topAnchor.constraint(equalTo: topAnchor).isActive = true
        myScrollView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
        myScrollView.leftAnchor.constraint(equalTo: leftAnchor).isActive = true
        myScrollView.rightAnchor.constraint(equalTo: rightAnchor).isActive = true

        contentView.topAnchor.constraint(equalTo: myScrollView.topAnchor).isActive = true
        contentView.bottomAnchor.constraint(equalTo: myScrollView.bottomAnchor).isActive = true
        contentView.leftAnchor.constraint(equalTo: myScrollView.leftAnchor).isActive = true
        contentView.rightAnchor.constraint(equalTo: myScrollView.rightAnchor).isActive = true
        contentView.widthAnchor.constraint(equalTo: widthAnchor).isActive = true
        // If I am setting this and when the content size go beyond the screen, it does not scroll
        // If I don't set this, there is no content size and image view will not position correctly
        contentView.heightAnchor.constraint(equalToConstant: 1400).isActive = true

        myLabel.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 200).isActive = true
        myLabel.centerXAnchor.constraint(equalTo: contentView.centerXAnchor).isActive = true

        myImageView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
        myImageView.leftAnchor.constraint(equalTo: contentView.leftAnchor).isActive = true
        myImageView.rightAnchor.constraint(equalTo: contentView.rightAnchor).isActive = true
        myImageView.heightAnchor.constraint(equalToConstant: 200).isActive = true

    }

Если вы думаете, что просто забыли указать высоту изображения:

myImageView.heightAnchor.constraint(equalToConstant: 200).isActive = true
...