Edit UIStackView programmatically

Question

I'm currently trying to make a simple app which will have a small amount fo things to display depending on a users input. Currently, I have a stack view on my screen with a UIView inside of it. I am trying to make it so that once a button is pressed the UIView will disappear, then when another is pressed a new one will appear. The button can keep being pressed and more views will be put into the stack view.

Here is what I currently have, it doesn't work and I have no idea how I can get it to work after searching for an answer for a while:

import UIKit

class ViewController: UIViewController {
    
    @IBAction func deleteButtonPressed(_ button: PushButton) {
        
        @IBOutlet weak var containerStackView: UIStackView!
        containerStackView = UIStackView(arrangedSubviews: [removeIcons()])
    }

    func removeIcons() -> UIView {
        let newView = UIView(frame: CGRect(x: 0, y:0, width: 100, height: 100))
        return newView
    }
}

Is there any way to reference the stack view and then change it?

---- Edit

I now have this code:

class ViewController: UIViewController {
    @IBOutlet var containerStackView: UIStackView!

    @IBAction func deleteButtonPressed(_ sender: Any) {
        let newView = UIView(frame: CGRect(x: 0, y:0, width: 100, height: 100))
        newView.backgroundColor = UIColor.black
    
        containerStackView = UIStackView(arrangedSubviews: [newView])
    }
}

This seems to represent the stack view perfectly, however, when I press the button nothing seems to happen to the stack view. In theory, the UIView which is currently there should be replaced by a small black square created as 'newView'. Though this does not seem to happen - is there something obvious I'm missing?

Apologies for these questions, I'm new to swift and xcode.

score 2 · Answer 1 · answered Jun 25 '20 at 17:18

Try this:

class ViewController: UIViewController {
    //...
    @IBOutlet weak var containerStackView: UIStackView!
    //...
    @IBAction func deleteButtonPressed(_ button: PushButton) {
        let newView = UIView(frame: CGRect(x: 0, y:0, width: 100, height: 100))
        containerStackView.addArrangedSubview(newView)
    }
}

score 1 · Answer 2 · edited Jun 26 '20 at 18:05

First your outlet should be on top level:

import UIKit

class ViewController: UIViewController {
    @IBOutlet weak var containerStackView: UIStackView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func deleteButtonPressed(_ button: PushButton) {
        containerStackView = UIStackView(arrangedSubviews: [removeIcons()])
    }

    func removeIcons() -> UIView {
        let newView = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))

        return newView
    }
}

score 0 · Answer 3 · edited Jun 26 '20 at 12:50

Declare the outlet ouside the function in class scope outside

class ViewController: UIViewController {
    @IBOutlet weak var containerStackView: UIStackView! // here

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func deleteButtonPressed(_ button: PushButton) {
        containerStackView.subviews.forEach { $0.removeFromsuperView() }
    }

    @IBAction func daddButtonPressed(_ button: UIButton) {
        containerStackView = UIStackView(arrangedSubviews: [removeIcons()])
    }

    func removeIcons() -> UIView {
        let newView = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))

        return newView
    }
}

Edit UIStackView programmatically

3 Answers3