Add a dynamic part as subview in a view controller - ios

Question

I am trying to make a reusable PopUp view controller composed of the following:
a static part (the top one) with an image and a label
a dynamic part (lower one) that can contain either 1 large button, or 2 smaller one side by side or 2 smaller buttons on top of one another.
It should look like this:
For now here is what I did:
Created a PopUpViewController class
In the storyboard, added a VC with the PopUpViewController class
Added the outlets for the static part
And now, I don't know how to proceed.
The idea of showing/hiding objects depending on the style of the popup (1 or 2 buttons etc.) seems horrible to me.
I don't think I can use xibs ?
I wish I could use storyboards because I am unable to do the auto layout via code.
Is code still the way to go ?

Answer 1

You can create 3 buttons inside your code. And using an if statement either show the 2 small buttons or the big one. Otherwise i think u can add 2 "View" objects in your storyboard and add 2 buttons in one and 1 button on the other and show and hide the "View" you want again with an if statement.
Here is an example :
import UIKit
class ViewController: UIViewController {
var flag = false
var buttonSmallOne: UIButton!
var buttonSmallTwo: UIButton!
var buttonBigOne: UIButton!
override func viewDidLoad() {
super.viewDidLoad()
// Create the 3 buttons
buttonSmallOne = UIButton(frame: CGRect(x: self.view.bounds.width/2 - 50, y: self.view.bounds.height/2, width: 50, height: 50))
buttonSmallOne.backgroundColor = .green()
buttonSmallOne.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
buttonSmallTwo = UIButton(frame: CGRect(x: self.view.bounds.width/2 + 50, y: self.view.bounds.height/2, width: 50, height: 50))
buttonSmallTwo.backgroundColor = .green()
buttonSmallTwo.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
self.view.addSubview(buttonSmallOne)
self.view.addSubview(buttonSmallTwo)
buttonBigOne = UIButton(frame: CGRect(x: self.view.bounds.width/2-100, y: self.view.bounds.height/2, width: 100, height: 50))
buttonBigOne.backgroundColor = .red()
buttonBigOne.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
self.view.addSubview(buttonBigOne)
buttonBigOne.isHidden = true
buttonBigOne.isEnabled = false
}
func buttonAction(sender: UIButton!) {
if flag == false {
// Hide
buttonSmallOne.isHidden = true
buttonSmallOne.isEnabled = false
buttonSmallTwo.isHidden = true
buttonSmallTwo.isEnabled = false
// Show
buttonBigOne.isHidden = false
buttonBigOne.isEnabled = true
flag = true
}else{
// Show
buttonSmallOne.isHidden = false
buttonSmallOne.isEnabled = true
buttonSmallTwo.isHidden = false
buttonSmallTwo.isEnabled = true
// Hide
buttonBigOne.isHidden = true
buttonBigOne.isEnabled = false
flag = false
}
}
}

Answer 2

I would advise you to create a class for the container (for the dynamic content).
Create one class with a stack view in it(you can change from horizontal to vertical, based on button logic ).
Create third class with button and label in it.
Construct the container with the right views based on Enum configuration.
Create everything from code and added this container subview to your popOver on creation.
If you have to support iOS 8 you can use this with reachability(check for ios version). It works great for this kind of problems. And later on you can just rename it and delete iOS 8 code from the project. It has the same API as a stackView.
https://github.com/tomvanzummeren/TZStackView