ios - programmatically - xcode auto layout scrollview




Usando o ScrollView por meio de programação no Swift 3 (3)

Eu pesquisei outras questões e parece que ainda tenho alguns problemas para criar meu scrollView programaticamente com o autolayout em swift 3. Eu posso fazer com que meu scrollview apareça como mostrado na figura abaixo, mas quando eu rolar para o fundo meu outro rótulo não aparece e o rótulo 'scroll top' não desaparece.

Espero que alguém possa ajudar a rever meu código abaixo!

import UIKit

class ViewController: UIViewController {

let labelOne: UILabel = {
    let label = UILabel()
    label.text = "Scroll Top"
    label.backgroundColor = .red
    label.translatesAutoresizingMaskIntoConstraints = false
    return label
}()

let labelTwo: UILabel = {
    let label = UILabel()
    label.text = "Scroll Bottom"
    label.backgroundColor = .green
    label.translatesAutoresizingMaskIntoConstraints = false
    return label
}()


override func viewDidLoad() {
    super.viewDidLoad()

    let screensize: CGRect = UIScreen.main.bounds
    let screenWidth = screensize.width
    let screenHeight = screensize.height
    var scrollView: UIScrollView!
    scrollView = UIScrollView(frame: CGRect(x: 0, y: 120, width: screenWidth, height: screenHeight))
    scrollView.contentSize = CGSize(width: screenWidth, height: 2000)
    scrollView.addSubview(labelOne)
    scrollView.addSubview(labelTwo)


    view.addSubview(labelOne)
    view.addSubview(labelTwo)
    view.addSubview(scrollView)

    // Visual Format Constraints
    view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[v0]|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0": labelOne]))
    view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-100-[v0]", options: NSLayoutFormatOptions(), metrics: nil, views: ["v0": labelOne]))

    // Using iOS 9 Constraints in order to place the label past the iPhone 7 view
    view.addConstraint(NSLayoutConstraint(item: labelTwo, attribute: .top, relatedBy: .equal, toItem: labelOne, attribute: .bottom, multiplier: 1, constant: screenHeight + 200))
    view.addConstraint(NSLayoutConstraint(item: labelTwo, attribute: .right, relatedBy: .equal, toItem: labelOne, attribute: .right, multiplier: 1, constant: 0))
    view.addConstraint(NSLayoutConstraint(item: labelTwo, attribute: .left, relatedBy: .equal, toItem: labelOne, attribute: .left, multiplier: 1, constant: 0)     

    }

}

É fácil usar restrições para definir o tamanho do conteúdo de rolagem - para que você não precise fazer cálculos manuais.

Apenas lembra-te:

  1. Os elementos de conteúdo da sua visualização de rolagem devem ter valores de esquerda / topo / largura / altura. No caso de objetos como rótulos, eles têm tamanhos intrínsecos, portanto, você só precisa definir a esquerda e o topo.
  2. Os elementos de conteúdo da sua vista de rolagem também definem os limites da área rolável - o contentSize - mas eles o fazem com as restrições bottom e right.
  3. Combinando esses dois conceitos, você vê que precisa de uma "cadeia contínua" com pelo menos um elemento definindo as extensões superior / esquerda / inferior / direita.

Aqui está um exemplo simples, que será executado diretamente em uma página do Playground:

import UIKit
import PlaygroundSupport

class TestViewController : UIViewController {

    let labelOne: UILabel = {
        let label = UILabel()
        label.text = "Scroll Top"
        label.backgroundColor = .red
        label.translatesAutoresizingMaskIntoConstraints = false
        return label
    }()

    let labelTwo: UILabel = {
        let label = UILabel()
        label.text = "Scroll Bottom"
        label.backgroundColor = .green
        label.translatesAutoresizingMaskIntoConstraints = false
        return label
    }()

    let scrollView: UIScrollView = {
        let v = UIScrollView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = .cyan
        return v
    }()


    override func viewDidLoad() {
        super.viewDidLoad()

        // add the scroll view to self.view
        self.view.addSubview(scrollView)

        // constrain the scroll view to 8-pts on each side
        scrollView.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 8.0).isActive = true
        scrollView.topAnchor.constraint(equalTo: view.topAnchor, constant: 8.0).isActive = true
        scrollView.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -8.0).isActive = true
        scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -8.0).isActive = true

        // add labelOne to the scroll view
        scrollView.addSubview(labelOne)

        // constrain labelOne to left & top with 16-pts padding
        // this also defines the left & top of the scroll content
        labelOne.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor, constant: 16.0).isActive = true
        labelOne.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: 16.0).isActive = true

        // add labelTwo to the scroll view
        scrollView.addSubview(labelTwo)

        // constrain labelTwo at 400-pts from the left
        labelTwo.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor, constant: 400.0).isActive = true

        // constrain labelTwo at 1000-pts from the top
        labelTwo.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: 1000).isActive = true

        // constrain labelTwo to right & bottom with 16-pts padding
        labelTwo.rightAnchor.constraint(equalTo: scrollView.rightAnchor, constant: -16.0).isActive = true
        labelTwo.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor, constant: -16.0).isActive = true

    }

}


let vc = TestViewController()
vc.view.backgroundColor = .yellow
PlaygroundPage.current.liveView = vc

Definir imagens de rolagem para o papel de parede:

@IBOutlet var scroll_view_img: UIScrollView!

var itemPhotoList = NSMutableArray()

var button = NSMutableArray()    

@IBOutlet var imageview_big: UIImageView!

override func viewDidLoad() {

    super.viewDidLoad()
    itemPhotoList = ["grief-and-loss copy.jpg","aaa.jpg","image_4.jpeg"]        

    // button = ["btn1","btn2"]

    let width:CGFloat = 100
    let height:CGFloat = 100
    var xposition:CGFloat = 10
    var scroll_contont:CGFloat = 0

    for i in 0 ..< itemPhotoList.count
    {
        var button_img = UIButton()
        button_img = UIButton(frame: CGRect(x: xposition, y: 50, width: width, height: height))
        let img = UIImage(named:itemPhotoList[i] as! String)
        button_img.setImage(img, for: .normal)
        scroll_view_img.addSubview(button_img)
        button_img.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
        button_img.tag = i
        view.addSubview(scroll_view_img)
        xposition += width+10
        scroll_contont += width
        scroll_view_img.contentSize = CGSize(width: scroll_contont, height: height)
    }
}

func buttonAction(sender: UIButton!)
{
    switch sender.tag {
    case 0:
        imageview_big.image = UIImage(named: "grief-and-loss copy.jpg")
    case 1:
        imageview_big.image = UIImage(named: "aaa.jpg")
    case 2:
        imageview_big.image = UIImage(named: "image_4.jpeg")
    default:
        break
    }
}

Essas respostas não funcionam com títulos grandes na barra de navegação. Certifique-se de ter o código abaixo em seu método viewDidLoad () de seu controlador de visualização:

self.navigationController?.navigationBar.prefersLargeTitles = false




autolayout