ios - ScrollView 中的重叠元素

Question

尝试使用代码中创建的元素制作 ScrollView ，但我使这些元素彼此重叠。 Scrollview本身是用 Storyboard制作的。这是我的代码:

class ViewController: UIViewController {
    @IBOutlet weak var scrollView: UIScrollView! {
        didSet {
            scrollView.backgroundColor = .yellow
        }
    }

    lazy var im: UIImageView = {
        let im = UIImageView(frame: CGRect(x: 10, y: 74, width: self.view.frame.size.width - 20, height: 200))
        im.backgroundColor = .white
        return im
    }()

    lazy var label: UILabel = {
        let l = UILabel(frame: CGRect(x: 10, y: 284, width: self.view.frame.size.width - 20, height: CGFloat.greatestFiniteMagnitude))
        l.numberOfLines = 0
        l.lineBreakMode = .byWordWrapping
        l.text = "crazy amount of text"
        l.sizeToFit()
        self.scrollView.contentSize = CGSize(width: self.view.frame.width, height: l.frame.height + 280)
        return l
    }()


    override func viewDidLoad() {
        super.viewDidLoad()
        self.scrollView.addSubview(im)
        self.scrollView.addSubview(label)
    }
}

白色矩形是imageView!

如何防止这些元素重叠？

Answer 1

您可以将惰性变量im的代码更改为

lazy var im: UIImageView = {
        let im = UIImageView(frame: CGRect(x: 10, y: self.label.frame.height, width: self.view.frame.size.width - 20, height: 200))
        im.backgroundColor = .white
        return im
}()

要使图像位于顶部，您可以在 l.sizeToFit() 之后添加 l.frame.y = self.im.frame.height

lazy var label: UILabel = {
        let l = UILabel(frame: CGRect(x: 10, y: 200, width: self.view.frame.size.width - 20, height: CGFloat.greatestFiniteMagnitude))
        l.numberOfLines = 0
        l.lineBreakMode = .byWordWrapping
        l.text = "Big Text"
        l.sizeToFit()
        l.frame.y = self.im.frame.height
        self.scrollView.contentSize = CGSize(width: self.view.frame.width, height: l.frame.height + 280)
        return l
    }()

这会给你想要的结果。 希望对您有帮助!