【问题标题】:Dynamic scrollView contentSize autoLayoutConstraints swift动态滚动视图 contentSize autoLayoutConstraints swift
【发布时间】:2018-04-20 23:22:37
【问题描述】:

我创建了一个滚动视图并在其中添加了一个包含所有页面元素的 contentView。我的问题是我希望我的containerScrollView.contentSize 根据contentView 中子视图的高度进行更改,以便它可以向下滚动。问题是我不确定如何使用约束来做到这一点。任何帮助表示赞赏

谢谢。

 var containerScrollView: UIScrollView = {
     let scrollView = UIScrollView()
     scrollView.backgroundColor = .green
     return scrollView
 }()

 var contentView: UIView = {
    let view = UIView()
    return view
 }()

 let galleryView: GalleryView = {
     let view = GalleryView()
     view.backgroundColor = .clear
     view.scrollRate = 4.5
     view.layer.cornerRadius = 4
     view.layer.masksToBounds = true
     return view
  }()

 override func viewDidLoad() {
     super.viewDidLoad()

     view.addSubview(containerScrollView)
     containerScrollView.anchor(top: view.safeAreaLayoutGuide.topAnchor, left: view.leftAnchor, bottom: view.bottomAnchor, right: view.rightAnchor, leftConstant: 10, rightConstant: 10)

    containerScrollView.layoutIfNeeded()
    containerScrollView.addSubview(contentView)

    contentView.frame.origin = CGPoint.zero
    contentView.frame.size = containerScrollView.frame.size        

    // ADDING SUBVIEWS TO CONTENTVIEW

    contentView.addSubview(galleryView)
    galleryView.anchor(top: headerView.bottomAnchor, left: containerScrollView.leftAnchor, right: containerScrollView.rightAnchor, topConstant: 18, heightConstant: view.frame.width / 1.5)
 }

【问题讨论】:

    标签: swift swift3 uiscrollview autolayout


    【解决方案1】:

    在这里查看完整示例

    class ViewController: UIViewController {
    
    
        var containerScrollView: UIScrollView = {
            let scrollView = UIScrollView()
            scrollView.translatesAutoresizingMaskIntoConstraints  = false
            scrollView.backgroundColor = .green
            return scrollView
        }()
    
        var contentView: UIView = {
            let view = UIView()
            view.translatesAutoresizingMaskIntoConstraints  = false
            view.backgroundColor = UIColor.red
            return view
        }()
    
        let galleryView1: UIView  = {
            let view = UIView()
            view.translatesAutoresizingMaskIntoConstraints  = false
            view.layer.cornerRadius = 4
            view.layer.masksToBounds = true
            view.backgroundColor = UIColor.orange
    
            return view
        }()
    
    
        let galleryView2: UIView  = {
            let view = UIView()
            view.translatesAutoresizingMaskIntoConstraints  = false
            view.layer.cornerRadius = 4
            view.layer.masksToBounds = true
            view.backgroundColor = UIColor.yellow
    
            return view
        }()
    
        let galleryView3: UIView  = {
            let view = UIView()
            view.translatesAutoresizingMaskIntoConstraints  = false
            view.layer.cornerRadius = 4
            view.layer.masksToBounds = true
            view.backgroundColor = UIColor.blue
    
            return view
        }()
    
    
    
        override func viewDidLoad() {
            super.viewDidLoad()
    
            view.addSubview(containerScrollView)
            containerScrollView.addSubview(contentView)
            contentView.addSubview(galleryView1)
            contentView.addSubview(galleryView2)
            contentView.addSubview(galleryView3)
    
            // add scrollView constraints
    
            containerScrollView.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 0).isActive = true
    
            containerScrollView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: 0)
            .isActive = true
            containerScrollView.trailingAnchor.constraint(equalTo:self.view.trailingAnchor, constant: 0).isActive = true
    
            containerScrollView.bottomAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor, constant: 0).isActive = true
    
    
            // add contentView constraints
    
    
            contentView.topAnchor.constraint(equalTo: self.containerScrollView.topAnchor, constant: 0).isActive = true
    
            contentView.leadingAnchor.constraint(equalTo: self.containerScrollView.leadingAnchor, constant: 0).isActive = true
    
            contentView.trailingAnchor.constraint(equalTo:self.containerScrollView.trailingAnchor, constant: 0).isActive = true
    
            contentView.bottomAnchor.constraint(equalTo: self.containerScrollView.bottomAnchor, constant: 0).isActive = true
    
    
            contentView.widthAnchor.constraint(equalTo:self.view.widthAnchor, constant: 0).isActive = true
    
    
            // add galleryView1 constraints
    
    
            galleryView1.topAnchor.constraint(equalTo: self.contentView.topAnchor, constant: 0).isActive = true
    
            galleryView1.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 0).isActive = true
    
            galleryView1.trailingAnchor.constraint(equalTo:self.contentView.trailingAnchor, constant: 0).isActive = true
    
    
            galleryView1.heightAnchor.constraint(equalToConstant: 300).isActive = true
    
    
            // add galleryView2 constraints
    
    
            galleryView2.topAnchor.constraint(equalTo: self.galleryView1.bottomAnchor, constant: 30).isActive = true
    
            galleryView2.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 0).isActive = true
    
            galleryView2.trailingAnchor.constraint(equalTo:self.contentView.trailingAnchor, constant: 0).isActive = true
    
            galleryView2.heightAnchor.constraint(equalToConstant: 500).isActive = true
    
          // add galleryView3 constraints
    
    
            galleryView3.topAnchor.constraint(equalTo: self.galleryView2.bottomAnchor, constant: 30).isActive = true
    
            galleryView3.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 0).isActive = true
    
            galleryView3.trailingAnchor.constraint(equalTo:self.contentView.trailingAnchor, constant: 0).isActive = true
    
            galleryView3.heightAnchor.constraint(equalToConstant: 500).isActive = true
    
            galleryView3.bottomAnchor.constraint(equalTo: self.contentView.bottomAnchor, constant: -30).isActive = true
    
    
        }
    
    }
    

    【讨论】:

    • 这很好用,但是当 contentView 中的视图超出屏幕边界时,滚动视图不会向下滚动
    • 这是一个很好的答案!你有什么想法可以在循环中使用它来确定你想要多少个“画廊”而不是硬编码它?比如:x=10,创建10个画廊不用硬编码吗?如果那个 x = ?有多少人会创建那么多画廊?
    • 不工作! contentView 没有显示这些约束。我正在使用相同的。
    猜你喜欢
    • 1970-01-01
    • 2012-10-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-02-09
    相关资源
    最近更新 更多