组织和调整每个设备的UILabel位置 - 斯威夫特3

Question

我SQLite数据库文件的UILabel，我设置从数据库标签文本上的字符数转换String到Characters后，我添加的扩展它的名字（length） ，其作业计算字符的数量。

我在这张照片的问题是：该UILabels不是在大小和位置在每个我希望他们有自己的中心位置的设备组织X轴

问题：

1）如何将标签设置到中间位置并为标签的屏幕左右两侧设置空间（每个设备）？

2）如果设备是iPhone 7/6S/6 plus宽度= 50，如果设备是iPhone 7/6S/6宽度= 45且设备是iPhone SE/5S/5C，如何设置标签宽度/ 5宽度= 38？

3）最后，如果字符数大于8，标签如何变小10？

这是我的代码：

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

我解决我的问题，这样的回答：

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

为了你需要一些东西的东西来定位您的标签：

1. 标签的容器把一切都居中并从屏幕两侧边缘
2. 根据设备尺寸等，您的标签之间的限制条件。
3. 如果你需要换行 - 您需要手动处理它，以及

为了识别设备种类，有不同的逻辑，你可以检查这个帖子： iOS: How to determine the current iPhone/device model in Swift?

为了填补与标签视图这里是一个示例代码来实现这一目标：

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() 

这给了输出：

变化，你可能需要做：根据您的要求

1. 改变“totalLabels”号
2. 可能增加另一个宽度约束至第一生成的标签，以定义一个特定的与所有标签 - 其余标签保持与第一个相同的宽度
3. 调整不同设备两侧的包含视图边距
4. 通过预先计算标签可能使用的宽度手动处理新线。

好运