代码之家 › 专栏 › 技术社区 › Pradeep Kumar Kushwaha

ScrollView中的iOS动态内容视图未正确滚动

uiscrollview ios

Pradeep Kumar Kushwaha · 技术社区 · 6 年前

我创建了一个 ViewController 那已经 ScrollView 直系子女 View 现在我添加了一个 看法 在…内 卷轴视图 具有约束条件:

我添加了一个 VerticalLayout 使用以下代码初始化:

class VerticalLayout: UIView {

    var yOffsets: [CGFloat] = []
    var heightValue : CGFloat = 0.0

    init(width: CGFloat) {
        super.init(frame: CGRect(x:0, y:0, width:width, height:0))
    }

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

    override func layoutSubviews() {

        var height: CGFloat = 0

        for i in 0..<subviews.count {
            let view = subviews[i] as UIView
            view.layoutSubviews()
            height += yOffsets[i]
            view.frame.origin.y = height
            height += view.frame.height
        }

        self.frame.size.height = height
        self.heightValue = height

    }

    override func addSubview(_ view: UIView) {
        yOffsets.append(view.frame.origin.y)
        super.addSubview(view)
    }

    func removeAll() {
        for view in subviews {
            view.removeFromSuperview()
        }
        yOffsets.removeAll(keepingCapacity: false)

    }

}

和 视图控制器 代码为:

class ViewController: UIViewController {

    @IBOutlet var contentview: UIView!


    @IBOutlet var scrollview: UIScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()
        contentview.backgroundColor = UIColor.lightGray
        let vLayout = VerticalLayout(width: view.frame.width)
        vLayout.backgroundColor = UIColor.cyan
        contentview.addSubview(vLayout)

        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))
        contentview.frame.size.height = vLayout.heightValue
        contentview.layoutIfNeeded()
    }

    func getView(color:UIColor) -> UIView
    {
        let view = UIView(frame: CGRect(x:100, y:50, width:100, height:100))
        view.backgroundColor = color
        return view
    }
}

但当我运行此代码时,我会看到以下屏幕:

并且此屏幕的内容不可滚动。我错过了什么?

3 回复 | 直到 6 年前

Shehata Gamal 6 年前

这对我来说很好,而且我认为垂直 UIStackView 非常适合此类问题,而不是手动处理视图

class ViewController: UIViewController{

    @IBOutlet var contentview: UIView!

    @IBOutlet var scrollView: UIScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()


        contentview.backgroundColor = UIColor.lightGray

        let vLayout = VerticalLayout(width: view.frame.width)

        vLayout.backgroundColor = UIColor.cyan

        contentview.addSubview(vLayout)

        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))
        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))
        vLayout.addSubview(getView(color: UIColor.red))
        vLayout.addSubview(getView(color: UIColor.magenta))
        vLayout.addSubview(getView(color: UIColor.green))
        vLayout.addSubview(getView(color: UIColor.blue))
        vLayout.addSubview(getView(color: UIColor.yellow))

    }

    func getView(color:UIColor) -> UIView
    {
        let view = UIView(frame: CGRect(x:100, y:50, width:100, height:100))
        view.backgroundColor = color
        return view
    }


}

class VerticalLayout: UIView {

    var yOffsets: [CGFloat] = []
    var heightValue : CGFloat = 0.0

    init(width: CGFloat) {
        super.init(frame: CGRect(x:0, y:0, width:width, height:0))
    }

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

    override func layoutSubviews() {

        var height: CGFloat = 0

        for i in 0..<subviews.count {
            let view = subviews[i] as UIView
            view.layoutSubviews()
            height += yOffsets[i]
            view.frame.origin.y = height
            height += view.frame.height
        }

        // main edit is here

        self.frame.size.height = height

        self.heightValue = height

        let ff = self.superview

        let dd = ff?.superview as! UIScrollView

        dd.contentSize = CGSize.init(width: self.frame.size.width, height: height)

    }

    override func addSubview(_ view: UIView) {
        yOffsets.append(view.frame.origin.y)
        super.addSubview(view)
    }

    func removeAll() {
        for view in subviews {
            view.removeFromSuperview()
        }
        yOffsets.removeAll(keepingCapacity: false)

    }

}

Gajendra Rawat 6 年前

此处缺少滚动视图内容大小。请在添加视图后设置scrollview内容大小。

scrollView.contentSize = CGSize(width: height of total no of views, height: width of the screen)

kalpesh Jordan 6 年前

您只需将内容视图的约束设置为

顶部到超级视图
通向超级视野
拖尾到超级视图
从底部到超级视图
与超级视图等宽
与super view等高

和最后一个轻触等高约束并设置低优先级(250)。

你的卷轴会很好地工作。