Add views in UIStackView programmatically
Stack views use intrinsic content size, so use layout constraints to define the dimensions of the views.
There is an easy way to add constraints quickly (example):
[view1.heightAnchor constraintEqualToConstant:100].active = true;
Complete Code:
- (void) setup { //View 1 UIView *view1 = [[UIView alloc] init]; view1.backgroundColor = [UIColor blueColor]; [view1.heightAnchor constraintEqualToConstant:100].active = true; [view1.widthAnchor constraintEqualToConstant:120].active = true; //View 2 UIView *view2 = [[UIView alloc] init]; view2.backgroundColor = [UIColor greenColor]; [view2.heightAnchor constraintEqualToConstant:100].active = true; [view2.widthAnchor constraintEqualToConstant:70].active = true; //View 3 UIView *view3 = [[UIView alloc] init]; view3.backgroundColor = [UIColor magentaColor]; [view3.heightAnchor constraintEqualToConstant:100].active = true; [view3.widthAnchor constraintEqualToConstant:180].active = true; //Stack View UIStackView *stackView = [[UIStackView alloc] init]; stackView.axis = UILayoutConstraintAxisVertical; stackView.distribution = UIStackViewDistributionEqualSpacing; stackView.alignment = UIStackViewAlignmentCenter; stackView.spacing = 30; [stackView addArrangedSubview:view1]; [stackView addArrangedSubview:view2]; [stackView addArrangedSubview:view3]; stackView.translatesAutoresizingMaskIntoConstraints = false; [self.view addSubview:stackView]; //Layout for Stack View [stackView.centerXAnchor constraintEqualToAnchor:self.view.centerXAnchor].active = true; [stackView.centerYAnchor constraintEqualToAnchor:self.view.centerYAnchor].active = true;}
Note: This was tested on iOS 9
Swift 5.0
//Image Viewlet imageView = UIImageView()imageView.backgroundColor = UIColor.blueimageView.heightAnchor.constraint(equalToConstant: 120.0).isActive = trueimageView.widthAnchor.constraint(equalToConstant: 120.0).isActive = trueimageView.image = UIImage(named: "buttonFollowCheckGreen")//Text Labellet textLabel = UILabel()textLabel.backgroundColor = UIColor.yellowtextLabel.widthAnchor.constraint(equalToConstant: self.view.frame.width).isActive = truetextLabel.heightAnchor.constraint(equalToConstant: 20.0).isActive = truetextLabel.text = "Hi World"textLabel.textAlignment = .center//Stack Viewlet stackView = UIStackView()stackView.axis = NSLayoutConstraint.Axis.verticalstackView.distribution = UIStackView.Distribution.equalSpacingstackView.alignment = UIStackView.Alignment.centerstackView.spacing = 16.0stackView.addArrangedSubview(imageView)stackView.addArrangedSubview(textLabel)stackView.translatesAutoresizingMaskIntoConstraints = falseself.view.addSubview(stackView)//ConstraintsstackView.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = truestackView.centerYAnchor.constraint(equalTo: self.view.centerYAnchor).isActive = true
Based on @user1046037 answer.
In Swift 4.2
let redView = UIView()redView.backgroundColor = .redlet blueView = UIView()blueView.backgroundColor = .bluelet stackView = UIStackView(arrangedSubviews: [redView, blueView])stackView.axis = .verticalstackView.distribution = .fillEquallyview.addSubview(stackView)// stackView.frame = CGRect(x: 0, y: 0, width: 200, height: 200)// autolayout constraintstackView.translatesAutoresizingMaskIntoConstraints = falseNSLayoutConstraint.activate([ stackView.topAnchor.constraint(equalTo: view.topAnchor), stackView.leftAnchor.constraint(equalTo: view.leftAnchor), stackView.rightAnchor.constraint(equalTo: view.rightAnchor), stackView.heightAnchor.constraint(equalToConstant: 200)])