Jolly
Jolly

Reputation: 283

UIStackView of subviews not Scrolling

I have a UIScrollView to which I have added a UIStackView of subviews. The subviews aren't scrollable, yet if I add buttons instead of UIViews, the stack view is scrollable. This code appears in the Detail View of a split view controller. Any idea as to why subviews aren't scrolling? BTW the detailItem will carry the index, but for now I am hardcoding the index[4] for a guaranteed long scrollworthy list.

import UIKit

class DetailViewController: UIViewController {

    var scrollView: UIScrollView!
    var stackView: UIStackView!

    var detailItem: AnyObject? {
        didSet {
        // Update the view.
     //   self.configureView()
     //   print("didSet: configureView")
        }
    }

override func viewDidLoad() {
    super.viewDidLoad()

    scrollView = UIScrollView()
    scrollView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(scrollView)

    view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[scrollView]|", options: .AlignAllCenterX, metrics: nil, views: ["scrollView": scrollView]))
    view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[scrollView]|", options: .AlignAllCenterX, metrics: nil, views: ["scrollView": scrollView]))


    stackView = UIStackView()
    stackView.translatesAutoresizingMaskIntoConstraints = false
    stackView.axis = .Vertical

    scrollView.addSubview(stackView)

    scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[stackView]|", options: NSLayoutFormatOptions.AlignAllCenterX, metrics: nil, views: ["stackView": stackView]))
    scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[stackView]", options: NSLayoutFormatOptions.AlignAllCenterX, metrics: nil, views: ["stackView": stackView]))
 /*
    for _ in 1 ..< 100 {
        let vw = UIButton(type: UIButtonType.System)
        vw.setTitle("Button", forState: .Normal)
        stackView.addArrangedSubview(vw)
    }
 */

    let selectedGroup: Group = GroupArray[4]

    let descriptorsArray = selectedGroup.descriptorsArray

    for descriptor in descriptorsArray {
        // Create a subview for each descriptor

        let subView = UIView()
        subView.frame = CGRectMake(0 , 0, self.view.frame.width-10, 50)
        subView.backgroundColor = UIColor.yellowColor()

        subView.heightAnchor.constraintEqualToConstant(50.0).active = true
        // Create a label for Descriptor subview
        let label = UILabel(frame: CGRectMake(20, 0, 200, 46))
        label.text = descriptor.name
        label.font = UIFont.boldSystemFontOfSize(22.0)
        label.textAlignment = .Left
        label.textColor = UIColor.brownColor()

        subView.addSubview(label)
        // Create a button for Checkbox

        stackView.addArrangedSubview(subView)

     }
}

}

Upvotes: 1

Views: 546

Answers (2)

MGY
MGY

Reputation: 8463

@Jolly You can try ScrollableStackView : https://github.com/gurhub/ScrollableStackView

It's Objective-C and Swift compatible library. It's available through CocoaPods.

Sample Code

import ScrollableStackView

var scrollable = ScrollableStackView(frame: view.frame)
view.addSubview(scrollable)

// add your views with 
let rectangle = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 55))
rectangle.backgroundColor = UIColor.blue
scrollable.stackView.addArrangedSubview(rectangle)
// ...

Upvotes: 0

matt
matt

Reputation: 534925

You are missing a constraint:

scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[stackView]|", options: NSLayoutFormatOptions.AlignAllCenterX, metrics: nil, views: ["stackView": stackView]))
scrollView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[stackView]", options: NSLayoutFormatOptions.AlignAllCenterX, metrics: nil, views: ["stackView": stackView]))

You have forgotten to pin the stack view to the bottom of the scroll view. Without that, the scroll view has no contentSize. Without a contentSize, no scrolling.

Upvotes: 1

Related Questions