Platziere Label über jedem Element in scrollview?

Question

Ich bevölkere meine Scrollview in einer for-Schleife und versuche, eine UILabel oben auf jedem eingefügten Element zu platzieren. Allerdings wird das Label aus irgendeinem Grund nicht horizontal zentriert, obwohl ich centerXAnchor auf centerXAnchor jedes Elements gleich setze. Hier ist ein Bild mit dem Etikett und Elemente Grenzen gezeigt:

Wie zu sehen ist, das Etikett I Einfügen bin nicht zentriert ist horizontal mit jedem Elemente in dem Scroll aus irgendeinem Grunde. Hier ist meine for-Schleife, wo ich die Scrollview füllen:

for i in 0..<petsDict.count { 
    let imageView = UIImageView() 
    imageView.image = petsDict[i] 
    imageView.contentMode = .scaleAspectFit 
    let xPos = self.view.frame.width * CGFloat(i) 
    imageView.frame = CGRect(x: xPos - CGFloat(20*i), y: 0, width: self.mainScrollView.frame.width, height: self.mainScrollView.frame.height) 


    let label = UILabel(frame: CGRect(x: 0, y: -20, width: 200, height: 40)) 
    label.text = "Joy" 
    label.textAlignment = .center 
    imageView.addSubview(label) 
    label.font = UIFont(name: "SFUIText-Regular", size: 20)! 
    label.sizeToFit() 

    mainScrollView.contentSize.width = mainScrollView.frame.width * CGFloat(i + 1) 
    mainScrollView.addSubview(imageView) 

    label.centerXAnchor.constraint(equalTo: imageView.centerXAnchor).isActive = true 
    label.bottomAnchor.constraint(equalTo: imageView.topAnchor).isActive = true 
} 

Kann jemand mir helfen, zu verstehen, warum meine x Zentrierung nicht richtig funktioniert?

Answer 1

Versuchen Sie, label.sizeToFit() zu entfernen, diese Funktion ändert die Größe Ihrer Etiketten.

Answer 2

for i in 0..<petsDict.count { 
let imageView = UIImageView() 
imageView.image = petsDict[i] 
imageView.contentMode = .scaleAspectFit 
let xPos = self.view.frame.width * CGFloat(i) 
imageView.frame = CGRect(x: xPos - CGFloat(20*i), y: 0, width: self.mainScrollView.frame.width, height: self.mainScrollView.frame.height) 


let label = UILabel(frame: CGRect(x: 0, y: -20, width: self.mainScrollView.frame.width, height: 20)) 
label.text = "Joy" 
label.textAlignment = .center 
imageView.addSubview(label) 
label.font = UIFont(name: "SFUIText-Regular", size: 20)! 

mainScrollView.contentSize.width = mainScrollView.frame.width * CGFloat(i + 1) 
mainScrollView.addSubview(imageView) 

label.centerXAnchor.constraint(equalTo: imageView.centerXAnchor).isActive = true 
label.bottomAnchor.constraint(equalTo: imageView.topAnchor).isActive = true 

}

Versuchen Sie diesen Code

Answer 3

Give Breite gleiche wie Ihre Imageview Breite zu beschriften und sizeToFit und Anker entfernen. Sie müssen nur die TextAlignment hinzufügen, die Sie bereits hinzugefügt haben.