ios – How do I add customized horizontal spacing to a view in a stack view with a number one alignment and vertical axis?

0
14
ios – How do I add customized horizontal spacing to a view in a stack view with a number one alignment and vertical axis?


I’ve a stack view that accommodates a title label and a view which occurs to be one other stack view that I wish to add customized spacing to. The composition I’m utilizing is predicated on the best way that’s described within the documentation for laying out views in UIStackView within the Outline the stack’s dimension alongside its axis part. The stack has a vertical axis and its prime and backside edges are pinned to the content material view’s prime and backside edges (the stack is a subview of a UICollectionViewCell). The forefront of the stack is pinned to the forefront of the content material view and is offset by a relentless 24 factors.

My precise implementation is as follows:

    func setUp() {
        
        titleView = UILabel()
        femaleIcon = UIImageView()
        maleIcon = UIImageView()
      [![enter image description here][1]][1]  
        femaleIcon.addGestureRecognizer(UITapGestureRecognizer(goal: self, motion: #selector(switchFemaleIcon)))
        
        femaleIcon.contentMode = .scaleAspectFit
        maleIcon.contentMode = .scaleAspectFit
        
        maleIcon.addGestureRecognizer(UITapGestureRecognizer(goal: self, motion: #selector(switchMaleIcon)))
        
        let iconStackView = UIStackView(arrangedSubviews: [
            femaleIcon,
            maleIcon
        ])
        
        iconStackView.axis = .horizontal
        iconStackView.translatesAutoresizingMaskIntoConstraints = false
        
        iconStackView.setCustomSpacing(50, after: femaleIcon)
        
        iconStackView.backgroundColor = .yellow
        
        let stackView = UIStackView(arrangedSubviews: [
            titleView,
            iconStackView
        ])
        
        stackView.axis = .vertical
        stackView.alignment = .main
        contentView.addSubview(stackView)
        
        stackView.backgroundColor = .magenta
        
        stackView.translatesAutoresizingMaskIntoConstraints = false
        
        
        stackView.setCustomSpacing(14, after: titleView)

        NSLayoutConstraint.activate([
            femaleIcon.widthAnchor.constraint(equalToConstant: 30),
            femaleIcon.heightAnchor.constraint(equalToConstant: 48),
            
            maleIcon.widthAnchor.constraint(equalToConstant: 36),
            maleIcon.heightAnchor.constraint(equalToConstant: 36.5),
            
            stackView.topAnchor.constraint(equalTo: contentView.topAnchor),
            stackView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor),
            stackView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor)
        ])
    }

enter image description here

The illustration I wish to obtain is as follows:

enter image description here

LEAVE A REPLY

Please enter your comment!
Please enter your name here