Question 67694 in IOS Swift Question posted in
The official documentation can be found here.

Set Constraints to Labels So That One is At Leading Side and The Other at Trailing Side in Swift – Ios swift

I am programmatically adding a label and a button in Swift. I want the label to be at leading side and the button at trailing side. This is what I did so far:

let view = UIView.init(frame: CGRect.init(x: 0, y: 0, width: view.frame.width, height: 50))
        view.clipsToBounds = true
        view.translatesAutoresizingMaskIntoConstraints = false
        let label = UILabel()
        label.text = "Top-rated experts near you"
        label.font = UIFont.systemFont(ofSize: 18, weight: .medium)
        label.textColor = .black
        label.contentMode = .left
        
        let button = UIButton()
        button.backgroundColor = .clear
        button.setTitle("See All", for: .normal)
        button.setTitleColor(.black, for: .normal)
        button.contentMode = .right
        button.addTarget(self, action: #selector(buttonTapped(sender:)), for: .touchUpInside) 

        button.frame = CGRect.init(x: 100, y: 0, width: view.frame.width-25, height: view.frame.height-25)
        label.frame = CGRect.init(x: 10 , y: 0, width: view.frame.width-10, height: view.frame.height-10)

        view.addSubview(label)
        view.addSubview(button)

And this results in:

result

My desired result is:

desired

I want see all to be at trailing side and the top-rated label at the leading side. How can I achieve it in Swift?

Tags:

2

Answers


  1. 0

    Question is a little unclear, I think you are asking how to achieve the same layout with constraints instead of using frames?

    Here is a rough sample of how to do it, you might need to tweak the constants:

    override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
        
    let view = UIView(frame: CGRect.init(x: 0, y: 0, width: view.frame.width, height: 50))
        
    let label = UILabel()
    label.translatesAutoresizingMaskIntoConstraints = false
    label.text = "Top-rated experts near you"
    label.font = UIFont.systemFont(ofSize: 18, weight: .medium)
    label.textColor = .black
    label.contentMode = .left
        
    let button = UIButton()
    button.translatesAutoresizingMaskIntoConstraints = false
    button.backgroundColor = .clear
    button.setTitle("See All", for: .normal)
    button.setTitleColor(.black, for: .normal)
    button.contentMode = .right
    button.addTarget(self, action: #selector(buttonTapped(sender:)), for: .touchUpInside)
        
    view.addSubview(label)
    view.addSubview(button)
        
    NSLayoutConstraint.activate([
        label.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 16),
        label.trailingAnchor.constraint(equalTo: button.leadingAnchor, constant: 16),
        label.topAnchor.constraint(equalTo: view.topAnchor, constant: 16),
        label.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 16),
            
        button.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 16),
        button.topAnchor.constraint(equalTo: view.topAnchor, constant: 16),
        button.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 16)
    ])
        
    self.view.addSubview(view)
}
    Login or Signup to reply.
  2. 0 
    override func viewDidLoad() {
    super.viewDidLoad()

    let label = UILabel()
    label.text = "Top-rated experts near you"
    label.font = UIFont.systemFont(ofSize: 21, weight: .medium)
    label.textColor = .black
    label.contentMode = .left
    
    let button = UIButton()
    button.backgroundColor = .clear
    button.setTitle("See All", for: .normal)
    button.setTitleColor(.black, for: .normal)
    button.contentMode = .right
    button.addTarget(self, action: #selector(buttonTapped(sender:)), for: .touchUpInside)
    
    let stack = UIStackView(arrangedSubviews: [label, button])
    stack.axis = .horizontal
    stack.distribution = .fill
    stack.alignment = .center
    stack.spacing = 16
    stack.translatesAutoresizingMaskIntoConstraints = false
    
    view.addSubview(stack)
    
    let padding: CGFloat = 16
    let viewHeight: CGFloat = 50
    
    NSLayoutConstraint.activate([
        stack.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: padding),
        stack.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: padding),
        stack.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: 1-padding),
        stack.heightAnchor.constraint(equalToConstant: viewHeight)
    ])
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search