Set top alignment for labels with different font sizes, Swift 3

user_2534233 0
Viewed 1889

I have seen similar SO questions with Objective C code, without much help.

I have 2 labels (currencyLabel, costLabel) with different font sizes, I would like them to be aligned to the top as you can see in the below picture. I tried by setting the same top spacing (viewHeight / 3) for both, but that doesn't seem to work.

Constraints are set in the last 4 lines of the code.

Please advice if there is a better approach to do this.

enter image description here Here is the code:

override func viewDidLoad() {
    super.viewDidLoad()

    let viewWidth   =   self.view.bounds.width
    let viewHeight  =   self.view.bounds.height

    // 1. Creating Currency Label
    currencyLabel                 =   UILabel()
    currencyLabel.numberOfLines   =   1
    currencyLabel.text            =   "$"
    currencyLabel.textColor       =   Colors.curieBlue
    currencyLabel.font            =   UIFont.systemFont(ofSize: 50)

    // 1.1 Creating Cost Label
    costLabel                 =   UILabel()
    costLabel.numberOfLines   =   1
    costLabel.text            =   "15"
    costLabel.textColor       =   Colors.curieBlue
    costLabel.font            =   UIFont.boldSystemFont(ofSize: 150)

    // Disabling auto constraints
    currencyLabel.translatesAutoresizingMaskIntoConstraints =   false
    costLabel.translatesAutoresizingMaskIntoConstraints     =   false

    // Adding subviews to main view
    self.view.addSubview(currencyLabel)
    self.view.addSubview(costLabel)


    let views = [
        "currencyLabel"     :   currencyLabel,
        "costLabel"         :   costLabel
        ] as [String : Any]



    // Setting constraints for Cost Label
    view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-\(costLabelLeftSpacing)-[costLabel]", options: [], metrics: nil, views: views))
    view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-\(viewHeight / 3)-[costLabel]", options: [], metrics: nil, views: views))

    // Setting constraints for Currency Label
    view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:[currencyLabel]-10-[costLabel]", options: [], metrics: nil, views: views))
    view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-\(viewHeight / 3)-[currencyLabel]", options: [], metrics: nil, views: views))

}
swift constraints ios
3 Answers

I did using below code:

let font:UIFont? = UIFont(name: "Helvetica", size:30)

let fontSuper:UIFont? = UIFont(name: "Helvetica", size:18)

let fontspace:UIFont? = UIFont(name: "Helvetica", size:8)

let attString:NSMutableAttributedString = NSMutableAttributedString(string: "₹ 6000.00", attributes: [.font:font!])

attString.setAttributes([.font:fontSuper!,.baselineOffset:8], range: NSRange(location:0,length:1))

attString.setAttributes([.font:fontspace!,.baselineOffset:8], range: NSRange(location:1,length:1))

attString.setAttributes([.font:fontSuper!,.baselineOffset:0], range: NSRange(location:attString.length-3,length:3))

lblPrice.attributedText = attString
user_62387410
Related