Organisieren Sie und passen Sie die UILabel Position pro Geräte - Swift 3

Question

Ich habe SQLite-Datenbank-Datei und UILabel, und ich Text für Label aus der Datenbank auf die Anzahl der Zeichen nach String zu setzen, und ich habe die Erweiterung seinen Namen hinzugefügt (length) , der Job zählt die Anzahl der Zeichen.

Mein Problem in diesem Bild ist: Die UILabels sind in den Größen und Positionen in pro-Geräten nicht organisiert ich sie will, dass ihre Positionen in dem Zentrum haben X-Achse

Fragen :

1) wie die etikette in mitte und stellen räume rechts und links von bildschirm für etiketten (pro gerät) ??

2) Wie Breite für Etiketten setzen, wenn Gerät iPhone 7/6S/6 und Breite = 50, wenn das Gerät iPhone 7/6S/6 Breite = 45, und wenn Gerät iPhone SE/5S/5C/5 Breite = 38 ??

3) Wie wird die Beschriftung schließlich um 10 kleiner, wenn die Anzahl der Zeichen mehr als 8 beträgt?

Das ist mein Code:

func createTarget(id: Int) { 

    listdata = dbHelpr.getDatabase(rowId: id) 

    for data in listdata { 

     let lengthOfChar : CGFloat = data.ans.length 
     let yAxis : CGFloat = (self.view.frame.height) * 60% 
     let width: CGFloat = view.frame.size.width - 40 // frame width 
     var targetWidth: CGFloat = (width - (lengthOfChar - 1) * 5)/lengthOfChar 
     let targetHeigt : CGFloat = 5 

     if lengthOfChar >= 8 { 
      targetWidth = 40 
     } else { 
      targetWidth = 50 
     } 

     let totalWidth: CGFloat = (targetWidth * lengthOfChar) + ((lengthOfChar - 5) * 5) 

     for (indexTar, tar) in data.ans.characters.enumerated() { 

      let x : CGFloat = (width/2) - (totalWidth/2) 
      let xx : CGFloat = (CGFloat(indexTar) * targetWidth) + (CGFloat(indexTar) * 5) + 20 
      var xAxis : CGFloat = (x + xx) 
      xAxis = width - xAxis 



      let targetLabel = UILabel(frame: CGRect(x: xAxis, y: yAxis, width: targetWidth, height: targetHeigt)) 
      targetLabel.backgroundColor = .white 
      targetLabel.layer.masksToBounds = true 
      targetLabel.layer.cornerRadius = 5 
      targetLabel.text = String(describing: tar) 
      targetLabel.textAlignment = .center 
      targetLabel.textColor = .white 
      self.view.addSubview(targetLabel) 

     } 

    } 

} 

Answer 1

löste ich mein Problem und diese Antwort:

func createTarget(id: Int) { 

    listdata = dbHelpr.getDatabase(rowId: id) 
    var targetHeigt = CGFloat() 
    let viewWidth = self.view.frame.size.width 
    if viewWidth == 320 { 
     targetHeigt = 2.5 
    } else { 
     targetHeigt = 5 
    } 

    for data in listdata { 
     let yAxis : CGFloat = (self.view.frame.height) * 60% 
     let i = data.ans.length 
     // char count 
     let width: Int = Int(view.frame.size.width) - 40 

     // frame width 
     var targetWidth: Int = (width - (i - 1) * 5)/i 

     if targetWidth > 50 { 
      targetWidth = 50 
     } 
     let totalWidth: Int = (targetWidth * i) + ((i - 1) * 5) 

     for x in 0..<i { 
      let currentWidth: Int = (width/2) - (totalWidth/2) + (x * targetWidth) + (x * 5) + 20 

      let targetLabel = UILabel(frame: CGRect(x: CGFloat(currentWidth), y: yAxis, width: CGFloat(targetWidth), height: targetHeigt)) 
      targetLabel.backgroundColor = .white 
      targetLabel.layer.masksToBounds = true 
      targetLabel.layer.cornerRadius = 5 
      targetLabel.textAlignment = .center 
      targetLabel.textColor = .white 

      for i in listdata { 
       let tar = data.ans.characters.map{String($0)} 
       targetLabel.text = String(describing: tar) 
      } 
      self.view.addSubview(targetLabel) 
     } 
    } 
} 

Answer 2

Um Ihre Etiketten Sie ein paar Dinge Dinge müssen positionieren:

1. Etikettenbehälter alles zentriert zu halten und mit Margen von den Bildschirmseiten
2. Einschränkungen zwischen Ihren Etiketten abhängig von den Gerätegrößen usw.
3. Wenn Sie Linien brechen müssen - müssen Sie es handhaben sowohl manuell als auch

Um die Gerätearten zu identifizieren und haben unterschiedliche Logiken, können Sie diese Beiträge überprüfen: iOS: How to determine the current iPhone/device model in Swift?

Um Ihre Ansicht mit Etiketten zu füllen hier ist ein Beispielcode, dies zu erreichen:

self.view.backgroundColor = UIColor.black 

let labelContainerView : UIView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 10)) 
labelContainerView.translatesAutoresizingMaskIntoConstraints = false 

let containerLeftConstraint : NSLayoutConstraint = NSLayoutConstraint(item: self.view, attribute: .left, relatedBy: .greaterThanOrEqual, toItem: labelContainerView, attribute: .left, multiplier: 1, constant: 8) 
let containerRightConstraint : NSLayoutConstraint = NSLayoutConstraint(item: self.view, attribute: .right, relatedBy: .greaterThanOrEqual, toItem: labelContainerView, attribute: .right, multiplier: 1, constant: 8) 
let containerCenterX : NSLayoutConstraint = NSLayoutConstraint(item: labelContainerView, attribute: .centerX, relatedBy: .equal, toItem: self.view, attribute: .centerX, multiplier: 1, constant: 0) 
let containerCenterY : NSLayoutConstraint = NSLayoutConstraint(item: labelContainerView, attribute: .centerY, relatedBy: .equal, toItem: self.view, attribute: .centerY, multiplier: 1, constant: 0) 

self.view.addSubview(labelContainerView) 
self.view.addConstraints([ containerLeftConstraint, containerRightConstraint, containerCenterX, containerCenterY ]) 

// Add some labels 
let totalLabels : Int = 10 

var lastAddedLabel : UILabel? = nil 

for labelAt : Int in 1 ... totalLabels 
{ 
    var addedConstraint : [NSLayoutConstraint] = [NSLayoutConstraint]() 

    let label : UILabel = UILabel(frame: CGRect.zero) 
    label.translatesAutoresizingMaskIntoConstraints = false 
    label.text = "_" 
    label.textColor = UIColor.white 
    label.textAlignment = .center 
    label.adjustsFontSizeToFitWidth = true 

    if (lastAddedLabel != nil) 
    { 
     // Add left constraint to previous label 
     let leftConstraint : NSLayoutConstraint = NSLayoutConstraint(item: label, attribute: .left, relatedBy: .equal, toItem: lastAddedLabel!, attribute: .right, multiplier: 1, constant: 8) 
     let equalWidth : NSLayoutConstraint = NSLayoutConstraint(item: label, attribute: .width, relatedBy: .equal, toItem: lastAddedLabel!, attribute: .width, multiplier: 1, constant: 0) 

     addedConstraint.append(contentsOf: [ leftConstraint, equalWidth ]) 
    } 
    else 
    { 
     // Add left constraint to super view 
     let leftConstraint : NSLayoutConstraint = NSLayoutConstraint(item: labelContainerView, attribute: .left, relatedBy: .equal, toItem: label, attribute: .left, multiplier: 1, constant: 0) 

     addedConstraint.append(leftConstraint) 
    } 

    // Add top bottom constraint 
    let topConstraint : NSLayoutConstraint = NSLayoutConstraint(item: labelContainerView, attribute: .top, relatedBy: .equal, toItem: label, attribute: .top, multiplier: 1, constant: 0) 
    let bottomConstraint : NSLayoutConstraint = NSLayoutConstraint(item: labelContainerView, attribute: .bottom, relatedBy: .equal, toItem: label, attribute: .bottom, multiplier: 1, constant: 0) 

    addedConstraint.append(contentsOf: [ topConstraint, bottomConstraint ]) 

    // Add right constraint if this is the last label 
    if (labelAt == totalLabels) 
    { 
     let rightConstraint : NSLayoutConstraint = NSLayoutConstraint(item: labelContainerView, attribute: .right, relatedBy: .equal, toItem: label, attribute: .right, multiplier: 1, constant: 0) 

     addedConstraint.append(rightConstraint) 
    } 

    labelContainerView.addSubview(label) 
    labelContainerView.addConstraints(addedConstraint) 

    lastAddedLabel = label 
} 

self.view.layoutIfNeeded() 

Dies ergibt sich die Ausgabe:

Änderungen, die Sie möglicherweise vornehmen müssen:

1. Ändern Sie den „totalLabels“ Zahl je nach Anforderung
2. Vielleicht eine andere Breite Beschränkung auf das erste erzeugte Etikett, um das Hinzufügen einer spezifischen mit für alle Etiketten zu definieren - Die restlichen Etiketten behalten die gleiche Breite wie die ersten
3. Passen Sie die umschließenden Ansichtsränder von beiden Seiten für verschiedene Geräte an.
4. Behandeln Sie neue Zeilen manuell, indem Sie die Breite der Etiketten vorberechnen.

Viel Glück