IBDesignable View avec des contraintes dynamiques: enfants mal placés lors du rendu

Question

J'essaie de créer (par programmation) une nouvelle vue et d'utiliser l'attribut IBDesignable pour simplifier ce processus et pour afficher les vues dans le storyboard au lieu des rectangles blancs. Voici une classe avec deux sous-vues: UILabel et UIImageView Je les ajoute dynamiquement à la vue parent et définir quelques contraintes pour eux:

import UIKit 

@IBDesignable 
class ChoiceView: UIView { 

    enum ChoiceState { 
     case empty, chosen 
    } 

    required init?(coder aDecoder: NSCoder) { 
     super.init(coder: aDecoder) 
     setupViewForState(.empty) 
    } 

    override init(frame: CGRect) { 
     super.init(frame: frame) 
     setupViewForState(.empty) 
    } 

    override func awakeFromNib() { 
     super.awakeFromNib() 
    } 

    override func layoutSubviews() { 
     super.layoutSubviews() 
    } 

    private func setupViewForState(_ state: ChoiceState) { 
     guard case .empty = state else { return } // single case for now 

     let placeholder = UILabel() 
     let choiceImage = UIImageView(image: UIImage(named: "plus_small")) 
     placeholder.text = "None" 
     placeholder.textAlignment = .right 
     choiceImage.contentMode = .center 

     let constraintFormats = [ 
      "H:|-0-[placeholder]-10-[choice(50)]-0-|", 
      "V:|-0-[placeholder]-0-|", 
      "V:|-0-[choice]-0-|" 
     ] 

     let views = ["placeholder": placeholder, "choice": choiceImage] 

     translatesAutoresizingMaskIntoConstraints = false 
     placeholder.translatesAutoresizingMaskIntoConstraints = false 
     choiceImage.translatesAutoresizingMaskIntoConstraints = false 
     addSubview(placeholder) 
     addSubview(choiceImage) 

     let constraints = constraintFormats.flatMap { 
      NSLayoutConstraint.constraints(
       withVisualFormat: $0, 
       options: .directionLeadingToTrailing, 
       metrics: nil, 
       views: views) 
     }   

     NSLayoutConstraint.activate(constraints) 
    } 

} 

Ce ne sont pas encore parfait, mais au moins - comme montré dans le simulateur:

Mais quand je recharge vues dans le générateur de storyboard, je vois ceci:

Comme vous pouvez le voir, les contraintes ne sont pas appliquées dans le storyboard et l'image n'est pas affichée. Savez-vous comment résoudre ce problème? Ou, est-il même possible d'obtenir la même image dans le storyboard et le simulateur?

---

Solution: S'il vous plaît regarder réponse @DonMag. Cela permet de voir le résultat attendu (voir photo ci-jointe).

Answer 1

Ne définissez pas translatesAutoresizingMaskIntoConstraints = false pour votre vue Designable se.

let views = ["placeholder": placeholder, "choice": choiceImage] 

    // don't do this one 
    //translatesAutoresizingMaskIntoConstraints = false 
    placeholder.translatesAutoresizingMaskIntoConstraints = false 
    choiceImage.translatesAutoresizingMaskIntoConstraints = false 
    addSubview(placeholder) 
    addSubview(choiceImage) 

Aussi, pour voir votre "choix" dans l'image IB:

let theBundle = Bundle(for: type(of: self)) 
    let choiceImage = UIImageView(image: UIImage(named: "plus_small", in: theBundle, compatibleWith: self.traitCollection)) 
    // 
    //let choiceImage = UIImageView(image: UIImage(named: "plus_small")) 
    ...