Как правильно настроить фоновое изображение в режиме прокрутки?

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

Однако мое приложение слишком увеличено в изображении.

lazy var scrollView: UIScrollView = {
    let view = UIScrollView()
    view.translatesAutoresizingMaskIntoConstraints = false
    view.contentSize.height = 800
    view.bounces = true
    return view
}() 

переопределить функцию viewDidLoad() { super.viewDidLoad()

    let backgroundImage = UIImageView(frame: UIScreen.main.bounds)
    backgroundImage.image = UIImage(named: "backgroundImage.png")
    backgroundImage.contentMode = UIViewContentMode.scaleAspectFit
    view.insertSubview(backgroundImage, at: 0)

    view.addSubview(scrollView)
    scrollView.anchor(top: view.topAnchor, left: view.leftAnchor, bottom: view.bottomAnchor, right: view.rightAnchor, paddingTop: 0, paddingLeft: 0, paddingBottom: 0, paddingRight: 0, width: 0, height: 0)

    scrollView.addSubview(backgroundImage)
    backgroundImage.center(x: scrollView.centerXAnchor, y: scrollView.centerYAnchor)


 }

// это просто расширение, которое я использую для автомакетов, если вам интересно

extension UIView {

func anchor(top: NSLayoutYAxisAnchor?, left: NSLayoutXAxisAnchor?, bottom: NSLayoutYAxisAnchor?, right: NSLayoutXAxisAnchor?, paddingTop: CGFloat, paddingLeft: CGFloat, paddingBottom: CGFloat, paddingRight: CGFloat, width: CGFloat, height: CGFloat) {

    translatesAutoresizingMaskIntoConstraints = false

    if let top = top {
        topAnchor.constraint(equalTo: top, constant: paddingTop).isActive = true
    }

    if let left = left {
        leftAnchor.constraint(equalTo: left, constant: paddingLeft).isActive = true
    }

    if let bottom = bottom {
        bottomAnchor.constraint(equalTo: bottom, constant: -paddingBottom).isActive = true
    }

    if let right = right {
        rightAnchor.constraint(equalTo: right, constant: -paddingRight).isActive = true
    }

    if width != 0 {
        widthAnchor.constraint(equalToConstant: width).isActive = true
    }

    if height != 0 {
        heightAnchor.constraint(equalToConstant: height).isActive = true
    }

func center(x: NSLayoutXAxisAnchor?, y: NSLayoutYAxisAnchor? ) {

    translatesAutoresizingMaskIntoConstraints = false

    if let x = x {
        centerXAnchor.constraint(equalTo: x).isActive = true
    }

    if let y = y {
        centerYAnchor.constraint(equalTo: y).isActive = true
    }
}
}

person Hiromi Kawasaki    schedule 11.09.2018    source источник


Ответы (1)


Сначала вы добавляете один и тот же imageView в двух местах.

view.insertSubview(backgroundImage, at: 0)

и здесь

scrollView.addSubview(backgroundImage)

поэтому в конечном итоге он будет добавлен только к scrollView, поскольку это один объект

Во-вторых вам нужно ограничить imageView следующим образом

backgroundImage.anchor(top: scrollView.topAnchor, left: scrollView.leftAnchor, bottom: scrollView.bottomAnchor, right: scrollView.rightAnchor, paddingTop: 0, paddingLeft: 0, paddingBottom: 0, paddingRight: 0, width: 0, height: 0)

а затем в соответствии с содержимым scrollView imageView будет растягиваться

Третий contentMode должен быть либо

backgroundImage.contentMode =.scaleToFill // or .scaleAspectFill

Следует упомянуть, что вы можете добавить imageView в self.view и сделать фон scrollView прозрачным, чтобы избежать потери качества и аспекта imageView, вызванного растяжением.

person Sh_Khan    schedule 11.09.2018
comment
На самом деле я масштабировал свои изображения за пределами Swift, чтобы они соответствовали приложению, но ваш ответ помог мне лучше понять прокрутку и просмотры. Спасибо - person Hiromi Kawasaki; 12.09.2018