ios – UIStackView makes use of the width of the smallest organized view as an alternative of largest

0
70


I created a easy vertical stack view containing 3 subview with totally different width.
I pin the stack view to prime left of the mother or father and didn’t specify width on function.

I anticipate the stack view to make use of the width of the biggest subview as its width. As said from apple doc: https://developer.apple.com/documentation/uikit/uistackview

Quote:

Perpendicular to the stack view’s axis, its becoming measurement is the same as the scale of the biggest organized view.

however the consequence seems to be just like the stackview makes use of the width of the smallest subview.

result

I exploit .fill for alignment, however based mostly on its description https://developer.apple.com/documentation/uikit/uistackview/alignment/fill I do not see the way it impacts the stack view to make use of the smallest subview.

I do not perceive why the code behave this fashion.
Right here is my code:

import Basis
import UIKit
import SwiftUI
import SnapKit

class TestViewController: UIViewController {
    override func viewDidLoad() {
        tremendous.viewDidLoad()
        view.backgroundColor = .white
        
        // Create the stack view with a vertical axis
        let stackView = UIStackView()
        stackView.axis = .vertical
        stackView.backgroundColor = .grey
        stackView.spacing = 20
        stackView.alignment = .fill  // Change this to .resulting in see the impact
        stackView.translatesAutoresizingMaskIntoConstraints = false
        
        // Add the stack view to the view controller's view
        view.addSubview(stackView)
        
        // Constraints for the stack view
        stackView.snp.makeConstraints { make in
            make.prime.equalTo(view)
            make.left.equalTo(view)
        }
        
        // Create three views with totally different widths
        let view1 = UIView()
        view1.translatesAutoresizingMaskIntoConstraints = false
        view1.backgroundColor = .pink
        view1.snp.makeConstraints { make in
            make.width.equalTo(100)
            make.top.equalTo(50)
        }
        
        let view2 = UIView()
        view2.translatesAutoresizingMaskIntoConstraints = false
        view2.backgroundColor = .inexperienced
        view2.snp.makeConstraints { make in
            make.width.equalTo(200)
            make.top.equalTo(50)
        }
        
        let view3 = UIView()
        view3.translatesAutoresizingMaskIntoConstraints = false
        view3.backgroundColor = .blue
        view3.snp.makeConstraints { make in
            make.width.equalTo(300)
            make.top.equalTo(50)
        }
        
        // Add views to the stack view
        stackView.addArrangedSubview(view2)
        stackView.addArrangedSubview(view1)
        stackView.addArrangedSubview(view3)
    }
    
}



struct TestViewControllerTestView : UIViewControllerRepresentable {
    
    typealias UIViewControllerType = TestViewController
    
    func makeUIViewController(context: Context) -> TestViewController {
        return TestViewController()
    }
    
    func updateUIViewController(_ uiViewController: UIViewControllerType, context: Context) {
        
    }
}


struct TestViewController_Preview : PreviewProvider {
    static var previews: some View {
        TestViewControllerTestView()
    }
}