Flipping the positions of items in a UIStackView

Question

I have a UIStackView, created in Interface Builder that contains two views. Now I'm trying to programatically change the order of these views (exchange their positions, so to speak).

Is there an easy fix for this that DOES NOT use Interface Builder to accomplish this?

Thanks :).

Tillford

How about changing semantic to .forceRightToLeft. That's an easy and quick but not a good fix. – Marinetti

Answer 1

Create a layout with 2 UIViews in a UIStackView like so:

Create an outlet for your UIStackView to your UIViewController. Call addArrangedSubview on your UIStackView in viewDidLoad to change the order. See snippet below.

import UIKit

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

    override func viewDidLoad() {
        super.viewDidLoad()

        // Switches order of the stackView
        stackView.addArrangedSubview(self.stackView.subviews[0])
    }
}

This should be the result:

The addArrangedSubview takes the given view and adds it to the end of the arrangedSubviews array. In our case we take the red view at index[0] and add it on the end (right) of the UIStackView.

Unpaged

what if i have 4-5 views inside stackview ? – Flann

Answer 2

You can change the view semantic of UIStackView from Unspecified to Force Right-to-Left to swap the position of of nested view.

Stomachic

teamOne.semanticContentAttribute = .forceRightToLeft doesn't seem to do anything for me, the result is the same – Tillford

hStack.semanticContentAttribute = checkBoxOnRight ? .forceLeftToRight : .forceRightToLeft worked for in Xcode 12, Swift 5.2 – Phenacetin

Agreed with @Tillford this did absolutely nothing for me xCode 13. – Phrasal

Answer 3

you can use addArragnedSubview to reorder the views. Only addArragnedSubview is needed because when adding the view to a new parent it is removed from the old parent.

    if self.viewsSwitched{
        stackview.addArrangedSubview(self.stackview.subviews[0])
        self.viewsSwitched = false
    }else{
        stackview.addArrangedSubview(self.stackview.subviews[1])
        self.viewsSwitched = true

    }

This code exchanges the two views inside the stackview by each call

Roughhouse